From 734678b1d5ebf4ae48f853fae12c218a80bfce28 Mon Sep 17 00:00:00 2001
From: herrrta <73949927+herrrta@users.noreply.github.com>
Date: Sat, 4 Jan 2025 21:28:45 -0500
Subject: [PATCH] [Jellyseerr] Add external links to trailers

implements #328
---
 .../jellyseerr/page.tsx                        | 18 ++++++++++++++++--
 components/series/SeriesActions.tsx            | 11 +++++++++--
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/app/(auth)/(tabs)/(home,libraries,search,favorites)/jellyseerr/page.tsx b/app/(auth)/(tabs)/(home,libraries,search,favorites)/jellyseerr/page.tsx
index 25fc8cb8..31334dcc 100644
--- a/app/(auth)/(tabs)/(home,libraries,search,favorites)/jellyseerr/page.tsx
+++ b/app/(auth)/(tabs)/(home,libraries,search,favorites)/jellyseerr/page.tsx
@@ -1,5 +1,5 @@
-import React, {useCallback, useMemo, useRef, useState} from "react";
-import { useLocalSearchParams } from "expo-router";
+import React, {useCallback, useEffect, useMemo, useRef, useState} from "react";
+import {useLocalSearchParams, useNavigation} from "expo-router";
 import { MovieResult, TvResult } from "@/utils/jellyseerr/server/models/Search";
 import { Text } from "@/components/common/Text";
 import { ParallaxScrollView } from "@/components/ParallaxPage";
@@ -29,6 +29,7 @@ import JellyseerrSeasons from "@/components/series/JellyseerrSeasons";
 import { JellyserrRatings } from "@/components/Ratings";
 import MediaRequest from "@/utils/jellyseerr/server/entity/MediaRequest";
 import DetailFacts from "@/components/jellyseerr/DetailFacts";
+import {ItemActions} from "@/components/series/SeriesActions";
 
 const Page: React.FC = () => {
   const insets = useSafeAreaInsets();
@@ -46,6 +47,7 @@ const Page: React.FC = () => {
     posterSrc: string;
   } & Partial<MovieResult | TvResult>;
 
+  const navigation = useNavigation();
   const { jellyseerrApi, requestMedia } = useJellyseerr();
 
   const [issueType, setIssueType] = useState<IssueType>();
@@ -120,6 +122,18 @@ const Page: React.FC = () => {
     [details, result, requestMedia]
   );
 
+  useEffect(() => {
+    if (details) {
+      navigation.setOptions({
+        headerRight: () =>
+        <TouchableOpacity className="rounded-full p-1.5 bg-neutral-800/80">
+          <ItemActions item={details} />
+        </TouchableOpacity>
+      });
+    }
+
+  }, [details]);
+
   return (
     <View
       className="flex-1 relative"
diff --git a/components/series/SeriesActions.tsx b/components/series/SeriesActions.tsx
index 80d219f5..0885e411 100644
--- a/components/series/SeriesActions.tsx
+++ b/components/series/SeriesActions.tsx
@@ -3,15 +3,22 @@ import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client";
 import { useRouter } from "expo-router";
 import { useCallback, useMemo } from "react";
 import { TouchableOpacity, View, ViewProps } from "react-native";
+import {MovieDetails} from "@/utils/jellyseerr/server/models/Movie";
+import {TvDetails} from "@/utils/jellyseerr/server/models/Tv";
 
 interface Props extends ViewProps {
-  item: BaseItemDto;
+  item: BaseItemDto | MovieDetails | TvDetails;
 }
 
 export const ItemActions = ({ item, ...props }: Props) => {
   const router = useRouter();
 
-  const trailerLink = useMemo(() => item.RemoteTrailers?.[0]?.Url, [item]);
+  const trailerLink = useMemo(() => {
+    const url = (item as BaseItemDto).RemoteTrailers?.[0]?.Url
+    if (url)
+      return url
+    return (item as MovieDetails | TvDetails)?.relatedVideos?.find(v => v.type === "Trailer")?.url
+  }, [item]);
 
   const openTrailer = useCallback(async () => {
     if (!trailerLink) return;