Merge pull request #3745 from rommapp/posthog-code/live-scan-platform-games

fix: remove deleted games from gallery store

Author: gantoine

frontend/src/v2/components/Dialogs/DeleteRomDialog.vue

@@ -14,6 +14,7 @@ import storeConfig from "@/stores/config";
 import storeRoms, { type SimpleRom } from "@/stores/roms";
 import type { Events } from "@/types/emitter";
 import { useSnackbar } from "@/v2/composables/useSnackbar";
+import storeGalleryRoms from "@/v2/stores/galleryRoms";
 
 defineOptions({ inheritAttrs: false });
 
@@ -22,6 +23,7 @@ const router = useRouter();
 const route = useRoute();
 const show = ref(false);
 const romsStore = storeRoms();
+const galleryRomsStore = storeGalleryRoms();
 const roms = ref<SimpleRom[]>([]);
 const romsToDeleteFromFs = ref<number[]>([]);
 const excludeOnDelete = ref(false);
@@ -100,6 +102,7 @@ async function deleteRoms() {
     }
     romsStore.resetSelection();
     romsStore.remove(roms.value);
+    galleryRomsStore.remove(roms.value);
     romsStore.setRecentRoms(
       romsStore.recentRoms.filter(
         (r) => !roms.value.some((rom) => rom.id === r.id),

frontend/src/v2/composables/useScanLifecycle/index.ts

@@ -31,11 +31,13 @@ import storeRoms, { type SimpleRom } from "@/stores/roms";
 import storeScanning, { type ScanningPlatform } from "@/stores/scanning";
 import type { Events } from "@/types/emitter";
 import { useSocketEvent } from "@/v2/composables/useSocketEvent";
+import storeGalleryRoms from "@/v2/stores/galleryRoms";
 
 export function installScanLifecycle() {
   const scanningStore = storeScanning();
   const romsStore = storeRoms();
   const platformsStore = storePlatforms();
+  const galleryRomsStore = storeGalleryRoms();
   const emitter = inject<Emitter<Events>>("emitter");
 
   useSocketEvent<ScanningPlatform>(
@@ -87,6 +89,14 @@ export function installScanLifecycle() {
   // ROM. Queue drains every 100ms; matches the v1 behavior. Stored
   // outside the handler so multiple events share the same queue + flush.
   const romUpdateQueue: SimpleRom[] = [];
+  const refreshGallery = debounce(
+    () => {
+      galleryRomsStore.invalidateWindows();
+      void galleryRomsStore.fetchInitialMetadata();
+    },
+    250,
+    { maxWait: 1000 },
+  );
   const processRomUpdates = debounce(() => {
     if (romUpdateQueue.length === 0) return;
     const updates = romUpdateQueue.splice(0, romUpdateQueue.length);
@@ -97,7 +107,10 @@ export function installScanLifecycle() {
       romsStore.addToRecent(rom);
 
       // If the user is currently looking at the gallery of the platform
-      // being scanned, fold the new ROM into the visible list.
+      // being scanned, refresh from the server to preserve sorting/filtering.
+      if (galleryRomsStore.currentPlatform?.id === rom.platform_id) {
+        refreshGallery();
+      }
       if (romsStore.currentPlatform?.id === rom.platform_id) {
         const existing = romsStore.filteredRoms.find((r) => r.id === rom.id);
         if (existing) romsStore.update(rom);

frontend/src/v2/stores/galleryRoms.ts

@@ -566,13 +566,24 @@ export default defineStore("v2GalleryRoms", {
       }
     },
 
-    /** Drop ROMs by id (delete flow). Positions become "holes" — kept
-     * sparse rather than re-indexed; the next gallery refresh closes the
-     * gaps. */
+    /** Reconcile the gallery after ROMs are deleted. */
     remove(roms: SimpleRom[]) {
-      const ids = new Set(roms.map((r) => r.id));
-      for (const [pos, existing] of this.byPosition) {
-        if (ids.has(existing.id)) this.byPosition.delete(pos);
+      if (this.currentPlatform) {
+        const removedFromPlatform = roms.filter(
+          (rom) => rom.platform_id === this.currentPlatform?.id,
+        ).length;
+        this.currentPlatform = {
+          ...this.currentPlatform,
+          rom_count: Math.max(
+            0,
+            this.currentPlatform.rom_count - removedFromPlatform,
+          ),
+        };
+      }
+
+      if (this.onGalleryView && roms.length > 0) {
+        this.invalidateWindows();
+        void this.fetchInitialMetadata();
       }
     },
   },