diff --git a/frontend/src/App.vue b/frontend/src/App.vue index 56d64784b..a9dfd6710 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -25,7 +25,6 @@ const isFiltered = normalizeString(galleryFilter.filterSearch).trim() != ""; const emitter = inject>("emitter"); // Props -const authStore = storeAuth(); const heartbeatStore = storeHeartbeat(); const configStore = storeConfig(); @@ -36,25 +35,10 @@ socket.on("scan:scanning_platform", ({ name, slug, id }) => { socket.on("scan:scanning_rom", ({ platform_name, platform_slug, ...rom }) => { if (romsStore.platform.name === platform_name) { romsStore.add([rom]); - if (isFiltered) { - 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 - ); - } + romsStore.setFiltered( + isFiltered ? romsStore.filteredRoms : romsStore.allRoms, + galleryFilter + ); } let scannedPlatform = scanningPlatforms.value.find( diff --git a/frontend/src/stores/roms.ts b/frontend/src/stores/roms.ts index 6b90e287d..33652f89e 100644 --- a/frontend/src/stores/roms.ts +++ b/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; 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 (galleryFilter.filterUnmatched) this.filterUnmatched(); + if (galleryFilter.selectedGenre) { + this.filterGenre(galleryFilter.selectedGenre); } - if (filterGenre) { - this.filterGenre(filterGenre); + if (galleryFilter.selectedFranchise) { + this.filterFranchise(galleryFilter.selectedFranchise); } - if (filterFranchise) { - this.filterFranchise(filterFranchise); + if (galleryFilter.selectedCollection) { + this.filterCollection(galleryFilter.selectedCollection); } - if (filterCollection) { - this.filterCollection(filterCollection); - } - if (filterCompany) { - this.filterCompany(filterCompany); + if (galleryFilter.selectedCollection) { + this.filterCompany(galleryFilter.selectedCollection); } }, 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); }, diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts index 63f325815..59380af87 100644 --- a/frontend/src/types/index.ts +++ b/frontend/src/types/index.ts @@ -1,3 +1,13 @@ -export function isKeyof(key: PropertyKey, obj: T): key is keyof T { - return key in obj; +export function isKeyof( + key: PropertyKey, + obj: T +): key is keyof T { + return key in obj; } + +export type ExtractPiniaStoreType = D extends ( + pinia?: any, + hot?: any +) => infer R + ? R + : never; diff --git a/frontend/src/views/Gallery/Base.vue b/frontend/src/views/Gallery/Base.vue index a10ecb187..724cf14d4 100644 --- a/frontend/src/views/Gallery/Base.vue +++ b/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();