feat(ui): add trakt external link (#2367)

* feat(ui): add trakt external link * feat(ui): move trakt to end of list of external links Co-authored-by: Ryan Cohen <ryan@sct.dev>
sct · Jan 9, 2022 · 4e56bae · 4e56bae
1 parent b4b2acd
commit 4e56bae
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/src/assets/services/trakt.svg b/src/assets/services/trakt.svg
diff --git a/src/components/ExternalLinkBlock/index.tsx b/src/components/ExternalLinkBlock/index.tsx
@@ -4,6 +4,7 @@ import ImdbLogo from '../../assets/services/imdb.svg';
 import PlexLogo from '../../assets/services/plex.svg';
 import RTLogo from '../../assets/services/rt.svg';
 import TmdbLogo from '../../assets/services/tmdb.svg';
+import TraktLogo from '../../assets/services/trakt.svg';
 import TvdbLogo from '../../assets/services/tvdb.svg';
 import useLocale from '../../hooks/useLocale';
 
@@ -78,6 +79,18 @@ const ExternalLinkBlock: React.FC<ExternalLinkBlockProps> = ({
           <RTLogo />
         </a>
       )}
+      {tmdbId && (
+        <a
+          href={`https://trakt.tv/search/tmdb/${tmdbId}?id_type=${
+            mediaType === 'movie' ? 'movie' : 'show'
+          }`}
+          className="w-8 transition duration-300 opacity-50 hover:opacity-100"
+          target="_blank"
+          rel="noreferrer"
+        >
+          <TraktLogo />
+        </a>
+      )}
     </div>
   );
 };