fix: random fixes

fix some layout in the game library
fix freezing in game library loading
fix deadlock when trying to change library path

Author: viniciuslrangel

src/components/game-box.tsx

@@ -175,7 +175,7 @@ export function GameBox({ game }: { game: GameRow; isFirst?: boolean }) {
 
     return (
         <ContextMenu onOpenChange={setContextOpen}>
-            <ContextMenuTrigger ref={contextMenuRef}>
+            <ContextMenuTrigger asChild ref={contextMenuRef}>
                 <Navigable onButtonPress={onButtonPress}>
                     <div
                         className="group relative aspect-square h-auto w-full min-w-[150px] max-w-[200px] flex-1 cursor-pointer overflow-hidden rounded-sm bg-zinc-800 transition-transform focus-within:scale-110 hover:scale-110 data-gamepad-focus:scale-110"

src/components/game-library.tsx

@@ -54,7 +54,7 @@ function Grid({ search }: { search: string }) {
     "use no memo"; // Temporary while https://github.com/TanStack/virtual/pull/851 is not merged
 
     const parentRef = useRef<HTMLDivElement | null>(null);
-    const { games } = useAtomValue(atomGameLibrary);
+    const games = useAtomValue(atomGameLibrary);
     const sortType = useAtomValue(atomGameLibrarySorting);
     const [itemPerRow, setItemPerRow] = useState(1);
 

src/components/modals/version-manager-modal.tsx

@@ -194,7 +194,7 @@ function TabAvailableVersion() {
             <TableBody>
                 {data?.map((v) => (
                     <VersionTableRow
-                        date={format(v.date, "PP")}
+                        date={v.date ? format(v.date, "PP") : "Unknown"}
                         key={JSON.stringify(v)}
                         prePelease={v.prerelease}
                         release={v.name}

src/components/toolbar.tsx

@@ -15,7 +15,7 @@ import { useDebounceEffect } from "@/lib/hooks/useDebounceEffect";
 import { cn } from "@/lib/utils/ui";
 import { atomFolderConfigModalIsOpen, oficialRepo } from "@/store/common";
 import {
-    atomGameLibrary,
+    atomGameLibraryIsIndexing,
     atomGameLibrarySorting,
     SortType,
 } from "@/store/game-library";
@@ -129,7 +129,7 @@ export function Toolbar({ onSearch = () => void 0 }: Props) {
     const setFolderConfigModalOpen = useSetAtom(atomFolderConfigModalIsOpen);
     const [sort, setSort] = useAtom(atomGameLibrarySorting);
     const [isSortOpen, setSortOpen] = useState(false);
-    const { indexing } = useAtomValue(atomGameLibrary);
+    const indexing = useAtomValue(atomGameLibraryIsIndexing);
 
     const [search, setSearch] = useState("");
     useDebounceEffect(search, 200, onSearch);

src/store/db.ts

@@ -30,6 +30,9 @@ export const db = {
     async removeGame(path: string): Promise<void> {
         await conn.execute("DELETE FROM games WHERE path = $1", [path]);
     },
+    async removeAllGames(): Promise<void> {
+        await conn.execute("DELETE FROM games");
+    },
     async addGame(data: GameRow): Promise<void> {
         await conn.execute(
             "INSERT INTO games (path, cusa, title, version, fw_version, sfo_json) VALUES ($1, $2, $3, $4, $5, $6)",

src/store/game-library.ts

@@ -21,13 +21,8 @@ export const atomGameLibrarySorting = atomWithTauriStore<SortType, false>(
     { initialValue: SortType.NONE },
 );
 
-export const atomGameLibrary = atom<{
-    indexing: boolean;
-    games: GameRow[];
-}>({
-    indexing: false,
-    games: [],
-});
+export const atomGameLibraryIsIndexing = atom(false);
+export const atomGameLibrary = atom<GameRow[]>([]);
 
 async function loadGameData(path: string): Promise<GameRow> {
     try {
@@ -83,53 +78,60 @@ async function loadGameData(path: string): Promise<GameRow> {
     }
 }
 
-async function registerGamePath(path: string) {
-    console.debug(`Loading game from ${path}`);
-    const gameData = await loadGameData(path);
-    if (!("error" in gameData)) {
-        db.addGame(gameData);
+const gameRegisterQueue: string[] = [];
+let gameRegisterQueueIsUse = false;
+
+async function registerGamePath(workPath: string) {
+    console.debug(`Loading game from ${workPath}`);
+    gameRegisterQueue.push(workPath);
+    if (gameRegisterQueueIsUse) {
+        return;
+    }
+    gameRegisterQueueIsUse = true;
+    while (gameRegisterQueue.length > 0) {
+        const path = gameRegisterQueue.shift();
+        if (!path) {
+            break;
+        }
+        const gameData = await loadGameData(path);
+        if (!("error" in gameData)) {
+            db.addGame(gameData);
+        }
+        defaultStore.set(atomGameLibrary, (prev) =>
+            prev.filter((e) => e.path !== path).concat(gameData),
+        );
     }
-    defaultStore.set(atomGameLibrary, (prev) => ({
-        ...prev,
-        games: prev.games.filter((e) => e.path !== path).concat(gameData),
-    }));
+    gameRegisterQueueIsUse = false;
 }
 
 async function unregisterGamePathPrefix(
     pathPrefix: string,
     knownPaths: Set<string>,
 ) {
-    defaultStore.set(atomGameLibrary, (prev) => {
-        return {
-            ...prev,
-            games: prev.games.filter((e) => {
-                const toRemove = e.path.startsWith(pathPrefix);
-                if (toRemove) {
-                    knownPaths.delete(e.path);
-                    db.removeGame(e.path);
-                }
-                return !toRemove;
-            }),
-        };
-    });
+    defaultStore.set(atomGameLibrary, (prev) =>
+        prev.filter((e) => {
+            const toRemove = e.path.startsWith(pathPrefix);
+            if (toRemove) {
+                knownPaths.delete(e.path);
+                db.removeGame(e.path);
+            }
+            return !toRemove;
+        }),
+    );
 }
 
 async function isGame(path: string) {
     const eBootPath = await join(path, "eboot.bin");
     return await exists(eBootPath);
 }
 
-let indexingCount = 0;
-
 async function scanDirectory(
     path: string,
     knownPaths: Set<string>,
     signal: AbortSignal,
     recursionLevel: number,
 ) {
     try {
-        indexingCount++;
-
         if (recursionLevel > 3 || signal.aborted) {
             return;
         }
@@ -140,14 +142,14 @@ async function scanDirectory(
             return;
         }
         if (await isGame(path)) {
-            setTimeout(() => registerGamePath(path), 1);
+            void registerGamePath(path);
             return;
         }
         const children = await readDir(path);
         for (const c of children) {
             if (c.isDirectory) {
                 const childPath = await join(path, c.name);
-                scanDirectory(
+                await scanDirectory(
                     childPath,
                     knownPaths,
                     signal,
@@ -157,54 +159,47 @@ async function scanDirectory(
         }
     } catch (e: unknown) {
         console.error(`Error discovering game at "${path}"`, e);
-    } finally {
-        indexingCount--;
-        if (indexingCount === 0) {
-            defaultStore.set(atomGameLibrary, (prev) => ({
-                ...prev,
-                indexing: false,
-            }));
-        }
     }
 }
 
 (async () => {
     const cachedGames = await db.listGames();
-    defaultStore.set(atomGameLibrary, {
-        indexing: true,
-        games: cachedGames,
-    });
+    defaultStore.set(atomGameLibraryIsIndexing, true);
+    defaultStore.set(atomGameLibrary, cachedGames);
 
     const knownPaths = new Set<string>();
 
     for (const e of cachedGames) {
         knownPaths.add(e.path);
     }
 
-    let first = true;
-
+    let prevPath: string | null = null;
     let cancel: (() => void) | undefined;
+
     defaultStore.sub(atomGamesPath, async () => {
         cancel?.();
         cancel = undefined;
 
         try {
-            if (!first) {
-                first = false;
-                defaultStore.set(atomGameLibrary, {
-                    indexing: true,
-                    games: [],
-                });
+            const path = defaultStore.get(atomGamesPath);
+            if (prevPath != null && prevPath !== path) {
+                await db.removeAllGames();
+                defaultStore.set(atomGameLibraryIsIndexing, true);
+                defaultStore.set(atomGameLibrary, []);
                 knownPaths.clear();
             }
-            indexingCount = 0;
-            const path = defaultStore.get(atomGamesPath);
+            prevPath = path;
             if (path) {
                 if (!(await exists(path))) {
                     await mkdir(path, { recursive: true });
                 }
                 const abortController = new AbortController();
-                scanDirectory(path, knownPaths, abortController.signal, 0);
+                await scanDirectory(
+                    path,
+                    knownPaths,
+                    abortController.signal,
+                    0,
+                );
                 const unsub = await watch(path, async (e) => {
                     if (typeof e.type === "object") {
                         if ("create" in e.type) {
@@ -220,12 +215,20 @@ async function scanDirectory(
                                         return;
                                     }
                                 }
-                                scanDirectory(
+                                defaultStore.set(
+                                    atomGameLibraryIsIndexing,
+                                    true,
+                                );
+                                await scanDirectory(
                                     newPath,
                                     knownPaths,
                                     abortController.signal,
                                     1,
                                 );
+                                defaultStore.set(
+                                    atomGameLibraryIsIndexing,
+                                    false,
+                                );
                             }
                         } else if ("remove" in e.type) {
                             const newPath = e.paths[0];
@@ -235,6 +238,7 @@ async function scanDirectory(
                         }
                     }
                 });
+                defaultStore.set(atomGameLibraryIsIndexing, false);
                 cancel = () => {
                     unsub();
                     abortController.abort();

src/store/version-manager.ts

@@ -97,7 +97,7 @@ export const atomAvailableVersions = atomWithQuery((get) => ({
         queryKey: [, , list],
     }: {
         queryKey: [string, string, string[]];
-    }) => {
+    }): Promise<RemoteEmulatorVersion[]> => {
         return (
             await Promise.all(
                 list.map(async (repoSource) => {