From 66f61c3c38e21cf84881ce860c4cbc1e91a05b2b Mon Sep 17 00:00:00 2001
From: herrrta <73949927+herrrta@users.noreply.github.com>
Date: Wed, 5 Mar 2025 20:07:21 -0500
Subject: [PATCH] fix: Recent request slider initial loading

---
 components/common/JellyseerrItemRouter.tsx    | 10 +++++++---
 .../discover/RecentRequestsSlide.tsx          |  4 ++--
 components/posters/JellyseerrPoster.tsx       | 20 ++++++++++---------
 hooks/useJellyseerr.ts                        | 10 +++++-----
 4 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/components/common/JellyseerrItemRouter.tsx b/components/common/JellyseerrItemRouter.tsx
index b132e437..ec1a1801 100644
--- a/components/common/JellyseerrItemRouter.tsx
+++ b/components/common/JellyseerrItemRouter.tsx
@@ -13,7 +13,7 @@ import {TvDetails} from "@/utils/jellyseerr/server/models/Tv";
 import {MovieDetails} from "@/utils/jellyseerr/server/models/Movie";
 
 interface Props extends TouchableOpacityProps {
-  result: MovieResult | TvResult | MovieDetails | TvDetails;
+  result?: MovieResult | TvResult | MovieDetails | TvDetails;
   mediaTitle: string;
   releaseYear: number;
   canRequest: boolean;
@@ -47,11 +47,13 @@ export const TouchableJellyseerrRouter: React.FC<PropsWithChildren<Props>> = ({
   }, [jellyseerrApi, jellyseerrUser]);
 
   const request = useCallback(
-    () =>
+    () => {
+      if (!result) return;
       requestMedia(mediaTitle, {
         mediaId: result.id,
         mediaType,
-      }),
+      })
+    },
     [jellyseerrApi, result]
   );
 
@@ -62,6 +64,8 @@ export const TouchableJellyseerrRouter: React.FC<PropsWithChildren<Props>> = ({
           <ContextMenu.Trigger>
             <TouchableOpacity
               onPress={() => {
+                if (!result) return;
+
                 // @ts-ignore
                 router.push({
                   pathname: `/(auth)/(tabs)/${from}/jellyseerr/page`,
diff --git a/components/jellyseerr/discover/RecentRequestsSlide.tsx b/components/jellyseerr/discover/RecentRequestsSlide.tsx
index 9a9902a6..dce6d7b9 100644
--- a/components/jellyseerr/discover/RecentRequestsSlide.tsx
+++ b/components/jellyseerr/discover/RecentRequestsSlide.tsx
@@ -34,7 +34,7 @@ const RequestCard: React.FC<{request: MediaRequest}> = ({request}) => {
   });
 
   return (
-    details && <JellyseerrPoster horizontal showDownloadInfo item={details} mediaRequest={refreshedRequest} />
+    <JellyseerrPoster horizontal showDownloadInfo item={details} mediaRequest={refreshedRequest} />
   )
 }
 
@@ -50,7 +50,7 @@ const RecentRequestsSlide: React.FC<SlideProps & ViewProps> = ({ slide, ...props
   });
 
   return (
-    requests && (
+    requests && requests.results.length > 0 && (
       <Slide
         {...props}
         slide={slide}
diff --git a/components/posters/JellyseerrPoster.tsx b/components/posters/JellyseerrPoster.tsx
index 194e081e..10d1f3c2 100644
--- a/components/posters/JellyseerrPoster.tsx
+++ b/components/posters/JellyseerrPoster.tsx
@@ -20,7 +20,7 @@ import {Colors} from "@/constants/Colors";
 import {Tags} from "@/components/GenreTags";
 
 interface Props extends ViewProps {
-  item: MovieResult | TvResult | MovieDetails | TvDetails;
+  item?: MovieResult | TvResult | MovieDetails | TvDetails;
   horizontal?: boolean;
   showDownloadInfo?: boolean;
   mediaRequest?: MediaRequest;
@@ -48,12 +48,12 @@ const JellyseerrPoster: React.FC<Props> = ({
   };
 
   const backdropSrc = useMemo(
-    () => jellyseerrApi?.imageProxy(item.backdropPath, "w1920_and_h800_multi_faces"),
+    () => jellyseerrApi?.imageProxy(item?.backdropPath, "w1920_and_h800_multi_faces"),
     [item, jellyseerrApi, horizontal]
   );
 
   const posterSrc = useMemo(
-    () => jellyseerrApi?.imageProxy(item.posterPath, "w300_and_h450_face",),
+    () => jellyseerrApi?.imageProxy(item?.posterPath, "w300_and_h450_face",),
     [item, jellyseerrApi, horizontal]
   );
 
@@ -122,8 +122,8 @@ const JellyseerrPoster: React.FC<Props> = ({
           <Animated.View style={imageAnimatedStyle}>
             <Image
               className="w-full"
-              key={item.id}
-              id={item.id.toString()}
+              key={item?.id}
+              id={item?.id.toString()}
               source={{ uri: horizontal ? backdropSrc : posterSrc }}
               cachePolicy={"memory-disk"}
               contentFit="cover"
@@ -184,10 +184,12 @@ const JellyseerrPoster: React.FC<Props> = ({
           />
         </View>
       </View>
-      <View className={`mt-2 flex flex-col ${horizontal ? 'w-44' : 'w-28'}`}>
-        <Text numberOfLines={2}>{title}</Text>
-        <Text className="text-xs opacity-50 align-bottom">{releaseYear}</Text>
-      </View>
+      {item && (
+        <View className={`mt-2 flex flex-col ${horizontal ? 'w-44' : 'w-28'}`}>
+          <Text numberOfLines={2}>{title}</Text>
+          <Text className="text-xs opacity-50 align-bottom">{releaseYear}</Text>
+        </View>
+      )}
     </TouchableJellyseerrRouter>
   );
 };
diff --git a/hooks/useJellyseerr.ts b/hooks/useJellyseerr.ts
index 7c860180..f7400dc1 100644
--- a/hooks/useJellyseerr.ts
+++ b/hooks/useJellyseerr.ts
@@ -464,22 +464,22 @@ export const useJellyseerr = () => {
     )
   };
 
-  const getTitle = (item: TvResult | TvDetails | MovieResult | MovieDetails) => {
+  const getTitle = (item?: TvResult | TvDetails | MovieResult | MovieDetails) => {
     return isJellyseerrResult(item)
       ? (item.mediaType == MediaType.MOVIE ? item?.title : item?.name)
-      : (item.mediaInfo.mediaType == MediaType.MOVIE ? (item as MovieDetails)?.title : (item as TvDetails)?.name)
+      : (item?.mediaInfo.mediaType == MediaType.MOVIE ? (item as MovieDetails)?.title : (item as TvDetails)?.name)
   };
 
-  const getYear = (item: TvResult | TvDetails | MovieResult | MovieDetails) => {
+  const getYear = (item?: TvResult | TvDetails | MovieResult | MovieDetails) => {
     return new Date((
       isJellyseerrResult(item)
       ? (item.mediaType == MediaType.MOVIE ? item?.releaseDate : item?.firstAirDate)
-      : (item.mediaInfo.mediaType == MediaType.MOVIE ? (item as MovieDetails)?.releaseDate : (item as TvDetails)?.firstAirDate))
+      : (item?.mediaInfo.mediaType == MediaType.MOVIE ? (item as MovieDetails)?.releaseDate : (item as TvDetails)?.firstAirDate))
       || ""
     )?.getFullYear?.()
   };
 
-  const getMediaType = (item: TvResult | TvDetails | MovieResult | MovieDetails): MediaType => {
+  const getMediaType = (item?: TvResult | TvDetails | MovieResult | MovieDetails): MediaType => {
     return isJellyseerrResult(item)
       ? item.mediaType
       : item?.mediaInfo?.mediaType