one more fileeee (hook time)

Author: NellowTCS

Build/src/helpers/importAudioFiles.tsx

@@ -1,7 +1,6 @@
 import { toast } from "sonner";
 import { createMetadataExtractor, createFloMetadataExtractor, compressAlbumArt, generateUniqueId } from "../platform/metadata";
 import { albumArtStorage } from "../platform/storage";
-import { setAlbumArtInCache } from "../hooks/useAlbumArt";
 import type { ExtractedMetadata } from "../platform/metadata";
 import type { Track } from "../core/engine/types";
 
@@ -147,8 +146,7 @@ export async function importAudioFiles(
         // Save album art separately if present
         const hasAlbumArt = !!compressedArt;
         if (hasAlbumArt && compressedArt) {
-          await albumArtStorage.save(songId, compressedArt);
-          setAlbumArtInCache(songId, compressedArt);
+          await           albumArtStorage.save(songId, compressedArt);
         }
 
         const song: Track = {

Build/src/hooks/useAlbumArt.tsx

@@ -1,34 +1,25 @@
 import { useState, useEffect, useRef } from "react";
 import { albumArtStorage } from "../platform/storage";
 
-// Cache to store loaded album arts in memory
-const loadedAlbumArts = new Map<string, string>();
-// Pending load requests to avoid duplicate fetches
 const pendingLoads = new Map<string, Promise<string | null>>();
 
-/**
- * Hook to lazily load album art for a single song
- * Only fetches from IndexedDB when needed, uses in-memory cache
- */
 export function useAlbumArt(
   songId: string | undefined,
   hasAlbumArt: boolean = false,
 ): string | undefined {
-  const [albumArt, setAlbumArt] = useState<string | undefined>(() => {
-    if (songId && loadedAlbumArts.has(songId)) {
-      return loadedAlbumArts.get(songId);
-    }
-    return undefined;
-  });
+  const [albumArt, setAlbumArt] = useState<string | undefined>(() =>
+    songId ? albumArtStorage.get(songId) : undefined,
+  );
 
   useEffect(() => {
     if (!songId || !hasAlbumArt) {
       setAlbumArt(undefined);
       return;
     }
 
-    if (loadedAlbumArts.has(songId)) {
-      setAlbumArt(loadedAlbumArts.get(songId));
+    const cached = albumArtStorage.get(songId);
+    if (cached) {
+      setAlbumArt(cached);
       return;
     }
 
@@ -42,25 +33,16 @@ export function useAlbumArt(
     const loadPromise = albumArtStorage.load(songId);
     pendingLoads.set(songId, loadPromise);
 
-    loadPromise
-      .then((art) => {
-        if (art) {
-          loadedAlbumArts.set(songId, art);
-          setAlbumArt(art);
-        }
-      })
-      .finally(() => {
-        pendingLoads.delete(songId);
-      });
+    loadPromise.then((art) => {
+      if (art) setAlbumArt(art);
+    }).finally(() => {
+      pendingLoads.delete(songId);
+    });
   }, [songId, hasAlbumArt]);
 
   return albumArt;
 }
 
-/**
- * Hook to batch load album art for visible songs
- * More efficient for lists - loads multiple arts in one IndexedDB transaction
- */
 export function useAlbumArtBatch(
   songs: Array<{ id: string; hasAlbumArt?: boolean }>,
 ): Map<string, string> {
@@ -71,80 +53,30 @@ export function useAlbumArtBatch(
     if (songs.length === 0) return;
 
     const toLoad = songs.filter(
-      (song) =>
-        song.hasAlbumArt &&
-        !loadedAlbumArts.has(song.id) &&
-        !loadedRef.current.has(song.id),
+      (song) => song.hasAlbumArt && !albumArtStorage.has(song.id) && !loadedRef.current.has(song.id),
     );
 
     if (toLoad.length === 0) {
       const cached = new Map<string, string>();
       for (const song of songs) {
-        if (loadedAlbumArts.has(song.id)) {
-          cached.set(song.id, loadedAlbumArts.get(song.id)!);
-        }
-      }
-      if (cached.size > 0) {
-        setAlbumArts(cached);
+        const art = albumArtStorage.get(song.id);
+        if (art) cached.set(song.id, art);
       }
+      if (cached.size > 0) setAlbumArts(cached);
       return;
     }
 
     toLoad.forEach((song) => loadedRef.current.add(song.id));
-
-    albumArtStorage
-      .loadBatch(toLoad.map((s) => s.id))
-      .then((loaded) => {
-        loaded.forEach((art, songId) => {
-          loadedAlbumArts.set(songId, art);
-        });
-
-        const allArts = new Map<string, string>();
-        for (const song of songs) {
-          if (loadedAlbumArts.has(song.id)) {
-            allArts.set(song.id, loadedAlbumArts.get(song.id)!);
-          }
-        }
-        setAlbumArts(allArts);
-      });
+    albumArtStorage.loadBatch(toLoad.map((s) => s.id)).then((loaded) => {
+      const allArts = new Map<string, string>();
+      for (const song of songs) {
+        const art = albumArtStorage.get(song.id);
+        if (art) allArts.set(song.id, art);
+      }
+      setAlbumArts(allArts);
+    });
   }, [songs]);
 
   return albumArts;
 }
 
-/**
- * Get album art directly from cache without loading
- * Returns undefined if not in cache
- */
-export function getAlbumArtFromCache(songId: string): string | undefined {
-  return loadedAlbumArts.get(songId);
-}
-
-/**
- * Preload album art for songs (useful for current/next songs)
- */
-export async function preloadAlbumArt(songIds: string[]): Promise<void> {
-  const toLoad = songIds.filter((id) => !loadedAlbumArts.has(id));
-  if (toLoad.length === 0) return;
-
-  const loaded = await albumArtStorage.loadBatch(toLoad);
-  loaded.forEach((art, songId) => {
-    loadedAlbumArts.set(songId, art);
-  });
-}
-
-/**
- * Clear album art cache to free memory
- * Call this when switching views or when memory pressure is high
- */
-export function clearAlbumArtCache(): void {
-  loadedAlbumArts.clear();
-  albumArtStorage.clearCache();
-}
-
-/**
- * Set album art in cache directly (used when importing new songs)
- */
-export function setAlbumArtInCache(songId: string, albumArt: string): void {
-  loadedAlbumArts.set(songId, albumArt);
-}

Build/src/platform/storage/albumArt.ts

@@ -122,6 +122,19 @@ export const albumArtStorage = {
   clearCache(): void {
     albumArtCache.clear();
   },
+
+  has(songId: string): boolean {
+    return albumArtCache.has(songId);
+  },
+
+  get(songId: string): string | undefined {
+    return albumArtCache.get(songId);
+  },
+
+  set(songId: string, albumArt: string): void {
+    evictCache();
+    albumArtCache.set(songId, albumArt);
+  },
 };
 
 function evictCache() {