wip: downloads "complete" is broken?

components/DownloadItem.tsx

@@ -66,7 +66,10 @@ export const DownloadItems: React.FC<DownloadProps> = ({
 
   const { processes, startBackgroundDownload, getDownloadedItems } =
     useDownload();
-  const downloadedFiles = getDownloadedItems();
+  const downloadedFiles = useMemo(
+    () => getDownloadedItems(),
+    [getDownloadedItems],
+  );
 
   const [selectedOptions, setSelectedOptions] = useState<
     SelectedOptions | undefined

components/downloads/DownloadSize.tsx

@@ -14,7 +14,10 @@ export const DownloadSize: React.FC<DownloadSizeProps> = ({
   ...props
 }) => {
   const { getDownloadedItemSize, getDownloadedItems } = useDownload();
-  const downloadedFiles = getDownloadedItems();
+  const downloadedFiles = useMemo(
+    () => getDownloadedItems(),
+    [getDownloadedItems],
+  );
   const [size, setSize] = useState<string | undefined>();
 
   const itemIds = useMemo(() => items.map((i) => i.Id), [items]);

components/home/HomeIndex.tsx

@@ -90,6 +90,11 @@ export const HomeIndex = () => {
     prevIsConnected.current = isConnected;
   }, [isConnected, invalidateCache]);
 
+  const hasDownloads = useMemo(() => {
+    if (Platform.isTV) return false;
+    return getDownloadedItems().length > 0;
+  }, [getDownloadedItems]);
+
   useEffect(() => {
     if (Platform.isTV) {
       navigation.setOptions({
@@ -97,7 +102,6 @@ export const HomeIndex = () => {
       });
       return;
     }
-    const hasDownloads = getDownloadedItems().length > 0;
     navigation.setOptions({
       headerLeft: () => (
         <TouchableOpacity
@@ -114,7 +118,7 @@ export const HomeIndex = () => {
         </TouchableOpacity>
       ),
     });
-  }, [navigation, router]);
+  }, [navigation, router, hasDownloads]);
 
   useEffect(() => {
     cleanCacheDirectory().catch((_e) =>
@@ -460,12 +464,7 @@ export const HomeIndex = () => {
       style={{ marginTop: Platform.isTV ? 0 : -100 }}
       contentContainerStyle={{ paddingTop: Platform.isTV ? 0 : 100 }}
     >
-      <AppleTVCarousel
-        initialIndex={0}
-        onItemChange={(index) => {
-          console.log(`Now viewing carousel item ${index}`);
-        }}
-      />
+      <AppleTVCarousel initialIndex={0} />
       <View
         style={{
           paddingLeft: insets.left,

components/series/SeasonEpisodesCarousel.tsx

@@ -29,7 +29,10 @@ export const SeasonEpisodesCarousel: React.FC<Props> = ({
   const [api] = useAtom(apiAtom);
   const [user] = useAtom(userAtom);
   const { getDownloadedItems } = useDownload();
-  const downloadedFiles = getDownloadedItems();
+  const downloadedFiles = useMemo(
+    () => getDownloadedItems(),
+    [getDownloadedItems],
+  );
 
   const scrollRef = useRef<HorizontalScrollRef>(null);
 

components/video-player/controls/EpisodeList.tsx

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