fix: download status

components/DownloadItem.tsx

@@ -64,12 +64,8 @@ export const DownloadItems: React.FC<DownloadProps> = ({
   const { settings } = useSettings();
   const [downloadUnwatchedOnly, setDownloadUnwatchedOnly] = useState(false);
 
-  const { processes, startBackgroundDownload, getDownloadedItems } =
-    useDownload();
-  const downloadedFiles = useMemo(
-    () => getDownloadedItems(),
-    [getDownloadedItems],
-  );
+  const { processes, startBackgroundDownload, downloadedItems } = useDownload();
+  const downloadedFiles = downloadedItems;
 
   const [selectedOptions, setSelectedOptions] = useState<
     SelectedOptions | undefined

components/downloads/DownloadCard.tsx

@@ -119,18 +119,24 @@ export const DownloadCard = ({ process, ...props }: DownloadCardProps) => {
       {/* Action buttons in bottom right corner */}
       <View className='absolute bottom-2 right-2 flex flex-row items-center space-x-2 z-10'>
         {process.status === "downloading" && Platform.OS !== "ios" && (
-          <TouchableOpacity onPress={() => handlePause()} className='p-1'>
+          <TouchableOpacity
+            onPress={() => handlePause()}
+            className='p-2 bg-neutral-800 rounded-full'
+          >
             <Ionicons name='pause' size={20} color='white' />
           </TouchableOpacity>
         )}
         {process.status === "paused" && Platform.OS !== "ios" && (
-          <TouchableOpacity onPress={() => handleResume()} className='p-1'>
+          <TouchableOpacity
+            onPress={() => handleResume()}
+            className='p-2 bg-neutral-800 rounded-full'
+          >
             <Ionicons name='play' size={20} color='white' />
           </TouchableOpacity>
         )}
         <TouchableOpacity
           onPress={() => handleDelete(process.id)}
-          className='p-1'
+          className='p-2 bg-neutral-800 rounded-full'
         >
           <Ionicons name='close' size={20} color='red' />
         </TouchableOpacity>

components/downloads/DownloadSize.tsx

@@ -13,17 +13,13 @@ export const DownloadSize: React.FC<DownloadSizeProps> = ({
   items,
   ...props
 }) => {
-  const { getDownloadedItemSize, getDownloadedItems } = useDownload();
-  const downloadedFiles = useMemo(
-    () => getDownloadedItems(),
-    [getDownloadedItems],
-  );
+  const { getDownloadedItemSize, downloadedItems } = useDownload();
   const [size, setSize] = useState<string | undefined>();
 
   const itemIds = useMemo(() => items.map((i) => i.Id), [items]);
 
   useEffect(() => {
-    if (!downloadedFiles) return;
+    if (!downloadedItems) return;
 
     let s = 0;
 
@@ -35,7 +31,7 @@ export const DownloadSize: React.FC<DownloadSizeProps> = ({
       }
     }
     setSize(s.bytesToReadable());
-  }, [itemIds]);
+  }, [itemIds, downloadedItems, getDownloadedItemSize]);
 
   const sizeText = useMemo(() => {
     if (!size) return "...";

components/home/HomeIndex.tsx

@@ -72,7 +72,7 @@ export const HomeIndex = () => {
 
   const scrollViewRef = useRef<ScrollView>(null);
 
-  const { getDownloadedItems, cleanCacheDirectory } = useDownload();
+  const { downloadedItems, cleanCacheDirectory } = useDownload();
   const prevIsConnected = useRef<boolean | null>(false);
   const {
     isConnected,
@@ -92,8 +92,8 @@ export const HomeIndex = () => {
 
   const hasDownloads = useMemo(() => {
     if (Platform.isTV) return false;
-    return getDownloadedItems().length > 0;
-  }, [getDownloadedItems]);
+    return downloadedItems.length > 0;
+  }, [downloadedItems]);
 
   useEffect(() => {
     if (Platform.isTV) {

components/series/SeasonEpisodesCarousel.tsx

@@ -28,11 +28,7 @@ export const SeasonEpisodesCarousel: React.FC<Props> = ({
 }) => {
   const [api] = useAtom(apiAtom);
   const [user] = useAtom(userAtom);
-  const { getDownloadedItems } = useDownload();
-  const downloadedFiles = useMemo(
-    () => getDownloadedItems(),
-    [getDownloadedItems],
-  );
+  const { downloadedItems } = useDownload();
 
   const scrollRef = useRef<HorizontalScrollRef>(null);
 
@@ -45,10 +41,10 @@ export const SeasonEpisodesCarousel: React.FC<Props> = ({
   }, [item]);
 
   const { data: episodes, isPending } = useQuery({
-    queryKey: ["episodes", seasonId, isOffline],
+    queryKey: ["episodes", seasonId, isOffline, downloadedItems],
     queryFn: async () => {
       if (isOffline) {
-        return downloadedFiles
+        return downloadedItems
           ?.filter(
             (f) => f.item.Type === "Episode" && f.item.SeasonId === seasonId,
           )

components/video-player/controls/EpisodeList.tsx

@@ -55,11 +55,8 @@ export const EpisodeList: React.FC<Props> = ({ item, close, goToItem }) => {
     }
   }, []);
 
-  const { getDownloadedItems } = useDownload();
-  const downloadedFiles = useMemo(
-    () => getDownloadedItems(),
-    [getDownloadedItems],
-  );
+  const { downloadedItems } = useDownload();
+  const downloadedFiles = downloadedItems;
 
   const seasonIndex = seasonIndexState[item.ParentId ?? ""];