Refactor page.tsx to use local search params

app/(auth)/(tabs)/(home,libraries,search,favorites)/items/page.tsx

@@ -20,7 +20,8 @@ const Page: React.FC = () => {
   const { offline } = useLocalSearchParams() as { offline?: string };
   const isOffline = offline === "true";
 
-  const { data: item, isError } = useItemQuery(id, isOffline);
+  const { data: item, isError } = useItemQuery(itemId, false, undefined, [ItemFields.MediaSources]);
+  const { data: mediaSourcesitem, isError } = useItemQuery(id, isOffline);
 
   const opacity = useSharedValue(1);
   const animatedStyle = useAnimatedStyle(() => {
@@ -90,7 +91,7 @@ const Page: React.FC = () => {
         <View className='h-12 bg-neutral-900 rounded-lg w-full mb-2' />
         <View className='h-24 bg-neutral-900 rounded-lg mb-1 w-full' />
       </Animated.View>
-      {item && <ItemContent item={item} isOffline={isOffline} />}
+      {item && <ItemContent item={item} isOffline={isOffline} mediaSourcesItem={mediaSourcesItem} />}
     </View>
   );
 };

hooks/useItemQuery.ts

@@ -1,31 +1,56 @@
 import { getUserLibraryApi } from "@jellyfin/sdk/lib/utils/api";
+import { ItemFields } from "@jellyfin/sdk/lib/generated-client/models";
 import { useQuery } from "@tanstack/react-query";
 import { useAtom } from "jotai";
 import { useDownload } from "@/providers/DownloadProvider";
 import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
 
-export const useItemQuery = (itemId: string, isOffline: boolean) => {
+// Helper to exclude specific fields
+export const excludeFields = (fieldsToExclude: ItemFields[]) => {
+  return Object.values(ItemFields).filter(
+    (field) => !fieldsToExclude.includes(field)
+  );
+};
+
+export const useItemQuery = (
+  itemId: string | undefined,
+  isOffline?: boolean,
+  fields?: ItemFields[],
+  excludeFields?: ItemFields[]
+) => {
   const [api] = useAtom(apiAtom);
   const [user] = useAtom(userAtom);
   const { getDownloadedItemById } = useDownload();
 
+  // Calculate final fields: use excludeFields if provided, otherwise use fields
+  const finalFields = excludeFields 
+    ? Object.values(ItemFields).filter(field => !excludeFields.includes(field))
+    : fields;
+
   return useQuery({
-    queryKey: ["item", itemId],
+    queryKey: ["item", itemId, finalFields],
     queryFn: async () => {
+      if (!itemId) throw new Error('Item ID is required');
+      
       if (isOffline) {
         return getDownloadedItemById(itemId)?.item;
       }
-      if (!api || !user || !itemId) return null;
+      
-      const res = await getUserLibraryApi(api).getItem({
+      if (!api || !user) return null;
-        itemId: itemId,
+      
-        userId: user?.Id,
+      const response = await getUserLibraryApi(api).getItem({
+        itemId,
+        userId: user.Id,
+        ...(finalFields && { fields: finalFields }),
       });
-      return res.data;
+      
+      return response.data;
     },
+    enabled: !!itemId,
     staleTime: 0,
     refetchOnMount: true,
     refetchOnWindowFocus: true,
     refetchOnReconnect: true,
     networkMode: "always",
   });
-};
+};