Merge pull request #649 from zurdi15/fix/scan_sockets

Fixed scan sockets

frontend/src/App.vue

@@ -25,7 +25,6 @@ const isFiltered = normalizeString(galleryFilter.filterSearch).trim() != "";
 const emitter = inject<Emitter<Events>>("emitter");
 
 // Props
-const authStore = storeAuth();
 const heartbeatStore = storeHeartbeat();
 const configStore = storeConfig();
 
@@ -34,24 +33,11 @@ socket.on("scan:scanning_platform", ({ name, slug, id }) => {
 });
 
 socket.on("scan:scanning_rom", ({ platform_name, platform_slug, ...rom }) => {
-  romsStore.add([rom]);
-  if (isFiltered) {
+  if (romsStore.platform.name === platform_name) {
+    romsStore.add([rom]);
     romsStore.setFiltered(
-      romsStore.filteredRoms,
-      galleryFilter.filterUnmatched,
-      galleryFilter.selectedGenre,
-      galleryFilter.selectedFranchise,
-      galleryFilter.selectedCollection,
-      galleryFilter.selectedCompany
-    );
-  } else {
-    romsStore.setFiltered(
-      romsStore.allRoms,
-      galleryFilter.filterUnmatched,
-      galleryFilter.selectedGenre,
-      galleryFilter.selectedFranchise,
-      galleryFilter.selectedCollection,
-      galleryFilter.selectedCompany
+      isFiltered ? romsStore.filteredRoms : romsStore.allRoms,
+      galleryFilter
     );
   }
 

frontend/src/components/Details/ActionBar.vue

@@ -44,6 +44,7 @@ function toggleEmulation() {
     </v-col>
     <v-col>
       <v-tooltip
+        class="tooltip"
         text="Emulation not currently supported"
         location="bottom"
         :disabled="emulationSupported"
@@ -79,3 +80,9 @@ function toggleEmulation() {
     </v-col>
   </v-row>
 </template>
+<style scoped>
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
+</style>

frontend/src/components/Dialog/Rom/UploadRom.vue

@@ -22,27 +22,6 @@ emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
   show.value = true;
 });
 
-socket.on("scan:done", () => {
-  scanningStore.set(false);
-  socket.disconnect();
-  emitter?.emit("refreshDrawer", null);
-  emitter?.emit("snackbarShow", {
-    msg: "Scan completed successfully!",
-    icon: "mdi-check-bold",
-    color: "green",
-  });
-});
-
-socket.on("scan:done_ko", (msg) => {
-  scanningStore.set(false);
-  emitter?.emit("snackbarShow", {
-    msg: `Scan couldn't be completed. Something went wrong: ${msg}`,
-    icon: "mdi-close-circle",
-    color: "red",
-  });
-  socket.disconnect();
-});
-
 // Functions
 async function uploadRoms() {
   if (!platform.value) return;
@@ -95,17 +74,12 @@ async function uploadRoms() {
         color: "red",
         timeout: 4000,
       });
-    })
+    });
 }
 
 function closeDialog() {
   show.value = false;
 }
-
-onBeforeUnmount(() => {
-  socket.off("scan:done");
-  socket.off("scan:done_ko");
-});
 </script>
 
 <template>

frontend/src/components/Gallery/FabMenu/Base.vue

@@ -19,31 +19,6 @@ const romsStore = storeRoms();
 const scanningStore = storeScanning();
 const route = useRoute();
 
-socket.on("scan:scanning_rom", ({ id }) => {
-  const rom = romsStore.selectedRoms.find((r) => r.id === id);
-  if (rom) romsStore.removeFromSelection(rom);
-});
-
-socket.on("scan:done", () => {
-  scanningStore.set(false);
-  emitter?.emit("snackbarShow", {
-    msg: "Scan completed successfully!",
-    icon: "mdi-check-bold",
-    color: "green",
-  });
-  socket.disconnect();
-});
-
-socket.on("scan:done_ko", (msg: string) => {
-  scanningStore.set(false);
-  emitter?.emit("snackbarShow", {
-    msg: `Scan couldn't be completed. Something went wrong: ${msg}`,
-    icon: "mdi-close-circle",
-    color: "red",
-  });
-  socket.disconnect();
-});
-
 // Functions
 async function onScan() {
   scanningStore.set(true);

frontend/src/stores/roms.ts

@@ -1,7 +1,11 @@
 import type { PlatformSchema, RomSchema } from "@/__generated__/";
 import { groupBy, isNull, uniqBy } from "lodash";
 import { nanoid } from "nanoid";
-import { defineStore } from "pinia";
+import { defineStore, type Store } from "pinia";
+import storeGalleryFilter from "./galleryFilter";
+import type { ExtractPiniaStoreType } from "@/types";
+
+type GalleryFilterStore = ExtractPiniaStoreType<typeof storeGalleryFilter>;
 
 export type Rom = RomSchema & {
   siblings?: RomSchema[]; // Added by the frontend
@@ -107,30 +111,21 @@ export default defineStore("roms", {
       this._selectedIDs = [];
       this.lastSelectedIndex = -1;
     },
-    // Filtered roms
-    setFiltered(
-      roms: Rom[],
-      filterUnmatched: boolean,
-      filterGenre: string | null = null,
-      filterFranchise: string | null = null,
-      filterCollection: string | null = null,
-      filterCompany: string | null = null
-    ) {
+    // Filter roms by gallery filter store state
+    setFiltered(roms: Rom[], galleryFilter: GalleryFilterStore) {
       this._filteredIDs = roms.map((rom) => rom.id);
-      if (filterUnmatched) {
-        this.filterUnmatched();
-      }
-      if (filterGenre) {
-        this.filterGenre(filterGenre);
+      if (galleryFilter.filterUnmatched) this.filterUnmatched();
+      if (galleryFilter.selectedGenre) {
+        this.filterGenre(galleryFilter.selectedGenre);
       }
-      if (filterFranchise) {
-        this.filterFranchise(filterFranchise);
+      if (galleryFilter.selectedFranchise) {
+        this.filterFranchise(galleryFilter.selectedFranchise);
       }
-      if (filterCollection) {
-        this.filterCollection(filterCollection);
+      if (galleryFilter.selectedCollection) {
+        this.filterCollection(galleryFilter.selectedCollection);
       }
-      if (filterCompany) {
-        this.filterCompany(filterCompany);
+      if (galleryFilter.selectedCompany) {
+        this.filterCompany(galleryFilter.selectedCompany);
       }
     },
     filterUnmatched() {
@@ -140,17 +135,13 @@ export default defineStore("roms", {
     },
     filterGenre(genreToFilter: string) {
       this._filteredIDs = this.filteredRoms
-        .filter((rom) =>
-          rom.genres.some((genre) => genre === genreToFilter)
-        )
+        .filter((rom) => rom.genres.some((genre) => genre === genreToFilter))
         .map((rom) => rom.id);
     },
     filterFranchise(franchiseToFilter: string) {
       this._filteredIDs = this.filteredRoms
         .filter((rom) =>
-          rom.franchises.some(
-            (franchise) => franchise === franchiseToFilter
-          )
+          rom.franchises.some((franchise) => franchise === franchiseToFilter)
         )
         .map((rom) => rom.id);
     },
@@ -166,9 +157,7 @@ export default defineStore("roms", {
     filterCompany(companyToFilter: string) {
       this._filteredIDs = this.filteredRoms
         .filter((rom) =>
-          rom.companies.some(
-            (company) => company === companyToFilter
-          )
+          rom.companies.some((company) => company === companyToFilter)
         )
         .map((rom) => rom.id);
     },

frontend/src/types/index.ts

@@ -1,3 +1,13 @@
-export function isKeyof<T extends object>(key: PropertyKey, obj: T): key is keyof T {
-    return key in obj;
+export function isKeyof<T extends object>(
+  key: PropertyKey,
+  obj: T
+): key is keyof T {
+  return key in obj;
 }
+
+export type ExtractPiniaStoreType<D> = D extends (
+  pinia?: any,
+  hot?: any
+) => infer R
+  ? R
+  : never;

frontend/src/views/Gallery/Base.vue

@@ -74,28 +74,14 @@ async function fetchRoms() {
       // Add any new roms to the store
       const allRomsSet = [...allRoms.value, ...data.items];
       romsStore.set(allRomsSet);
-      romsStore.setFiltered(
-        allRomsSet,
-        galleryFilterStore.filterUnmatched,
-        galleryFilterStore.selectedGenre,
-        galleryFilterStore.selectedFranchise,
-        galleryFilterStore.selectedCollection,
-        galleryFilterStore.selectedCompany
-      );
+      romsStore.setFiltered(allRomsSet, galleryFilterStore);
 
       if (galleryFilterStore.isFiltered()) {
         if (data.next_page !== undefined) searchCursor.value = data.next_page;
 
         const serchedRomsSet = [...searchRoms.value, ...data.items];
         romsStore.setSearch(serchedRomsSet);
-        romsStore.setFiltered(
-          serchedRomsSet,
-          galleryFilterStore.filterUnmatched,
-          galleryFilterStore.selectedGenre,
-          galleryFilterStore.selectedFranchise,
-          galleryFilterStore.selectedCollection,
-          galleryFilterStore.selectedCompany
-        );
+        romsStore.setFiltered(serchedRomsSet, galleryFilterStore);
       } else if (data.next_page !== undefined) {
         cursor.value = data.next_page;
       }
@@ -122,14 +108,7 @@ async function onFilterChange() {
   searchCursor.value = "";
   romsStore.setSearch([]);
   if (!galleryFilterStore.isFiltered()) {
-    romsStore.setFiltered(
-      allRoms.value,
-      galleryFilterStore.filterUnmatched,
-      galleryFilterStore.selectedGenre,
-      galleryFilterStore.selectedFranchise,
-      galleryFilterStore.selectedCollection,
-      galleryFilterStore.selectedCompany
-    );
+    romsStore.setFiltered(allRoms.value, galleryFilterStore);
     return;
   }
   await fetchRoms();