chore

components/series/CastAndCrew.tsx

@@ -1,11 +1,15 @@
+import { getPrimaryImage } from "@/utils/jellyfin";
 import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
 import React from "react";
 import { TouchableOpacity, View } from "react-native";
 import { HorizontalScroll } from "../common/HorrizontalScroll";
 import { Text } from "../common/Text";
 import Poster from "../Poster";
+import { useAtom } from "jotai";
+import { apiAtom } from "@/providers/JellyfinProvider";
 
 export const CastAndCrew = ({ item }: { item: BaseItemDto }) => {
+  const [api] = useAtom(apiAtom);
   return (
     <View>
       <Text className="text-lg font-bold mb-2 px-4">Cast & Crew</Text>
@@ -13,7 +17,7 @@ export const CastAndCrew = ({ item }: { item: BaseItemDto }) => {
         data={item.People}
         renderItem={(item, index) => (
           <TouchableOpacity key={item.Id} className="flex flex-col w-32">
-            <Poster itemId={item.Id} />
+            <Poster item={item} url={getPrimaryImage({ api, item })} />
             <Text className="mt-2">{item.Name}</Text>
             <Text className="text-xs opacity-50">{item.Role}</Text>
           </TouchableOpacity>

components/series/CurrentSeries.tsx

@@ -1,5 +1,8 @@
+import { apiAtom } from "@/providers/JellyfinProvider";
+import { getPrimaryImage, getPrimaryImageById } from "@/utils/jellyfin";
 import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
 import { router } from "expo-router";
+import { useAtom } from "jotai";
 import React from "react";
 import { TouchableOpacity, View } from "react-native";
 import Poster from "../Poster";
@@ -7,6 +10,8 @@ import { HorizontalScroll } from "../common/HorrizontalScroll";
 import { Text } from "../common/Text";
 
 export const CurrentSeries = ({ item }: { item: BaseItemDto }) => {
+  const [api] = useAtom(apiAtom);
+
   return (
     <View>
       <Text className="text-lg font-bold mb-2 px-4">Series</Text>
@@ -18,7 +23,10 @@ export const CurrentSeries = ({ item }: { item: BaseItemDto }) => {
             onPress={() => router.push(`/series/${item.SeriesId}/page`)}
             className="flex flex-col space-y-2 w-32"
           >
-            <Poster itemId={item.ParentBackdropItemId} />
+            <Poster
+              item={item}
+              url={getPrimaryImageById({ api, id: item.ParentId })}
+            />
             <Text>{item.SeriesName}</Text>
           </TouchableOpacity>
         )}

components/series/SeasonPicker.tsx

@@ -114,7 +114,7 @@ export const SeasonPicker: React.FC<Props> = ({ item }) => {
         </DropdownMenu.Content>
       </DropdownMenu.Root>
       {episodes && (
-        <View className="mt-2">
+        <View className="mt-4">
           <HorizontalScroll<BaseItemDto>
             data={episodes}
             renderItem={(item, index) => (