fix: no longer loads duplicate grids or looses grids

src/components/core/grids/GridResults.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { AppController } from "../../../lib/controllers/AppController";
   import type { SGDBImage } from "../../../lib/models/SGDB";
-  import { dbFilters, gridType, GridTypes, isOnline, needsSGDBAPIKey, selectedGameAppId, selectedGameName, steamGridDBKey, selectedSteamGridGameId, lastPageCache, hasMorePagesCache, loadingSettings } from "../../../stores/AppState";
+  import { dbFilters, gridType, GridTypes, isOnline, needsSGDBAPIKey, selectedGameAppId, selectedGameName, steamGridDBKey, selectedSteamGridGameId, lastPageCache, hasMorePagesCache, loadingSettings, steamGridSearchCache } from "../../../stores/AppState";
   import Grid from "./Grid.svelte";
   import { debounce, filterGrids, getHasMorePages, getPageNumberForGame } from "../../../lib/utils/Utils";
   import GridLoadingSkeleton from "../../layout/GridLoadingSkeleton.svelte";
@@ -23,31 +23,27 @@
   /**
    * Filters the grids based when relevant state changes.
    * @param resultsPage The results page to show.
-   * @param isCustomName Whether the app name is custom or not.
    */
-  async function filterGridsOnStateChange(resultsPage: number, isCustomName: boolean = false): Promise<void> {
-    if ($isOnline && $steamGridDBKey !== "" && !!$selectedGameAppId) {
-      const unfilteredGrids = await AppController.getSteamGridArt($selectedGameAppId, resultsPage, $selectedSteamGridGameId, isCustomName);
-      grids = filterGrids(unfilteredGrids, $gridType, $dbFilters, $selectedGameName);
-      console.log("grids length:", grids.length);
-      console.log("as set:", (new Set(grids)).size);
-      // TODO: easy fix would be make it a set but the issue is something else is going wrong
-    }
+  async function filterGridsOnStateChange(resultsPage: number): Promise<void> {
+    const unfilteredGrids = await AppController.getSteamGridArt($selectedGameAppId, resultsPage, $selectedSteamGridGameId);
+    grids = filterGrids(unfilteredGrids, $gridType, $dbFilters, $selectedGameName);
   }
 
   /**
    * Handles loading new grids when the user scrolls to the bottom.
    */
   async function handleLoadOnScroll() {
-    const lastPageLoaded = getPageNumberForGame($selectedSteamGridGameId, $gridType);
-    const oldGridsLength = grids.length;
-    await filterGridsOnStateChange(lastPageLoaded + 1, hasCustomName);
-    
-    if (oldGridsLength !== grids.length) {
-      lastPageCache[parseInt($selectedSteamGridGameId)][$gridType] = lastPageLoaded + 1;
-    } else {
-      hasMorePagesCache[parseInt($selectedSteamGridGameId)][$gridType] = false;
-      hasMorePages = false;
+    if ($isOnline && $steamGridDBKey !== "" && !!$selectedGameAppId) {
+      const lastPageLoaded = getPageNumberForGame($selectedSteamGridGameId, $gridType);
+      const oldGridsLength = grids.length;
+
+      await filterGridsOnStateChange(lastPageLoaded + 1);
+      if (oldGridsLength !== grids.length) {
+        lastPageCache[parseInt($selectedSteamGridGameId)][$gridType] = lastPageLoaded + 1;
+      } else {
+        hasMorePagesCache[parseInt($selectedSteamGridGameId)][$gridType] = false;
+        hasMorePages = false;
+      }
     }
   }
 
@@ -59,9 +55,18 @@
   const debouncedResize = debounce(handleResize, 500);
 
   onMount(() => {
-    filterGridsOnStateChange(getPageNumberForGame($selectedSteamGridGameId, $gridType), hasCustomName).then(() => {
+    if ($selectedGameAppId) {
+      if ($selectedSteamGridGameId === "None") {
+        AppController.chooseSteamGridGameId($selectedGameAppId, hasCustomName).then((sgdbGameId) => {
+          $selectedSteamGridGameId = sgdbGameId;
+        });
+      } else {
+        handleLoadOnScroll();
+        isLoading = false;
+      }
+    } else {
       isLoading = false;
-    });
+    }
   });
 </script>
 

src/lib/controllers/AppController.ts

@@ -488,17 +488,27 @@ export class AppController {
     }
   }
 
+  /**
+   * Chooses the steam grid game id for the provided game.
+   * @param appId The id of the app to get.
+   * @param isCustomName Whether the app name is custom or not.
+   * @returns A promise resolving to the id.
+   * ? Logging complete.
+   */
+  static async chooseSteamGridGameId(appId: number, isCustomName: boolean): Promise<string> {
+    return await AppController.cacheController.chooseSteamGridGameId(appId, get(selectedGameName), get(currentPlatform), true, isCustomName);
+  }
+
   /**
    * Gets a list of grids for the provided game.
    * @param appId The id of the app to get.
    * @param page The page of results to get.
    * @param selectedSteamGridId Optional id of the current steamGridGame.
-   * @param isCustomName Whether the app name is custom or not.
    * @returns A promise resolving to a list of the results.
    * ? Logging complete.
    */
-  static async getSteamGridArt(appId: number, page: number, selectedSteamGridId: string | null, isCustomName: boolean): Promise<SGDBImage[]> {
-    return await AppController.cacheController.fetchGrids(appId, get(selectedGameName), page, get(currentPlatform), true, selectedSteamGridId, isCustomName);
+  static async getSteamGridArt(appId: number, page: number, selectedSteamGridId: string | null): Promise<SGDBImage[]> {
+    return await AppController.cacheController.fetchGrids(appId, page, true, selectedSteamGridId);
   }
 
   /**

src/lib/controllers/CacheController.ts

@@ -240,19 +240,17 @@ export class CacheController {
   }
 
   /**
-   * Gets the current type of grid for the provided app id.
+   * Gets the sgdb game id for the provided game.
    * @param appId The id of the app to fetch.
    * @param gameName The name of the game to fetch grids for.
-   * @param page The page of results to get.
    * @param selectedPlatform The game's platforms.
    * @param useCoreFile Whether or not to use the core log file.
-   * @param selectedSteamGridId Optional id of the current steamGridGame.
    * @param isCustomName Whether the app name is custom or not.
    * @returns A promise resolving to the grids.
    * ? Logging complete.
    */
-  async fetchGrids(appId: number, gameName: string, page: number, selectedPlatform: Platforms, useCoreFile: boolean, selectedSteamGridId: string | null, isCustomName?: boolean): Promise<SGDBImage[]> {
-    logToFile(`Fetching grids for game ${appId}...`, useCoreFile);
+  async chooseSteamGridGameId(appId: number, gameName: string, selectedPlatform: Platforms, useCoreFile: boolean, isCustomName?: boolean): Promise<string> {
+    logToFile(`Finding SGDB game for ${appId}...`, useCoreFile);
 
     const type = get(gridType);
     const searchCache = get(steamGridSearchCache);
@@ -266,7 +264,7 @@ export class CacheController {
       } catch (e: any) {
         logErrorToFile(`Error searching for game on SGDB. Game: ${gameName}. Platform: ${selectedPlatform}. Error: ${e.message}.`, useCoreFile);
         ToastController.showWarningToast("Error searching for game on SGDB.");
-        return [];
+        return "None";
       }
     }
 
@@ -283,29 +281,42 @@ export class CacheController {
         } catch (e: any) {
           logErrorToFile(`Error getting game from SGDB by steam id. Game: ${gameName}. AppId: ${appId}. Error: ${e.message}.`, useCoreFile);
           ToastController.showWarningToast("Error getting game from SGDB.");
-          return [];
+          return "None";
         }
       }
 
-      chosenResult = selectedSteamGridId ? results.find((game) => game.id.toString() === selectedSteamGridId) : null;
-      chosenResult ||= results.find((game) => game.id.toString() === gameId);
+      chosenResult = results.find((game) => game.id.toString() === gameId);
       if (!chosenResult && results.length > 0) chosenResult = results[0];
     } else {
-      chosenResult = selectedSteamGridId ? results.find((game) => game.id.toString() === selectedSteamGridId) : results.find((game) => game.name === gameName);
+      chosenResult = results.find((game) => game.name === gameName);
       if (!chosenResult && results.length > 0) chosenResult = results[0];
     }
 
     if (chosenResult?.id) {
-      if (useCoreFile) selectedSteamGridGameId.set(chosenResult.id.toString());
       steamGridSearchCache.set(searchCache);
-
-      return await this.fetchGridsForGame(chosenResult.id, type, page, getPageNumberForGame(chosenResult.id.toString(), type), useCoreFile);
+      return chosenResult.id.toString();
     } else {
       logToFile(`No results for ${type} for ${gameName}.`, useCoreFile);
-      return [];
+      return "None";
     }
   }
 
+  /**
+   * Gets the current type of grid for the provided app id.
+   * @param appId The id of the app to fetch.
+   * @param page The page of results to get.
+   * @param useCoreFile Whether or not to use the core log file.
+   * @param selectedSteamGridId Optional id of the current steamGridGame.
+   * @returns A promise resolving to the grids.
+   * ? Logging complete.
+   */
+  async fetchGrids(appId: number, page: number, useCoreFile: boolean, selectedSteamGridId: string): Promise<SGDBImage[]> {
+    logToFile(`Fetching grids for game ${appId}...`, useCoreFile);
+    const type = get(gridType);
+
+    return await this.fetchGridsForGame(parseInt(selectedSteamGridId), type, page, getPageNumberForGame(selectedSteamGridId, type), useCoreFile);
+  }
+
   /**
    * Searches SGDB for the provided query.
    * @param query The search query to use.
@@ -365,7 +376,8 @@ export class CacheController {
           gameName = nonSteamGameNameMap[appid];
         }
 
-        const grids = await this.fetchGrids(appidInt, gameName, 0, isSteamGame ? Platforms.STEAM : Platforms.NON_STEAM, false, null);
+        const sgdbGameId = await this.chooseSteamGridGameId(appidInt, gameName, isSteamGame ? Platforms.STEAM : Platforms.NON_STEAM, false);
+        const grids = await this.fetchGrids(appidInt, 0, false, sgdbGameId);
         const filtered = filterGrids(grids, selectedGridType, filters, gameName, false);
 
         if (filtered.length > 0) {