Implement exclude of installed maps as filter

assets/jsons/translations/en.json

@@ -737,7 +737,8 @@
             "nps" : "Notes Per Second",
             "tags": "tags",
             "specificities": "general",
-            "requirements": "requirements"
+            "requirements": "requirements",
+            "exclude": "exclude"
         },
         "map-types": {
             "accuracy": "accuracy",
@@ -793,6 +794,9 @@
             "verified": "verified",
             "fullSpread": "full spread"
         },
+        "map-excludes": {
+            "installed": "installed"
+        },
         "difficulties": {
             "Easy": "easy",
             "Normal": "normal",

src/renderer/components/maps-mangement-components/filter-panel.component.tsx

@@ -11,6 +11,7 @@ import { useTranslation } from "renderer/hooks/use-translation.hook";
 import { MAP_SPECIFICITIES } from "renderer/partials/maps/map-general/map-specificity";
 import { MAP_REQUIREMENTS } from "renderer/partials/maps/map-requirements/map-requirements";
 import { MAP_DIFFICULTIES_COLORS } from "renderer/partials/maps/map-difficulties/map-difficulties-colors";
+import { MapExclude, MAP_EXCLUDES } from "renderer/partials/maps/map-excludes/map-excludes";
 import { BsmButton } from "../shared/bsm-button.component";
 import equal from "fast-deep-equal/es6";
 import clone from "rfdc";
@@ -147,6 +148,10 @@ export function FilterPanel({ className, ref, playlist = false, filter, onChange
         return t(`maps.map-specificities.${specificity}`);
     };
 
+    const translateMapExclude = (exclude: MapExclude): string => {
+        return t(`maps.map-excludes.${exclude}`);
+    };
+
     type BooleanKeys<T> = { [k in keyof T]: T[k] extends boolean ? k : never }[keyof T];
 
     const handleCheckbox = (key: BooleanKeys<MapFilter>) => {
@@ -189,6 +194,13 @@ export function FilterPanel({ className, ref, playlist = false, filter, onChange
                             <span className="grow capitalize">{requirement}</span>
                         </div>
                     ))}
+                    <h2 className="my-1 uppercase text-sm">{t("maps.map-filter-panel.exclude")}</h2>
+                    {MAP_EXCLUDES.map(exclude => (
+                        <div key={exclude} className="flex justify-start items-center h-[22px] z-20 relative py-0.5 cursor-pointer" onClick={() => handleCheckbox(exclude)}>
+                            <BsmCheckbox className="h-full aspect-square relative bg-inherit mr-1" checked={filter?.[exclude]} onChange={() => handleCheckbox(exclude)} />
+                            <span className="grow capitalize">{translateMapExclude(exclude)}</span>
+                        </div>
+                    ))}
                 </section>
                 <section className="grow capitalize">
                     <h2 className="uppercase text-sm mb-1">{t("maps.map-filter-panel.tags")}</h2>

src/renderer/components/modal/modal-types/download-maps-modal.component.tsx

@@ -76,12 +76,48 @@ export const DownloadMapsModal: ModalComponent<void, { version: BSVersion; owned
         };
     }, []);
 
-    const loadMaps = (params: SearchParams) => {
+    const applyInstalledFilter = (maps: BsvMapDetail[]): BsvMapDetail[] => {
+        return maps.filter(map => {
+            if (!filter.installed) {
+                return true;
+            }
+
+            return !map.versions.some(version => ownedMapHashs.includes(version.hash));
+        });
+    }
+
+    const loadMaps = (params: SearchParams, tryToLoad = 5) => {
         setLoading(() => true);
-        beatSaver
-            .searchMaps(params)
-            .then(maps => setMaps(prev => [...prev, ...maps]))
-            .finally(() => setLoading(() => false));
+
+        const searchResult = beatSaver.searchMaps(params);
+
+        if (!filter.installed) {
+            searchResult
+                .then(maps => setMaps(prev => [...prev, ...maps]))
+                .finally(() => setLoading(() => false));
+
+            return;
+        }
+
+        searchResult
+           .then(maps => {
+                if (!maps.length) {
+                    setLoading(() => false);
+
+                    return;
+                }
+
+                maps = applyInstalledFilter(maps);
+                setMaps(prev => [...prev, ...maps])
+
+                if (maps.length < tryToLoad) {
+                    handleLoadMore();
+
+                    return;
+                }
+
+                setLoading(() => false);
+            })
     };
 
     const extractMapDiffs = (map: BsvMapDetail): Map<BsvMapCharacteristic, ParsedMapDiff[]> => {

src/renderer/partials/maps/map-excludes/map-excludes.ts

@@ -0,0 +1,3 @@
+export type MapExclude = "installed";
+
+export const MAP_EXCLUDES: MapExclude[] = ["installed"];

src/shared/models/maps/beat-saver.model.ts

@@ -162,6 +162,7 @@ export interface MapFilter {
     to?: number;
     fullSpread?: boolean;
     ranked?: boolean;
+    installed?: boolean;
     minDuration?: number;
     maxDuration?: number;
     minNps?: number;