From 1af05d447bd101795e62bc4341e5be961a32da5d Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Sun, 11 Feb 2024 00:36:56 +0100
Subject: [PATCH 01/61] add platform endpoint added

---
 backend/endpoints/platform.py                    | 11 ++++++++---
 frontend/src/components/Dialog/Rom/UploadRom.vue |  4 +---
 frontend/src/components/Drawer/Base.vue          | 15 +++++++++++++++
 frontend/src/services/api/platform.ts            |  5 +++++
 4 files changed, 29 insertions(+), 6 deletions(-)

diff --git a/backend/endpoints/platform.py b/backend/endpoints/platform.py
index 9cadc9826..54bf31516 100644
--- a/backend/endpoints/platform.py
+++ b/backend/endpoints/platform.py
@@ -2,14 +2,14 @@
 from endpoints.responses import MessageResponse
 from endpoints.responses.platform import PlatformSchema
 from fastapi import APIRouter, HTTPException, Request, status
-from handler import db_platform_handler
+from handler import db_platform_handler, igdb_handler
 from logger.logger import log
 
 router = APIRouter()
 
 
 @protected_route(router.post, "/platforms", ["platforms.write"])
-def add_platforms(request: Request) -> MessageResponse:
+async def add_platforms(request: Request) -> MessageResponse:
     """Create platform endpoint
 
     Args:
@@ -19,7 +19,12 @@ def add_platforms(request: Request) -> MessageResponse:
         MessageResponse: Standard message response
     """
 
-    pass
+    data = await request.json()
+    fs_slug = data["fs_slug"]
+    platform = igdb_handler.get_platform(fs_slug)
+    log.debug(platform)
+
+    return {"msg": f"Platform created successfully!"}
 
 
 @protected_route(router.get, "/platforms", ["platforms.read"])
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 5d25d4a0a..4f7249418 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
-import { ref, inject, onBeforeUnmount } from "vue";
-import { useRoute } from "vue-router";
+import { ref, inject } from "vue";
 import { useDisplay } from "vuetify";
 import type { Emitter } from "mitt";
 import type { Events } from "@/types/emitter";
@@ -10,7 +9,6 @@ import romApi from "@/services/api/rom";
 import storeScanning from "@/stores/scanning";
 
 const { xs, mdAndDown, lgAndUp } = useDisplay();
-const route = useRoute();
 const show = ref(false);
 const romsToUpload = ref([]);
 const scanningStore = storeScanning();
diff --git a/frontend/src/components/Drawer/Base.vue b/frontend/src/components/Drawer/Base.vue
index 775cb6e01..de69ad1aa 100644
--- a/frontend/src/components/Drawer/Base.vue
+++ b/frontend/src/components/Drawer/Base.vue
@@ -11,6 +11,7 @@ import DrawerHeader from "@/components/Drawer/Header.vue";
 import PlatformListItem from "@/components/Platform/PlatformListItem.vue";
 import storeAuth from "@/stores/auth";
 import storePlatforms from "@/stores/platforms";
+import platformApi from "@/services/api/platform";
 
 // Props
 const { lgAndUp } = useDisplay();
@@ -27,6 +28,12 @@ emitter?.on("toggleDrawer", () => {
 emitter?.on("toggleDrawerRail", () => {
   rail.value = !rail.value;
   localStorage.setItem("rail", rail.value.toString());
+
+
+async function addPlatform(){
+  const { data: message } = await platformApi.uploadPlatform("romm");
+  console.log(message)
+}
 });
 
 onMounted(() => {});
@@ -105,6 +112,14 @@ onMounted(() => {});
             >
           </template>
         </v-list-item>
+        <v-list-item class="bg-terciary" @click="addPlatform">
+          <span v-if="!rail" class="text-body-2 text-truncate">Add platform</span>
+          <template v-slot:prepend>
+            <v-avatar :rounded="0" size="40"
+              ><v-icon>mdi-plus</v-icon></v-avatar
+            >
+          </template>
+        </v-list-item>
       </v-list-group>
     </v-list>
 
diff --git a/frontend/src/services/api/platform.ts b/frontend/src/services/api/platform.ts
index e4affd5bf..e7b12fa31 100644
--- a/frontend/src/services/api/platform.ts
+++ b/frontend/src/services/api/platform.ts
@@ -3,6 +3,10 @@ import api from "@/services/api/index";
 
 export const platformApi = api;
 
+async function uploadPlatform(slug: string): Promise<{ data: MessageResponse[] }> {
+  return api.post("/platforms", {"slug": slug});
+}
+
 async function getPlatforms(): Promise<{ data: PlatformSchema[] }> {
   return api.get("/platforms");
 }
@@ -30,6 +34,7 @@ async function deletePlatform({
 }
 
 export default {
+  uploadPlatform,
   getPlatforms,
   getPlatform,
   deletePlatform,

From 16db9b03bc24208c73b48214a2fd3e8b454ec879 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Tue, 2 Apr 2024 15:22:25 -0400
Subject: [PATCH 02/61] [HOTFIX] Fix nightly scans resetting igdb/moby IDs

---
 backend/endpoints/sockets/scan.py                | 11 ++++++-----
 backend/handler/metadata_handler/moby_handler.py |  3 ---
 backend/handler/scan_handler.py                  | 13 ++-----------
 backend/tasks/scan_library.py                    |  3 ++-
 backend/watcher.py                               |  6 +++++-
 5 files changed, 15 insertions(+), 21 deletions(-)

diff --git a/backend/endpoints/sockets/scan.py b/backend/endpoints/sockets/scan.py
index 7b337c048..20f44e05c 100644
--- a/backend/endpoints/sockets/scan.py
+++ b/backend/endpoints/sockets/scan.py
@@ -46,7 +46,7 @@ async def scan_platforms(
     platform_ids: list[int],
     scan_type: ScanType = ScanType.QUICK,
     selected_roms: list[str] = (),
-    metadata_sources: list[str] = (),
+    metadata_sources: list[str] = ["igdb", "moby"],
 ):
     """Scan all the listed platforms and fetch metadata from different sources
 
@@ -54,7 +54,7 @@ async def scan_platforms(
         platform_slugs (list[str]): List of platform slugs to be scanned
         scan_type (str): Type of scan to be performed. Defaults to "quick".
         selected_roms (list[str], optional): List of selected roms to be scanned. Defaults to [].
-        metadata_sources (list[str], optional): List of metadata sources to be used. Defaults to [].
+        metadata_sources (list[str], optional): List of metadata sources to be used. Defaults to all sources.
     """
 
     sm = _get_socket_manager()
@@ -90,11 +90,12 @@ async def scan_platforms(
             if platform and scan_type == ScanType.NEW_PLATFORMS:
                 continue
 
-            scanned_platform = scan_platform(
-                platform_slug, fs_platforms, metadata_sources
-            )
+            scanned_platform = scan_platform(platform_slug, fs_platforms)
             if platform:
                 scanned_platform.id = platform.id
+                # Keep the existing ids if they exist on the platform
+                scanned_platform.igdb_id = scanned_platform.igdb_id or platform.igdb_id
+                scanned_platform.moby_id = scanned_platform.moby_id or platform.moby_id
 
             scan_stats.scanned_platforms += 1
             scan_stats.added_platforms += 1 if not platform else 0
diff --git a/backend/handler/metadata_handler/moby_handler.py b/backend/handler/metadata_handler/moby_handler.py
index fd1eca91f..18cbbc36c 100644
--- a/backend/handler/metadata_handler/moby_handler.py
+++ b/backend/handler/metadata_handler/moby_handler.py
@@ -133,9 +133,6 @@ def _search_rom(self, search_term: str, platform_moby_id: int) -> dict | None:
         return pydash.get(exact_matches or roms, "[0]", None)
 
     def get_platform(self, slug: str) -> MobyGamesPlatform:
-        if not MOBY_API_ENABLED:
-            return MobyGamesPlatform(moby_id=None, slug=slug)
-
         platform = SLUG_TO_MOBY_ID.get(slug, None)
 
         if not platform:
diff --git a/backend/handler/scan_handler.py b/backend/handler/scan_handler.py
index 1865db68f..cc535a0c7 100644
--- a/backend/handler/scan_handler.py
+++ b/backend/handler/scan_handler.py
@@ -47,7 +47,6 @@ def _get_main_platform_igdb_id(platform: Platform):
 def scan_platform(
     fs_slug: str,
     fs_platforms: list[str],
-    metadata_sources: list[str] = ["igdb", "moby"],
 ) -> Platform:
     """Get platform details
 
@@ -83,16 +82,8 @@ def scan_platform(
     except (KeyError, TypeError, AttributeError):
         platform_attrs["slug"] = fs_slug
 
-    igdb_platform = (
-        igdb_handler.get_platform(platform_attrs["slug"])
-        if "igdb" in metadata_sources
-        else {"igdb_id": None}
-    )
-    moby_platform = (
-        moby_handler.get_platform(platform_attrs["slug"])
-        if "moby" in metadata_sources
-        else {"moby_id": None}
-    )
+    igdb_platform = igdb_handler.get_platform(platform_attrs["slug"])
+    moby_platform =  moby_handler.get_platform(platform_attrs["slug"])
 
     platform_attrs["name"] = platform_attrs["slug"].replace("-", " ").title()
     platform_attrs.update({**moby_platform, **igdb_platform})  # Reverse order
diff --git a/backend/tasks/scan_library.py b/backend/tasks/scan_library.py
index 7c953602c..04f8f0ba0 100644
--- a/backend/tasks/scan_library.py
+++ b/backend/tasks/scan_library.py
@@ -2,6 +2,7 @@
 from endpoints.sockets.scan import scan_platforms
 from logger.logger import log
 from tasks.tasks import PeriodicTask
+from handler.scan_handler import ScanType
 
 
 class ScanLibraryTask(PeriodicTask):
@@ -20,7 +21,7 @@ async def run(self):
             return
 
         log.info("Scheduled library scan started...")
-        await scan_platforms([])
+        await scan_platforms([], scan_type=ScanType.UNIDENTIFIED)
         log.info("Scheduled library scan done")
 
 
diff --git a/backend/watcher.py b/backend/watcher.py
index 65c411b8e..d16a9e99d 100644
--- a/backend/watcher.py
+++ b/backend/watcher.py
@@ -8,6 +8,7 @@
 )
 from endpoints.sockets.scan import scan_platforms
 from handler import db_platform_handler
+from handler.scan_handler import ScanType
 from logger.logger import log
 from tasks.tasks import tasks_scheduler
 from config.config_manager import config_manager as cm
@@ -69,7 +70,10 @@ def on_any_event(self, event):
             # Otherwise trigger a rescan for the specific platform
             log.info(f"Change detected in {fs_slug} folder, {rescan_in_msg}")
             return tasks_scheduler.enqueue_in(
-                time_delta, scan_platforms, [db_platform.id]
+                time_delta,
+                scan_platforms,
+                [db_platform.id],
+                scan_type=ScanType.QUICK,
             )
 
 

From 5b578c1be3330f00f0627b4ccf050e90ce43c504 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Tue, 2 Apr 2024 23:30:29 -0400
Subject: [PATCH 03/61] fix ui error messages

---
 frontend/src/views/Library/Scan/Base.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/views/Library/Scan/Base.vue b/frontend/src/views/Library/Scan/Base.vue
index a7edec2e0..d8f782b6c 100644
--- a/frontend/src/views/Library/Scan/Base.vue
+++ b/frontend/src/views/Library/Scan/Base.vue
@@ -234,11 +234,11 @@ watch(metadataOptions, (newOptions) => {
           class="text-body-2 romm-grey"
           :to="{ name: 'rom', params: { rom: rom.id } }"
         >
-          <span v-if="rom.igdb_id" class="ml-10">
+          <span v-if="rom.igdb_id || rom.moby_id" class="ml-10">
             • Identified <b>{{ rom.name }} 👾</b>
           </span>
           <span v-else class="ml-10">
-            • {{ rom.file_name }} not found in IGDB ❌
+            • {{ rom.file_name }} not found in metadata sources ❌
           </span>
         </v-list-item>
       </v-col>

From b042b283535010cf7e97f00fb9f14cfa17e47bff Mon Sep 17 00:00:00 2001
From: Casuallynoted <Casuallynoted@users.noreply.github.com>
Date: Wed, 3 Apr 2024 00:30:29 -0400
Subject: [PATCH 04/61] Rename studio-ii.ico to rca-studio-ii.ico for Mobygames
 compatibility

---
 .../platforms/{studio-ii.ico => rca-studio-ii.ico}  | Bin
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename frontend/assets/platforms/{studio-ii.ico => rca-studio-ii.ico} (100%)

diff --git a/frontend/assets/platforms/studio-ii.ico b/frontend/assets/platforms/rca-studio-ii.ico
similarity index 100%
rename from frontend/assets/platforms/studio-ii.ico
rename to frontend/assets/platforms/rca-studio-ii.ico

From 6b926fb73eddfa0eec77fdfe7d166c8670a0cfe5 Mon Sep 17 00:00:00 2001
From: Casuallynoted <Casuallynoted@users.noreply.github.com>
Date: Wed, 3 Apr 2024 00:30:51 -0400
Subject: [PATCH 05/61] Rename videopac-plus.ico to videopac-g7400.ico for
 Mobygames compatibility

---
 .../{videopac-plus.ico => videopac-g7400.ico}       | Bin
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename frontend/assets/platforms/{videopac-plus.ico => videopac-g7400.ico} (100%)

diff --git a/frontend/assets/platforms/videopac-plus.ico b/frontend/assets/platforms/videopac-g7400.ico
similarity index 100%
rename from frontend/assets/platforms/videopac-plus.ico
rename to frontend/assets/platforms/videopac-g7400.ico

From 33ff821c934929080cba2e309c963c5a4cd10371 Mon Sep 17 00:00:00 2001
From: Casuallynoted <Casuallynoted@users.noreply.github.com>
Date: Wed, 3 Apr 2024 00:31:48 -0400
Subject: [PATCH 06/61] Rename pv-1000.ico to casio-pv-1000.ico for Mobygames
 compatibility

---
 .../platforms/{pv-1000.ico => casio-pv-1000.ico}    | Bin
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename frontend/assets/platforms/{pv-1000.ico => casio-pv-1000.ico} (100%)

diff --git a/frontend/assets/platforms/pv-1000.ico b/frontend/assets/platforms/casio-pv-1000.ico
similarity index 100%
rename from frontend/assets/platforms/pv-1000.ico
rename to frontend/assets/platforms/casio-pv-1000.ico

From 0154ca098eac3cffd72c1a35590f15e034f08c53 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Wed, 3 Apr 2024 10:24:37 -0400
Subject: [PATCH 07/61] Misc hotfixes from casuallynotes testing

---
 backend/endpoints/heartbeat.py                |   2 +-
 backend/endpoints/sockets/scan.py             |   3 ++-
 .../handler/metadata_handler/moby_handler.py  |  20 ++++++++++++------
 frontend/assets/platforms/studio-II.ico       | Bin 270398 -> 0 bytes
 4 files changed, 17 insertions(+), 8 deletions(-)
 delete mode 100644 frontend/assets/platforms/studio-II.ico

diff --git a/backend/endpoints/heartbeat.py b/backend/endpoints/heartbeat.py
index 20c016aa0..e01cf3b51 100644
--- a/backend/endpoints/heartbeat.py
+++ b/backend/endpoints/heartbeat.py
@@ -47,7 +47,7 @@ def heartbeat() -> HeartbeatResponse:
                 "ENABLED": ENABLE_SCHEDULED_UPDATE_SWITCH_TITLEDB,  # noqa
                 "CRON": SCHEDULED_UPDATE_SWITCH_TITLEDB_CRON,
                 "TITLE": "Scheduled Switch TitleDB update",
-                "MESSAGE": "Updates the Nintedo Switch TitleDB file",
+                "MESSAGE": "Updates the Nintendo Switch TitleDB file",
             },
         }
     }
diff --git a/backend/endpoints/sockets/scan.py b/backend/endpoints/sockets/scan.py
index 20f44e05c..c43ab9b3b 100644
--- a/backend/endpoints/sockets/scan.py
+++ b/backend/endpoints/sockets/scan.py
@@ -230,7 +230,7 @@ async def cancel_job(job: Job):
 
     existing_jobs = high_prio_queue.get_jobs()
     for job in existing_jobs:
-        if job.func_name == "scan_platform":
+        if job.func_name == "scan_platform" and job.is_started:
             return await cancel_job(job)
 
     workers = Worker.all(connection=redis_client)
@@ -239,6 +239,7 @@ async def cancel_job(job: Job):
         if (
             current_job
             and current_job.func_name == "endpoints.sockets.scan.scan_platforms"
+            and current_job.is_started
         ):
             return await cancel_job(current_job)
 
diff --git a/backend/handler/metadata_handler/moby_handler.py b/backend/handler/metadata_handler/moby_handler.py
index 18cbbc36c..e15651c6e 100644
--- a/backend/handler/metadata_handler/moby_handler.py
+++ b/backend/handler/metadata_handler/moby_handler.py
@@ -87,12 +87,16 @@ def _request(self, url: str, timeout: int = 120) -> dict:
                 detail="Can't connect to Mobygames, check your internet connection",
             )
         except HTTPError as err:
-            if err.response.status_code != 429:
+            if err.response.status_code == 401:
+                # Sometimes Mobygames returns 401 even with a valid API key
+                return {}
+            elif err.response.status_code == 429:
+                # Retry after 2 seconds if rate limit hit
+                time.sleep(2)
+            else:
+                # Log the error and return an empty dict if the request fails with a different code
                 log.error(err)
                 return {}
-
-            # Retry after 2 seconds if rate limit hit
-            time.sleep(2)
         except Timeout:
             # Retry the request once if it times out
             pass
@@ -101,7 +105,11 @@ def _request(self, url: str, timeout: int = 120) -> dict:
             res = requests.get(url, timeout=timeout)
             res.raise_for_status()
         except (HTTPError, Timeout) as err:
-            # Log the error and return an empty dict if the request fails again
+            if err.response.status_code == 401:
+                # Sometimes Mobygames returns 401 even with a valid API key
+                return {}
+ 
+            # Log the error and return an empty dict if the request fails with a different code
             log.error(err)
             return {}
 
@@ -285,7 +293,7 @@ def get_matched_roms_by_name(
         url = yarl.URL(self.games_url).with_query(
             platform=[platform_moby_id], title=quote(search_term, safe="/ ")
         )
-        matched_roms = self._request(str(url))["games"]
+        matched_roms = self._request(str(url)).get("games", [])
 
         return [
             MobyGamesRom(
diff --git a/frontend/assets/platforms/studio-II.ico b/frontend/assets/platforms/studio-II.ico
deleted file mode 100644
index 0745d4989f61c456fd23004d44cfbbcecdfc5b9a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 270398
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
EAN#6;djJ3c


From 8271645f224cdc5c887e7e3139a5d4d8e190a996 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Wed, 3 Apr 2024 10:34:43 -0400
Subject: [PATCH 08/61] correctly fetch cover art

---
 backend/handler/metadata_handler/moby_handler.py | 6 +++---
 frontend/src/components/Details/Title.vue        | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/backend/handler/metadata_handler/moby_handler.py b/backend/handler/metadata_handler/moby_handler.py
index e15651c6e..b76c8ea79 100644
--- a/backend/handler/metadata_handler/moby_handler.py
+++ b/backend/handler/metadata_handler/moby_handler.py
@@ -244,7 +244,7 @@ async def get_rom(self, file_name: str, platform_moby_id: int) -> MobyGamesRom:
             "name": res["title"],
             "slug": res["moby_url"].split("/")[-1],
             "summary": res.get("description", ""),
-            "url_cover": res.get("sample_cover.image", ""),
+            "url_cover": pydash.get(res, "sample_cover.image", ""),
             "url_screenshots": [s["image"] for s in res.get("sample_screenshots", [])],
             "moby_metadata": extract_metadata_from_moby_rom(res),
         }
@@ -267,7 +267,7 @@ def get_rom_by_id(self, moby_id: int) -> MobyGamesRom:
             "name": res["title"],
             "slug": res["moby_url"].split("/")[-1],
             "summary": res.get("description", None),
-            "url_cover": res.get("sample_cover.image", None),
+            "url_cover": pydash.get(res, "sample_cover.image", None),
             "url_screenshots": [s["image"] for s in res.get("sample_screenshots", [])],
             "moby_metadata": extract_metadata_from_moby_rom(res),
         }
@@ -304,7 +304,7 @@ def get_matched_roms_by_name(
                         "name": rom["title"],
                         "slug": rom["moby_url"].split("/")[-1],
                         "summary": rom.get("description", ""),
-                        "url_cover": rom.get("sample_cover.image", ""),
+                        "url_cover": pydash.get(rom, "sample_cover.image", ""),
                         "url_screenshots": [
                             s["image"] for s in rom.get("sample_screenshots", [])
                         ],
diff --git a/frontend/src/components/Details/Title.vue b/frontend/src/components/Details/Title.vue
index 645b98301..37b4c444a 100644
--- a/frontend/src/components/Details/Title.vue
+++ b/frontend/src/components/Details/Title.vue
@@ -74,7 +74,7 @@ const { smAndDown } = useDisplay();
     </v-col>
   </v-row>
   <v-row
-    v-if="rom.igdb_id"
+    v-if="rom.igdb_id || rom.moby_id"
     class="text-white text-shadow"
     :class="{ 'text-center': smAndDown }"
     no-gutters

From 577bf3e8e87c95e8472c9200aec415a61bdf45e6 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Wed, 3 Apr 2024 17:10:44 -0400
Subject: [PATCH 09/61] add scripts folder

---
 .../handler/metadata_handler/igdb_handler.py  | 225 ++++++++++++++++++
 .../handler/metadata_handler/moby_handler.py  |   5 +-
 backend/scripts/__init__.py                   |   0
 .../scripts/generate_supported_platforms.py   | 117 +++++++++
 .../src/components/Dialog/Rom/SearchRom.vue   |   2 +-
 5 files changed, 345 insertions(+), 4 deletions(-)
 create mode 100644 backend/scripts/__init__.py
 create mode 100644 backend/scripts/generate_supported_platforms.py

diff --git a/backend/handler/metadata_handler/igdb_handler.py b/backend/handler/metadata_handler/igdb_handler.py
index 25b759dc8..917323664 100644
--- a/backend/handler/metadata_handler/igdb_handler.py
+++ b/backend/handler/metadata_handler/igdb_handler.py
@@ -614,3 +614,228 @@ def get_oauth_token(self) -> str:
     "similar_games.name",
     "similar_games.cover.url",
 ]
+
+# Generated from the following code on https://www.igdb.com/platforms/:
+# Array.from(document.querySelectorAll(".media-body a")).map(a => ({
+#   slug: a.href.split("/")[4],
+#   name: a.innerText
+# })) 
+
+IGDB_PLATFORM_LIST = [
+    {"slug": "visionos", "name": "visionOS"},
+    {"slug": "meta-quest-3", "name": "Meta Quest 3"},
+    {"slug": "atari2600", "name": "Atari 2600"},
+    {"slug": "psvr2", "name": "PlayStation VR2"},
+    {"slug": "switch", "name": "Nintendo Switch"},
+    {"slug": "evercade", "name": "Evercade"},
+    {"slug": "android", "name": "Android"},
+    {"slug": "mac", "name": "Mac"},
+    {"slug": "win", "name": "PC (Microsoft Windows)"},
+    {"slug": "oculus-quest", "name": "Oculus Quest"},
+    {"slug": "playdate", "name": "Playdate"},
+    {"slug": "series-x", "name": "Xbox Series X"},
+    {"slug": "meta-quest-2", "name": "Meta Quest 2"},
+    {"slug": "ps5", "name": "PlayStation 5"},
+    {"slug": "oculus-rift", "name": "Oculus Rift"},
+    {"slug": "xboxone", "name": "Xbox One"},
+    {"slug": "leaptv", "name": "LeapTV"},
+    {"slug": "new-nintendo-3ds", "name": "New Nintendo 3DS"},
+    {"slug": "gear-vr", "name": "Gear VR"},
+    {"slug": "psvr", "name": "PlayStation VR"},
+    {"slug": "3ds", "name": "Nintendo 3DS"},
+    {"slug": "winphone", "name": "Windows Phone"},
+    {"slug": "arduboy", "name": "Arduboy"},
+    {"slug": "ps4--1", "name": "PlayStation 4"},
+    {"slug": "oculus-go", "name": "Oculus Go"},
+    {"slug": "psvita", "name": "PlayStation Vita"},
+    {"slug": "wiiu", "name": "Wii U"},
+    {"slug": "ouya", "name": "Ouya"},
+    {"slug": "wii", "name": "Wii"},
+    {"slug": "ps3", "name": "PlayStation 3"},
+    {"slug": "psp", "name": "PlayStation Portable"},
+    {"slug": "nintendo-dsi", "name": "Nintendo DSi"},
+    {
+        "slug": "leapster-explorer-slash-leadpad-explorer",
+        "name": "Leapster Explorer/LeadPad Explorer",
+    },
+    {"slug": "xbox360", "name": "Xbox 360"},
+    {"slug": "nds", "name": "Nintendo DS"},
+    {"slug": "ps2", "name": "PlayStation 2"},
+    {"slug": "arcade", "name": "Arcade"},
+    {"slug": "zeebo", "name": "Zeebo"},
+    {"slug": "windows-mobile", "name": "Windows Mobile"},
+    {"slug": "ios", "name": "iOS"},
+    {"slug": "mobile", "name": "Legacy Mobile Device"},
+    {"slug": "blu-ray-player", "name": "Blu-ray Player"},
+    {"slug": "hyperscan", "name": "HyperScan"},
+    {"slug": "gizmondo", "name": "Gizmondo"},
+    {"slug": "gba", "name": "Game Boy Advance"},
+    {"slug": "ngage", "name": "N-Gage"},
+    {"slug": "vsmile", "name": "V.Smile"},
+    {"slug": "n64", "name": "Nintendo 64"},
+    {"slug": "leapster", "name": "Leapster"},
+    {"slug": "zod", "name": "Tapwave Zodiac"},
+    {"slug": "wonderswan-color", "name": "WonderSwan Color"},
+    {"slug": "xbox", "name": "Xbox"},
+    {"slug": "ngc", "name": "Nintendo GameCube"},
+    {"slug": "wonderswan", "name": "WonderSwan"},
+    {"slug": "pokemon-mini", "name": "Pokémon mini"},
+    {"slug": "nuon", "name": "Nuon"},
+    {"slug": "ps", "name": "PlayStation"},
+    {"slug": "nintendo-64dd", "name": "Nintendo 64DD"},
+    {"slug": "neo-geo-pocket-color", "name": "Neo Geo Pocket Color"},
+    {"slug": "dvd-player", "name": "DVD Player"},
+    {"slug": "pocketstation", "name": "PocketStation"},
+    {
+        "slug": "visual-memory-unit-slash-visual-memory-system",
+        "name": "Visual Memory Unit / Visual Memory System",
+    },
+    {"slug": "blackberry", "name": "BlackBerry OS"},
+    {"slug": "dc", "name": "Dreamcast"},
+    {"slug": "gbc", "name": "Game Boy Color"},
+    {"slug": "gb", "name": "Game Boy"},
+    {"slug": "neo-geo-pocket", "name": "Neo Geo Pocket"},
+    {"slug": "snes", "name": "Super Nintendo Entertainment System"},
+    {"slug": "genesis-slash-megadrive", "name": "Sega Mega Drive/Genesis"},
+    {"slug": "sfam", "name": "Super Famicom"},
+    {"slug": "game-dot-com", "name": "Game.com"},
+    {"slug": "hyper-neo-geo-64", "name": "Hyper Neo Geo 64"},
+    {"slug": "satellaview", "name": "Satellaview"},
+    {"slug": "palm-os", "name": "Palm OS"},
+    {"slug": "apple-pippin", "name": "Apple Pippin"},
+    {"slug": "sega32", "name": "Sega 32X"},
+    {"slug": "neo-geo-cd", "name": "Neo Geo CD"},
+    {"slug": "virtualboy", "name": "Virtual Boy"},
+    {"slug": "atari-jaguar-cd", "name": "Atari Jaguar CD"},
+    {"slug": "saturn", "name": "Sega Saturn"},
+    {"slug": "casio-loopy", "name": "Casio Loopy"},
+    {"slug": "sega-pico", "name": "Sega Pico"},
+    {"slug": "r-zone", "name": "R-Zone"},
+    {"slug": "sms", "name": "Sega Master System/Mark III"},
+    {"slug": "playdia", "name": "Playdia"},
+    {"slug": "pc-fx", "name": "PC-FX"},
+    {"slug": "3do", "name": "3DO Interactive Multiplayer"},
+    {
+        "slug": "terebikko-slash-see-n-say-video-phone",
+        "name": "Terebikko / See 'n Say Video Phone",
+    },
+    {"slug": "jaguar", "name": "Atari Jaguar"},
+    {"slug": "segacd", "name": "Sega CD"},
+    {"slug": "nes", "name": "Nintendo Entertainment System"},
+    {"slug": "amiga-cd32", "name": "Amiga CD32"},
+    {"slug": "famicom", "name": "Family Computer"},
+    {"slug": "mega-duck-slash-cougar-boy", "name": "Mega Duck/Cougar Boy"},
+    {"slug": "amiga", "name": "Amiga"},
+    {
+        "slug": "watara-slash-quickshot-supervision",
+        "name": "Watara/QuickShot Supervision",
+    },
+    {"slug": "philips-cd-i", "name": "Philips CD-i"},
+    {"slug": "gamegear", "name": "Sega Game Gear"},
+    {"slug": "neogeoaes", "name": "Neo Geo AES"},
+    {"slug": "linux", "name": "Linux"},
+    {"slug": "turbografx-16-slash-pc-engine-cd", "name": "Turbografx-16/PC Engine CD"},
+    {"slug": "neogeomvs", "name": "Neo Geo MVS"},
+    {"slug": "commodore-cdtv", "name": "Commodore CDTV"},
+    {"slug": "lynx", "name": "Atari Lynx"},
+    {"slug": "gamate", "name": "Gamate"},
+    {"slug": "bbcmicro", "name": "BBC Microcomputer System"},
+    {"slug": "turbografx16--1", "name": "TurboGrafx-16/PC Engine"},
+    {"slug": "supergrafx", "name": "PC Engine SuperGrafx"},
+    {"slug": "fm-towns", "name": "FM Towns"},
+    {"slug": "pc-9800-series", "name": "PC-9800 Series"},
+    {"slug": "apple-iigs", "name": "Apple IIGS"},
+    {"slug": "x1", "name": "Sharp X1"},
+    {"slug": "sharp-x68000", "name": "Sharp X68000"},
+    {"slug": "acorn-archimedes", "name": "Acorn Archimedes"},
+    {"slug": "c64", "name": "Commodore C64/128/MAX"},
+    {"slug": "fds", "name": "Family Computer Disk System"},
+    {"slug": "dragon-32-slash-64", "name": "Dragon 32/64"},
+    {"slug": "acorn-electron", "name": "Acorn Electron"},
+    {"slug": "acpc", "name": "Amstrad CPC"},
+    {"slug": "atari-st", "name": "Atari ST/STE"},
+    {"slug": "tatung-einstein", "name": "Tatung Einstein"},
+    {"slug": "amstrad-pcw", "name": "Amstrad PCW"},
+    {"slug": "epoch-super-cassette-vision", "name": "Epoch Super Cassette Vision"},
+    {"slug": "atari7800", "name": "Atari 7800"},
+    {"slug": "hp3000", "name": "HP 3000"},
+    {"slug": "atari5200", "name": "Atari 5200"},
+    {"slug": "c16", "name": "Commodore 16"},
+    {"slug": "sinclair-ql", "name": "Sinclair QL"},
+    {"slug": "thomson-mo5", "name": "Thomson MO5"},
+    {"slug": "c-plus-4", "name": "Commodore Plus/4"},
+    {"slug": "sg1000", "name": "SG-1000"},
+    {"slug": "vectrex", "name": "Vectrex"},
+    {"slug": "sharp-mz-2200", "name": "Sharp MZ-2200"},
+    {"slug": "nec-pc-6000-series", "name": "NEC PC-6000 Series"},
+    {"slug": "msx2", "name": "MSX2"},
+    {"slug": "msx", "name": "MSX"},
+    {"slug": "colecovision", "name": "ColecoVision"},
+    {"slug": "intellivision", "name": "Intellivision"},
+    {"slug": "vic-20", "name": "Commodore VIC-20"},
+    {"slug": "zxs", "name": "ZX Spectrum"},
+    {"slug": "arcadia-2001", "name": "Arcadia 2001"},
+    {"slug": "fm-7", "name": "FM-7"},
+    {"slug": "trs-80", "name": "TRS-80"},
+    {"slug": "epoch-cassette-vision", "name": "Epoch Cassette Vision"},
+    {"slug": "dos", "name": "DOS"},
+    {"slug": "ti-99", "name": "Texas Instruments TI-99"},
+    {"slug": "sinclair-zx81", "name": "Sinclair ZX81"},
+    {"slug": "pc-8800-series", "name": "PC-8800 Series"},
+    {"slug": "microvision--1", "name": "Microvision"},
+    {"slug": "game-and-watch", "name": "Game & Watch"},
+    {"slug": "atari8bit", "name": "Atari 8-bit"},
+    {"slug": "trs-80-color-computer", "name": "TRS-80 Color Computer"},
+    {
+        "slug": "1292-advanced-programmable-video-system",
+        "name": "1292 Advanced Programmable Video System",
+    },
+    {"slug": "odyssey-2-slash-videopac-g7000", "name": "Odyssey 2 / Videopac G7000"},
+    {"slug": "exidy-sorcerer", "name": "Exidy Sorcerer"},
+    {"slug": "pc-50x-family", "name": "PC-50X Family"},
+    {"slug": "vc-4000", "name": "VC 4000"},
+    {"slug": "appleii", "name": "Apple II"},
+    {"slug": "astrocade", "name": "Bally Astrocade"},
+    {"slug": "ay-3-8500", "name": "AY-3-8500"},
+    {"slug": "cpet", "name": "Commodore PET"},
+    {"slug": "fairchild-channel-f", "name": "Fairchild Channel F"},
+    {"slug": "ay-3-8610", "name": "AY-3-8610"},
+    {"slug": "ay-3-8605", "name": "AY-3-8605"},
+    {"slug": "ay-3-8603", "name": "AY-3-8603"},
+    {"slug": "ay-3-8710", "name": "AY-3-8710"},
+    {"slug": "ay-3-8760", "name": "AY-3-8760"},
+    {"slug": "ay-3-8606", "name": "AY-3-8606"},
+    {"slug": "ay-3-8607", "name": "AY-3-8607"},
+    {"slug": "sol-20", "name": "Sol-20"},
+    {"slug": "odyssey--1", "name": "Odyssey"},
+    {"slug": "plato--1", "name": "PLATO"},
+    {"slug": "cdccyber70", "name": "CDC Cyber 70"},
+    {"slug": "sdssigma7", "name": "SDS Sigma 7"},
+    {"slug": "pdp11", "name": "PDP-11"},
+    {"slug": "hp2100", "name": "HP 2100"},
+    {"slug": "pdp10", "name": "PDP-10"},
+    {
+        "slug": "call-a-computer",
+        "name": "Call-A-Computer time-shared mainframe computer system",
+    },
+    {"slug": "pdp-8--1", "name": "PDP-8"},
+    {"slug": "nintendo-playstation", "name": "Nintendo PlayStation"},
+    {"slug": "pdp1", "name": "PDP-1"},
+    {"slug": "donner30", "name": "Donner Model 30"},
+    {"slug": "edsac--1", "name": "EDSAC"},
+    {"slug": "nimrod", "name": "Ferranti Nimrod Computer"},
+    {"slug": "swancrystal", "name": "SwanCrystal"},
+    {"slug": "panasonic-jungle", "name": "Panasonic Jungle"},
+    {"slug": "handheld-electronic-lcd", "name": "Handheld Electronic LCD"},
+    {"slug": "intellivision-amico", "name": "Intellivision Amico"},
+    {"slug": "legacy-computer", "name": "Legacy Computer"},
+    {"slug": "panasonic-m2", "name": "Panasonic M2"},
+    {"slug": "browser", "name": "Web browser"},
+    {"slug": "ooparts", "name": "OOParts"},
+    {"slug": "stadia", "name": "Google Stadia"},
+    {"slug": "plug-and-play", "name": "Plug & Play"},
+    {"slug": "amazon-fire-tv", "name": "Amazon Fire TV"},
+    {"slug": "onlive-game-system", "name": "OnLive Game System"},
+    {"slug": "vc", "name": "Virtual Console"},
+    {"slug": "airconsole", "name": "AirConsole"},
+]
diff --git a/backend/handler/metadata_handler/moby_handler.py b/backend/handler/metadata_handler/moby_handler.py
index b76c8ea79..74d199845 100644
--- a/backend/handler/metadata_handler/moby_handler.py
+++ b/backend/handler/metadata_handler/moby_handler.py
@@ -108,7 +108,7 @@ def _request(self, url: str, timeout: int = 120) -> dict:
             if err.response.status_code == 401:
                 # Sometimes Mobygames returns 401 even with a valid API key
                 return {}
- 
+
             # Log the error and return an empty dict if the request fails with a different code
             log.error(err)
             return {}
@@ -610,7 +610,6 @@ def get_matched_roms_by_name(
     "sri-5001000": {"id": 242, "name": "SRI-500/1000"},
     "swtpc-6800": {"id": 228, "name": "SWTPC 6800"},
     "sharp-mz-80b20002500": {"id": 182, "name": "Sharp MZ-80B/2000/2500"},
-    "sharp-mz-2200": {"id": 180, "name": "Sharp MZ-2200"},
     "sharp-mz-80k7008001500": {"id": 181, "name": "Sharp MZ-80K/700/800/1500"},
     "sharp-x1": {"id": 121, "name": "Sharp X1"},
     "x1": {"id": 121, "name": "Sharp X1"},  # IGDB
@@ -632,7 +631,7 @@ def get_matched_roms_by_name(
     "tads": {"id": 171, "name": "TADS"},
     "ti-programmable-calculator": {"id": 239, "name": "TI Programmable Calculator"},
     "ti-994a": {"id": 47, "name": "TI-99/4A"},
-    "ti-99": {"id": 47, "name": "TI-99/4A"},
+    "ti-99": {"id": 47, "name": "TI-99/4A"},  # IGDB
     "tim": {"id": 246, "name": "TIM"},
     "trs-80": {"id": 58, "name": "TRS-80"},
     "trs-80-coco": {"id": 62, "name": "TRS-80 Color Computer"},
diff --git a/backend/scripts/__init__.py b/backend/scripts/__init__.py
new file mode 100644
index 000000000..e69de29bb
diff --git a/backend/scripts/generate_supported_platforms.py b/backend/scripts/generate_supported_platforms.py
new file mode 100644
index 000000000..ff62dda21
--- /dev/null
+++ b/backend/scripts/generate_supported_platforms.py
@@ -0,0 +1,117 @@
+# poetry_npm run python3 -m scripts.generate_supported_platforms
+
+from handler.metadata_handler.igdb_handler import IGDB_PLATFORM_LIST
+from handler.metadata_handler.moby_handler import SLUG_TO_MOBY_ID
+
+IGDB_SLUG_TO_MOBY_SLUG = {
+    "bbcmicro": "bbc-micro",
+    "astrocade": "bally-astrocade",
+    "blu-ray-player": "blu-ray-disc-player",
+    "amazon-fire-tv": "fire-os",
+    "acpc": "cpc",
+    "appleii": "apple-ii",
+    "apple-iigs": "apple-iigs",
+    "atari2600": "atari-2600",
+    "atari5200": "atari-5200",
+    "atari7800": "atari-7800",
+    "atari8bit": "atari-8-bit",
+    "acorn-archimedes": "acorn-32-bit",
+    "acorn-electron": "electron",
+    "c16": "commodore-16-plus4",
+    "commodore-cdtv": "cdtv",
+    "cpet": "pet",
+    "c-plus-4": "commodore-16-plus4",
+    "dc": "dreamcast",
+    "fm-towns": "fmtowns",
+    "fairchild-channel-f": "channel-f",
+    "game-dot-com": "game-com",
+    "gb": "gameboy",
+    "gbc": "gameboy-color",
+    "gba": "gameboy-advance",
+    "leapster-explorer-slash-leadpad-explorer": "leapfrog-explorer",
+    "mac": "macintosh",
+    "microvision--1": "microvision",
+    "ngc": "gamecube",
+    "nds": "nintendo-ds",
+    "neogeomvs": "neo-geo",
+    "neogeoaes": "neo-geo",
+    "win": "windows",
+    "onlive-game-system": "onlive",
+    "odyssey-2-slash-videopac-g7000": "odyssey-2",
+    "odyssey--1": "odyssey",
+    "pc-8800-series": "pc88",
+    "pc-9800-series": "pc98",
+    "palm-os": "palmos",
+    "philips-cd-i": "cd-i",
+    "ps": "playstation",
+    "ps4--1": "playstation-4",
+    "ps5": "playstation-5",
+    "psvita": "ps-vita",
+    "sega32x": "sega-32x",
+    "segacd": "sega-cd",
+    "gamegear": "game-gear",
+    "genesis-slash-megadrive": "genesis",
+    "saturn": "sega-saturn",
+    "x1": "sharp-x1",
+    "sinclair-zx81": "zx81",
+    "trs-80-color-computer": "trs-80-coco",
+    "ti-994a": "ti-994a",
+    "thomson-mo5": "thomson-mo",
+    "turbografx16--1": "turbo-grafx",
+    "turbografx-16-slash-pc-engine-cd": "turbografx-cd",
+    "virtualboy": "virtual-boy",
+    "wiiu": "wii-u",
+    "series-x": "xbox-series",
+    "ios": "iphone",
+    "windows-mobile": "windowsphone",
+    "winphone": "windows-phone",
+    "xboxone": "xbox-one",
+}
+
+if __name__ == "__main__":
+    supported_platforms = {}
+    matched_moby_slugs = []
+
+    for platform in IGDB_PLATFORM_LIST:
+        moby_slug = platform["slug"] if platform["slug"] in SLUG_TO_MOBY_ID else None
+        moby_slug = IGDB_SLUG_TO_MOBY_SLUG.get(platform["slug"], moby_slug)
+        supported_platforms[platform["name"]] = {
+            "name": platform["name"],
+            "igdb_slug": platform["slug"],
+            "moby_slug": moby_slug,
+        }
+        if moby_slug:
+            matched_moby_slugs.append(moby_slug)
+
+    # Now go over the moby ids
+    for slug, platform in SLUG_TO_MOBY_ID.items():
+        if (
+            platform["name"] not in supported_platforms
+            and platform["name"].lower() not in supported_platforms
+            and slug not in matched_moby_slugs
+        ):
+            supported_platforms[platform["name"]] = {
+                "name": platform["name"],
+                "igdb_slug": None,
+                "moby_slug": slug,
+            }
+
+    # Sort platforms by key
+    supported_platforms = dict(sorted(supported_platforms.items()))
+
+    print("Below is a list of all supported platforms/systems/consoles and their respective folder names. **The folder name is case-sensitive and must be used exactly as it appears in the list below.**")
+    print("\n")
+    print("|Platform Name|Folder Name|IGDB|Mobygames|")
+    print("|---|---|---|---|")
+
+    for platform in supported_platforms.values():
+        print(
+            f'{platform["name"]} |',
+            f'`{platform["igdb_slug"] or platform["moby_slug"]}` |',
+            f'<a href="https://www.igdb.com/platforms/{platform["igdb_slug"]}" target="_blank" rel="noopener norefer">IGDB</a>|'
+            if platform["igdb_slug"]
+            else " |",
+            f'<a href="https://www.mobygames.com/platform/{platform["moby_slug"]}" target="_blank" rel="noopener norefer">Mobygames</a>'
+            if platform["moby_slug"]
+            else " |",
+        )
diff --git a/frontend/src/components/Dialog/Rom/SearchRom.vue b/frontend/src/components/Dialog/Rom/SearchRom.vue
index dbe155887..6634cf028 100644
--- a/frontend/src/components/Dialog/Rom/SearchRom.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRom.vue
@@ -21,7 +21,7 @@ const theme = useTheme();
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showSearchRomDialog", (romToSearch) => {
   rom.value = romToSearch;
-  searchTerm.value = romToSearch.file_name_no_tags || romToSearch.name || "";
+  searchTerm.value = romToSearch.name || romToSearch.file_name_no_tags || "";
   show.value = true;
   searchRom();
 });

From 6d3bcff4f1cc3b0e7d75c139b85a7c0ae049d69a Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Wed, 3 Apr 2024 22:33:30 -0400
Subject: [PATCH 10/61] move files to utils

---
 backend/handler/fs_handler/tests/test_fs.py                | 2 --
 backend/handler/metadata_handler/moby_handler.py           | 2 ++
 backend/{scripts => utils}/__init__.py                     | 0
 backend/{scripts => utils}/generate_supported_platforms.py | 2 +-
 4 files changed, 3 insertions(+), 3 deletions(-)
 rename backend/{scripts => utils}/__init__.py (100%)
 rename backend/{scripts => utils}/generate_supported_platforms.py (98%)

diff --git a/backend/handler/fs_handler/tests/test_fs.py b/backend/handler/fs_handler/tests/test_fs.py
index 7e452fbaf..909f3f658 100644
--- a/backend/handler/fs_handler/tests/test_fs.py
+++ b/backend/handler/fs_handler/tests/test_fs.py
@@ -119,8 +119,6 @@ def test_exclude_files():
 
     cm.add_exclusion("EXCLUDED_SINGLE_FILES", "Super Mario 64 (J) (Rev A) [Part 1].z64")
 
-    patch("utils.fs.config", cm.get_config())
-
     filtered_files = fs_rom_handler._exclude_files(
         files=[
             "Super Mario 64 (J) (Rev A) [Part 1].z64",
diff --git a/backend/handler/metadata_handler/moby_handler.py b/backend/handler/metadata_handler/moby_handler.py
index 74d199845..bdac7234f 100644
--- a/backend/handler/metadata_handler/moby_handler.py
+++ b/backend/handler/metadata_handler/moby_handler.py
@@ -521,6 +521,7 @@ def get_matched_roms_by_name(
     "ngage": {"id": 32, "name": "N-Gage"},
     "ngage2": {"id": 89, "name": "N-Gage (service)"},
     "nes": {"id": 22, "name": "NES"},
+    "famicom": {"id": 22, "name": "NES"},
     "nascom": {"id": 175, "name": "Nascom"},
     "neo-geo": {"id": 36, "name": "Neo Geo"},
     "neogeoaes": {"id": 36, "name": "Neo Geo"},  # IGDB
@@ -607,6 +608,7 @@ def get_matched_roms_by_name(
     "sk-vm": {"id": 259, "name": "SK-VM"},
     "smc-777": {"id": 273, "name": "SMC-777"},
     "snes": {"id": 15, "name": "SNES"},
+    "sfam": {"id": 15, "name": "SNES"},
     "sri-5001000": {"id": 242, "name": "SRI-500/1000"},
     "swtpc-6800": {"id": 228, "name": "SWTPC 6800"},
     "sharp-mz-80b20002500": {"id": 182, "name": "Sharp MZ-80B/2000/2500"},
diff --git a/backend/scripts/__init__.py b/backend/utils/__init__.py
similarity index 100%
rename from backend/scripts/__init__.py
rename to backend/utils/__init__.py
diff --git a/backend/scripts/generate_supported_platforms.py b/backend/utils/generate_supported_platforms.py
similarity index 98%
rename from backend/scripts/generate_supported_platforms.py
rename to backend/utils/generate_supported_platforms.py
index ff62dda21..974c33907 100644
--- a/backend/scripts/generate_supported_platforms.py
+++ b/backend/utils/generate_supported_platforms.py
@@ -1,4 +1,4 @@
-# poetry_npm run python3 -m scripts.generate_supported_platforms
+# poetry_npm run python3 -m utils.generate_supported_platforms
 
 from handler.metadata_handler.igdb_handler import IGDB_PLATFORM_LIST
 from handler.metadata_handler.moby_handler import SLUG_TO_MOBY_ID

From 47018cca07589e1d11fe671f3d09d4057a6a0143 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Wed, 3 Apr 2024 23:38:49 -0400
Subject: [PATCH 11/61] add ttinfoil feed

---
 backend/endpoints/{webrcade.py => feeds.py}   | 36 +++++++++++++++++--
 .../responses/{webrcade.py => feeds.py}       |  6 ++++
 backend/handler/db_handler/db_roms_handler.py |  1 -
 backend/main.py                               |  4 +--
 4 files changed, 41 insertions(+), 6 deletions(-)
 rename backend/endpoints/{webrcade.py => feeds.py} (68%)
 rename backend/endpoints/responses/{webrcade.py => feeds.py} (92%)

diff --git a/backend/endpoints/webrcade.py b/backend/endpoints/feeds.py
similarity index 68%
rename from backend/endpoints/webrcade.py
rename to backend/endpoints/feeds.py
index 0ae1d5dd4..2f5bb1064 100644
--- a/backend/endpoints/webrcade.py
+++ b/backend/endpoints/feeds.py
@@ -1,12 +1,14 @@
 from config import ROMM_HOST
 from decorators.auth import protected_route
-from endpoints.responses.webrcade import (
+from models.rom import Rom
+from fastapi import APIRouter, Request
+from handler import db_platform_handler, db_rom_handler
+from .responses.feeds import (
     WEBRCADE_SLUG_TO_TYPE_MAP,
     WEBRCADE_SUPPORTED_PLATFORM_SLUGS,
     WebrcadeFeedSchema,
+    TinfoilFeedSchema,
 )
-from fastapi import APIRouter, Request
-from handler import db_platform_handler, db_rom_handler
 
 router = APIRouter()
 
@@ -54,3 +56,31 @@ def platforms_webrcade_feed(request: Request) -> WebrcadeFeedSchema:
                 if p.slug in WEBRCADE_SUPPORTED_PLATFORM_SLUGS
             ],
         }
+
+@protected_route(router.get, "/tinfoil/feed", ["roms.read"])
+def tinfoil_index_feed(request: Request, slug: str = "switch") -> TinfoilFeedSchema:
+    """Get tinfoil custom index feed endpoint
+    https://blawar.github.io/tinfoil/custom_index/
+
+    Args:
+        request (Request): Fastapi Request object
+        slug (str, optional): Platform slug. Defaults to "switch".
+
+    Returns:
+        TinfoilFeedSchema: Tinfoil feed object schema
+    """
+    switch = db_platform_handler.get_platform_by_fs_slug(slug)
+    with db_rom_handler.session.begin() as session:
+        files: list[Rom] = session.scalars(db_rom_handler.get_roms(platform_id=switch.id)).all()
+
+        return {
+            "files": [
+                {
+                    "url": f"{ROMM_HOST}/api/roms/{file.id}/content/{file.file_name}",
+                    "size": file.file_size_bytes,
+                }
+                for file in files
+            ],
+            "directories": [],
+            "success": "RomM Switch Library"
+        }
diff --git a/backend/endpoints/responses/webrcade.py b/backend/endpoints/responses/feeds.py
similarity index 92%
rename from backend/endpoints/responses/webrcade.py
rename to backend/endpoints/responses/feeds.py
index 312c66b36..c87c14017 100644
--- a/backend/endpoints/responses/webrcade.py
+++ b/backend/endpoints/responses/feeds.py
@@ -62,3 +62,9 @@ class WebrcadeFeedSchema(TypedDict):
     thumbnail: str
     background: str
     categories: list[dict]
+
+
+class TinfoilFeedSchema(TypedDict):
+    files: list[dict]
+    directories: list[str]
+    success: str
diff --git a/backend/handler/db_handler/db_roms_handler.py b/backend/handler/db_handler/db_roms_handler.py
index c1cc08711..d6e598a86 100644
--- a/backend/handler/db_handler/db_roms_handler.py
+++ b/backend/handler/db_handler/db_roms_handler.py
@@ -45,7 +45,6 @@ def get_roms(
         order_dir: str = "asc",
         session: Session = None,
     ):
-        select(Rom).filter()
         return (
             session.get(Rom, id)
             if id
diff --git a/backend/main.py b/backend/main.py
index e0b1e0edb..6495175bf 100644
--- a/backend/main.py
+++ b/backend/main.py
@@ -18,8 +18,8 @@
     stats,
     tasks,
     user,
-    webrcade,
     screenshots,
+    feeds,
 )
 import endpoints.sockets.scan  # noqa
 from fastapi import FastAPI
@@ -84,7 +84,7 @@ async def lifespan(app: FastAPI):
 app.include_router(saves.router)
 app.include_router(states.router)
 app.include_router(tasks.router)
-app.include_router(webrcade.router)
+app.include_router(feeds.router)
 app.include_router(config.router)
 app.include_router(stats.router)
 app.include_router(raw.router)

From 3abc074591c021fa26f751ad24c23fcd925a2246 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Thu, 4 Apr 2024 09:38:06 -0400
Subject: [PATCH 12/61] show full title on hover

---
 frontend/src/components/Dialog/Rom/SearchRom.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/Dialog/Rom/SearchRom.vue b/frontend/src/components/Dialog/Rom/SearchRom.vue
index 6634cf028..a8aba18c0 100644
--- a/frontend/src/components/Dialog/Rom/SearchRom.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRom.vue
@@ -289,7 +289,7 @@ onBeforeUnmount(() => {
                 <v-card-text>
                   <v-row class="pa-1 align-center">
                     <v-col class="pa-0 ml-1 text-truncate">
-                      <span>{{ matchedRom.name }}</span>
+                      <span :title="matchedRom.name">{{ matchedRom.name }}</span>
                     </v-col>
                   </v-row>
                 </v-card-text>

From a573780a92fa128b57b8e119d41ac36b23d913f0 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Thu, 4 Apr 2024 09:48:54 -0400
Subject: [PATCH 13/61] fix edge case with item not returning name

---
 backend/endpoints/search.py | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/backend/endpoints/search.py b/backend/endpoints/search.py
index 70ae50937..c103d214b 100644
--- a/backend/endpoints/search.py
+++ b/backend/endpoints/search.py
@@ -48,7 +48,9 @@ async def search_rom(
     if not search_term:
         return []
 
-    log.info(emoji.emojize(":magnifying_glass_tilted_right: Searching metadata providers..."))
+    log.info(
+        emoji.emojize(":magnifying_glass_tilted_right: Searching metadata providers...")
+    )
     matched_roms: list = []
 
     log.info(f"Searching by {search_by.lower()}: {search_term}")
@@ -73,7 +75,10 @@ async def search_rom(
 
     merged_dict = {item["name"]: item for item in igdb_matched_roms}
     for item in moby_matched_roms:
-        merged_dict[item["name"]] = {**item, **merged_dict.get(item["name"], {})}
+        merged_dict[item["name"]] = {
+            **item,
+            **merged_dict.get(item.get("name", ""), {}),
+        }
 
     matched_roms = [
         {

From eda6d78c4b8480eb99dcfba5de9fdcd00be9b1f2 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Thu, 4 Apr 2024 15:25:00 -0400
Subject: [PATCH 14/61] add env to disable auth on download endpoint

---
 backend/config/__init__.py |  3 +++
 backend/endpoints/feeds.py | 23 +++++++++++++++++------
 backend/endpoints/rom.py   | 14 +++++++++++---
 3 files changed, 31 insertions(+), 9 deletions(-)

diff --git a/backend/config/__init__.py b/backend/config/__init__.py
index d95a7b393..1ec54d3ed 100644
--- a/backend/config/__init__.py
+++ b/backend/config/__init__.py
@@ -54,6 +54,9 @@
     "ROMM_AUTH_SECRET_KEY", secrets.token_hex(32)
 )
 DISABLE_CSRF_PROTECTION = os.environ.get("DISABLE_CSRF_PROTECTION", "false") == "true"
+DISABLE_DOWNLOAD_ENDPOINT_AUTH = (
+    os.environ.get("DISABLE_DOWNLOAD_ENDPOINT_AUTH", "false") == "true"
+)
 
 # SCANS
 SCAN_TIMEOUT: Final = int(os.environ.get("SCAN_TIMEOUT", 60 * 60 * 4))  # 4 hours
diff --git a/backend/endpoints/feeds.py b/backend/endpoints/feeds.py
index 2f5bb1064..668d70f48 100644
--- a/backend/endpoints/feeds.py
+++ b/backend/endpoints/feeds.py
@@ -1,4 +1,4 @@
-from config import ROMM_HOST
+from config import ROMM_HOST, DISABLE_DOWNLOAD_ENDPOINT_AUTH
 from decorators.auth import protected_route
 from models.rom import Rom
 from fastapi import APIRouter, Request
@@ -13,7 +13,11 @@
 router = APIRouter()
 
 
-@protected_route(router.get, "/webrcade/feed", ["roms.read"])
+@protected_route(
+    router.get,
+    "/webrcade/feed",
+    [] if DISABLE_DOWNLOAD_ENDPOINT_AUTH else ["roms.read"],
+)
 def platforms_webrcade_feed(request: Request) -> WebrcadeFeedSchema:
     """Get webrcade feed endpoint
 
@@ -47,9 +51,13 @@ def platforms_webrcade_feed(request: Request) -> WebrcadeFeedSchema:
                             "type": WEBRCADE_SLUG_TO_TYPE_MAP.get(p.slug, p.slug),
                             "thumbnail": f"{ROMM_HOST}/assets/romm/resources/{rom.path_cover_s}",
                             "background": f"{ROMM_HOST}/assets/romm/resources/{rom.path_cover_l}",
-                            "props": {"rom": f"{ROMM_HOST}/api/roms/{rom.id}/content/{rom.file_name}"},
+                            "props": {
+                                "rom": f"{ROMM_HOST}/api/roms/{rom.id}/content/{rom.file_name}"
+                            },
                         }
-                        for rom in session.scalars(db_rom_handler.get_roms(platform_id=p.id)).all()
+                        for rom in session.scalars(
+                            db_rom_handler.get_roms(platform_id=p.id)
+                        ).all()
                     ],
                 }
                 for p in platforms
@@ -57,6 +65,7 @@ def platforms_webrcade_feed(request: Request) -> WebrcadeFeedSchema:
             ],
         }
 
+
 @protected_route(router.get, "/tinfoil/feed", ["roms.read"])
 def tinfoil_index_feed(request: Request, slug: str = "switch") -> TinfoilFeedSchema:
     """Get tinfoil custom index feed endpoint
@@ -71,7 +80,9 @@ def tinfoil_index_feed(request: Request, slug: str = "switch") -> TinfoilFeedSch
     """
     switch = db_platform_handler.get_platform_by_fs_slug(slug)
     with db_rom_handler.session.begin() as session:
-        files: list[Rom] = session.scalars(db_rom_handler.get_roms(platform_id=switch.id)).all()
+        files: list[Rom] = session.scalars(
+            db_rom_handler.get_roms(platform_id=switch.id)
+        ).all()
 
         return {
             "files": [
@@ -82,5 +93,5 @@ def tinfoil_index_feed(request: Request, slug: str = "switch") -> TinfoilFeedSch
                 for file in files
             ],
             "directories": [],
-            "success": "RomM Switch Library"
+            "success": "RomM Switch Library",
         }
diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index cfa9be408..b792dffe4 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -3,7 +3,7 @@
 from stat import S_IFREG
 from typing import Annotated, Optional
 
-from config import LIBRARY_BASE_PATH
+from config import LIBRARY_BASE_PATH, DISABLE_DOWNLOAD_ENDPOINT_AUTH
 from decorators.auth import protected_route
 from endpoints.responses import MessageResponse
 from endpoints.responses.rom import (
@@ -118,7 +118,11 @@ def get_roms(
         return paginate(session, qq, cursor_params)
 
 
-@protected_route(router.get, "/roms/{id}", ["roms.read"])
+@protected_route(
+    router.get,
+    "/roms/{id}",
+    [] if DISABLE_DOWNLOAD_ENDPOINT_AUTH else ["roms.read"],
+)
 def get_rom(request: Request, id: int) -> RomSchema:
     """Get rom endpoint
 
@@ -132,7 +136,11 @@ def get_rom(request: Request, id: int) -> RomSchema:
     return RomSchema.from_orm_with_request(db_rom_handler.get_roms(id), request)
 
 
-@protected_route(router.head, "/roms/{id}/content/{file_name}", ["roms.read"])
+@protected_route(
+    router.head,
+    "/roms/{id}/content/{file_name}",
+    [] if DISABLE_DOWNLOAD_ENDPOINT_AUTH else ["roms.read"],
+)
 def head_rom_content(request: Request, id: int, file_name: str):
     """Head rom content endpoint
 

From c5dffaa5bd8a19a442c35b72ee81623971c5da13 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Fri, 5 Apr 2024 02:12:24 +0200
Subject: [PATCH 15/61] little UI tweaks

---
 frontend/assets/scrappers/igdb.png            | Bin 0 -> 2021 bytes
 frontend/assets/scrappers/moby.png            | Bin 0 -> 24824 bytes
 .../components/Details/AdditionalContent.vue  |   4 +-
 .../src/components/Dialog/Rom/SearchRom.vue   |  71 +++++++++++++-----
 frontend/src/views/Library/Scan/Base.vue      |  27 +++++--
 5 files changed, 77 insertions(+), 25 deletions(-)
 create mode 100644 frontend/assets/scrappers/igdb.png
 create mode 100644 frontend/assets/scrappers/moby.png

diff --git a/frontend/assets/scrappers/igdb.png b/frontend/assets/scrappers/igdb.png
new file mode 100644
index 0000000000000000000000000000000000000000..50861f908ffb8eb18dbbf1b7fbcd81e6e85154f0
GIT binary patch
literal 2021
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

literal 0
HcmV?d00001

diff --git a/frontend/assets/scrappers/moby.png b/frontend/assets/scrappers/moby.png
new file mode 100644
index 0000000000000000000000000000000000000000..212e2375988962850e08abe98e7263d55b806012
GIT binary patch
literal 24824
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
Gh5rvi&Tt+8

literal 0
HcmV?d00001

diff --git a/frontend/src/components/Details/AdditionalContent.vue b/frontend/src/components/Details/AdditionalContent.vue
index 6b78e2abe..249529a83 100644
--- a/frontend/src/components/Details/AdditionalContent.vue
+++ b/frontend/src/components/Details/AdditionalContent.vue
@@ -13,7 +13,7 @@ const theme = useTheme();
       sm="3"
       md="3"
       lg="4"
-      xl="3"
+      xl="6"
       v-for="expansion in rom.igdb_metadata?.expansions"
     >
       <a
@@ -69,7 +69,7 @@ const theme = useTheme();
       sm="3"
       md="3"
       lg="4"
-      xl="3"
+      xl="6"
       v-for="dlc in rom.igdb_metadata?.dlcs"
     >
       <a
diff --git a/frontend/src/components/Dialog/Rom/SearchRom.vue b/frontend/src/components/Dialog/Rom/SearchRom.vue
index a8aba18c0..a6d98cf36 100644
--- a/frontend/src/components/Dialog/Rom/SearchRom.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRom.vue
@@ -268,28 +268,59 @@ onBeforeUnmount(() => {
                         />
                       </div>
                     </template>
-                    <v-row no-gutters class="text-white px-1">
-                      <v-chip
-                        class="translucent mr-1 mt-1"
-                        label
-                        v-if="matchedRom.igdb_id"
-                      >
-                        <span> IGDB </span>
-                      </v-chip>
-                      <v-chip
-                        class="translucent mr-1 mt-1"
-                        label
-                        v-if="matchedRom.moby_id"
+                    <v-expand-transition>
+                      <div
+                        v-if="isHovering || !matchedRom.url_cover"
+                        class="translucent text-caption"
                       >
-                        <span> Moby </span>
-                      </v-chip>
-                    </v-row>
-                  </v-img></v-hover
-                >
+                        <v-list-item>{{ matchedRom.name }}</v-list-item>
+                      </div>
+                    </v-expand-transition>
+                    <v-row no-gutters class="text-white pa-1">
+                      <v-tooltip
+                        location="top"
+                        class="tooltip"
+                        transition="fade-transition"
+                        text="IGDB matched"
+                        open-delay="500"
+                        ><template v-slot:activator="{ props }">
+                          <v-avatar
+                            v-bind="props"
+                            v-if="matchedRom.igdb_id"
+                            class="mr-1"
+                            size="30"
+                            rounded="1"
+                          >
+                            <v-img
+                              src="/assets/scrappers/igdb.png"
+                            /> </v-avatar></template
+                      ></v-tooltip>
+                      <v-tooltip
+                        location="top"
+                        class="tooltip"
+                        transition="fade-transition"
+                        text="Mobygames matched"
+                        open-delay="500"
+                        ><template v-slot:activator="{ props }">
+                          <v-avatar
+                            v-bind="props"
+                            v-if="matchedRom.moby_id"
+                            class="mr-1"
+                            size="30"
+                            rounded="1"
+                          >
+                            <v-img
+                              src="/assets/scrappers/moby.png"
+                            /> </v-avatar></template
+                      ></v-tooltip>
+                    </v-row> </v-img
+                ></v-hover>
                 <v-card-text>
                   <v-row class="pa-1 align-center">
                     <v-col class="pa-0 ml-1 text-truncate">
-                      <span :title="matchedRom.name">{{ matchedRom.name }}</span>
+                      <span :title="matchedRom.name">{{
+                        matchedRom.name
+                      }}</span>
                     </v-col>
                   </v-row>
                 </v-card-text>
@@ -345,4 +376,8 @@ onBeforeUnmount(() => {
   backdrop-filter: blur(10px);
   text-shadow: 1px 1px 1px #000000, 0 0 1px #000000;
 }
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
 </style>
diff --git a/frontend/src/views/Library/Scan/Base.vue b/frontend/src/views/Library/Scan/Base.vue
index d8f782b6c..d63430ed9 100644
--- a/frontend/src/views/Library/Scan/Base.vue
+++ b/frontend/src/views/Library/Scan/Base.vue
@@ -6,12 +6,14 @@ import socket from "@/services/socket";
 import storeHeartbeat from "@/stores/heartbeat";
 import storePlatforms, { type Platform } from "@/stores/platforms";
 import storeScanning from "@/stores/scanning";
+import { useDisplay } from "vuetify";
 
 // Props
 const scanningStore = storeScanning();
 const { scanning, scanningPlatforms, scanStats } = storeToRefs(scanningStore);
 const platforms = storePlatforms();
 const heartbeat = storeHeartbeat();
+const { smAndDown } = useDisplay();
 
 const scanOptions = [
   {
@@ -90,7 +92,7 @@ watch(metadataOptions, (newOptions) => {
 <template>
   <!-- Platform selector -->
   <v-row class="px-4 pt-4 align-center" no-gutters>
-    <v-col cols="6" class="pr-1">
+    <v-col cols="12" xs="12" sm="12" md="6" xl="6" class="pr-1">
       <v-select
         label="Platforms"
         item-title="name"
@@ -116,7 +118,15 @@ watch(metadataOptions, (newOptions) => {
         </template>
       </v-select>
     </v-col>
-    <v-col cols="3" class="pr-1">
+    <v-col
+      cols="12"
+      xs="5"
+      sm="5"
+      md="3"
+      xl="3"
+      class="pr-1"
+      :class="{ 'mt-3': smAndDown }"
+    >
       <v-select
         label="Metadata sources"
         item-title="name"
@@ -146,7 +156,15 @@ watch(metadataOptions, (newOptions) => {
         </template>
       </v-select>
     </v-col>
-    <v-col cols="3">
+    <v-col
+      cols="12"
+      xs="7"
+      sm="7"
+      md="3"
+      xl="3"
+      class="pr-1"
+      :class="{ 'mt-3': smAndDown }"
+    >
       <!-- Scan options -->
       <v-select
         hide-details
@@ -155,7 +173,6 @@ watch(metadataOptions, (newOptions) => {
         label="Scan option"
         v-model="scanType"
         :items="scanOptions"
-        class="py-3"
       >
         <template v-slot:item="{ props, item }">
           <v-list-item
@@ -200,7 +217,7 @@ watch(metadataOptions, (newOptions) => {
     </v-btn>
     <span
       v-if="metadataSources.length == 0"
-      class="ml-4 text-caption text-yellow"
+      class="ml-4 text-caption text-yellow py-4"
     >
       <v-icon class="mr-2">mdi-alert</v-icon>
       Please select at least one metadata source.

From 893fb81c2744977cdcf724d594e785b5635651b9 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Fri, 5 Apr 2024 17:40:13 +0200
Subject: [PATCH 16/61] added delete cover UI

---
 frontend/src/components/Details/Cover.vue     |  21 +++-
 .../src/components/Dialog/Rom/EditRom.vue     | 111 ++++++++++--------
 2 files changed, 81 insertions(+), 51 deletions(-)

diff --git a/frontend/src/components/Details/Cover.vue b/frontend/src/components/Details/Cover.vue
index 461c26276..cfcce589b 100644
--- a/frontend/src/components/Details/Cover.vue
+++ b/frontend/src/components/Details/Cover.vue
@@ -5,7 +5,7 @@ import { useTheme } from "vuetify";
 const theme = useTheme();
 
 const downloadStore = storeDownload();
-defineProps<{ rom: Rom }>();
+defineProps<{ rom: Rom; editable: boolean }>();
 </script>
 <template>
   <v-card
@@ -31,6 +31,14 @@ defineProps<{ rom: Rom }>();
       "
       :aspect-ratio="3 / 4"
     >
+      <v-chip-group v-if="editable" class="position-absolute edit-cover pa-0">
+        <v-chip class="translucent" size="small" @click="" label
+          ><v-icon>mdi-pencil</v-icon></v-chip
+        >
+        <v-chip class="translucent" size="small" @click="" label
+          ><v-icon class="text-red">mdi-delete</v-icon></v-chip
+        >
+      </v-chip-group>
       <template v-slot:placeholder>
         <div class="d-flex align-center justify-center fill-height">
           <v-progress-circular
@@ -44,3 +52,14 @@ defineProps<{ rom: Rom }>();
     </v-img>
   </v-card>
 </template>
+
+<style scoped>
+.edit-cover {
+  bottom: -0.1rem;
+  right: -0.1rem;
+}
+.translucent {
+  background: rgba(0, 0, 0, 0.35);
+  backdrop-filter: blur(10px);
+}
+</style>
diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index 0e9aa5a62..2767e8c22 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -1,13 +1,14 @@
 <script setup lang="ts">
-import { ref, inject } from "vue";
-import { useDisplay } from "vuetify";
-import type { Emitter } from "mitt";
+import Cover from "@/components/Details/Cover.vue";
 import type { Events } from "@/types/emitter";
+import type { Emitter } from "mitt";
+import { inject, ref } from "vue";
+import { useDisplay } from "vuetify";
 
 import romApi, { type UpdateRom } from "@/services/api/rom";
 import storeRoms from "@/stores/roms";
 
-const { xs, mdAndDown, lgAndUp } = useDisplay();
+const { xs, mdAndDown, smAndDown, md, lgAndUp } = useDisplay();
 const show = ref(false);
 const rom = ref<UpdateRom>();
 const romsStore = storeRoms();
@@ -113,51 +114,61 @@ function closeDialog() {
       <v-divider class="border-opacity-25" :thickness="1" />
 
       <v-card-text>
-        <v-row class="pa-2" no-gutters>
-          <v-text-field
-            @keyup.enter="updateRom()"
-            v-model="rom.name"
-            label="Name"
-            variant="outlined"
-            required
-            hide-details
-          />
-        </v-row>
-        <v-row class="pa-2" no-gutters>
-          <v-text-field
-            @keyup.enter="updateRom()"
-            v-model="rom.file_name"
-            :rules="[
-              fileNameInputRules.newFileName,
-              fileNameInputRules.required,
-            ]"
-            label="File name"
-            variant="outlined"
-            required
-            hide-details
-          />
-        </v-row>
-        <v-row class="pa-2" no-gutters>
-          <v-textarea
-            @keyup.enter="updateRom()"
-            v-model="rom.summary"
-            label="Summary"
-            variant="outlined"
-            required
-            hide-details
-          />
-        </v-row>
-        <v-row class="pa-2" no-gutters>
-          <v-file-input
-            @keyup.enter="updateRom()"
-            v-model="rom.artwork"
-            label="Custom artwork"
-            accept="image/*"
-            prepend-inner-icon="mdi-image"
-            prepend-icon=""
-            variant="outlined"
-            hide-details
-          />
+        <v-row class="align-center" no-gutters>
+          <v-col cols="12" md="8" lg="9">
+            <v-text-field
+              class="py-2"
+              :class="{ 'pr-4': lgAndUp }"
+              @keyup.enter="updateRom()"
+              v-model="rom.name"
+              label="Name"
+              variant="outlined"
+              required
+              hide-details
+            />
+            <v-text-field
+              class="py-2"
+              :class="{ 'pr-4': lgAndUp }"
+              @keyup.enter="updateRom()"
+              v-model="rom.file_name"
+              :rules="[
+                fileNameInputRules.newFileName,
+                fileNameInputRules.required,
+              ]"
+              label="File name"
+              variant="outlined"
+              required
+              hide-details
+            />
+            <v-textarea
+              class="py-2"
+              :class="{ 'pr-4': lgAndUp }"
+              @keyup.enter="updateRom()"
+              v-model="rom.summary"
+              label="Summary"
+              variant="outlined"
+              required
+              hide-details
+            />
+          </v-col>
+          <v-col cols="12" md="4" lg="3">
+            <cover
+              :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
+              :rom="rom"
+              :editable="true"
+            />
+            <!-- <v-file-input
+              class="px-1 py-2"
+              @keyup.enter="updateRom()"
+              v-model="rom.artwork"
+              label="Custom artwork"
+              accept="image/*"
+              prepend-inner-icon="mdi-image"
+              prepend-icon=""
+              variant="outlined"
+              hide-details
+            /> -->
+          </v-col>
         </v-row>
         <v-row class="justify-center pa-2" no-gutters>
           <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>
@@ -176,7 +187,7 @@ function closeDialog() {
 }
 
 .edit-content-tablet {
-  width: 570px;
+  width: 620px;
 }
 
 .edit-content-mobile {

From 5d9a4e6b0cd1bc66c7662f60aba5ab57f68a0665 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Fri, 5 Apr 2024 23:30:17 +0200
Subject: [PATCH 17/61] improved edit artwork file input UI

---
 frontend/src/components/Details/Cover.vue     | 22 +-----
 .../src/components/Dialog/Rom/EditRom.vue     | 70 ++++++++++++++-----
 frontend/src/views/Details/Base.vue           |  2 +-
 3 files changed, 56 insertions(+), 38 deletions(-)

diff --git a/frontend/src/components/Details/Cover.vue b/frontend/src/components/Details/Cover.vue
index cfcce589b..86548c9b4 100644
--- a/frontend/src/components/Details/Cover.vue
+++ b/frontend/src/components/Details/Cover.vue
@@ -4,8 +4,8 @@ import type { Rom } from "@/stores/roms";
 import { useTheme } from "vuetify";
 const theme = useTheme();
 
+defineProps<{ rom: Rom }>();
 const downloadStore = storeDownload();
-defineProps<{ rom: Rom; editable: boolean }>();
 </script>
 <template>
   <v-card
@@ -31,14 +31,7 @@ defineProps<{ rom: Rom; editable: boolean }>();
       "
       :aspect-ratio="3 / 4"
     >
-      <v-chip-group v-if="editable" class="position-absolute edit-cover pa-0">
-        <v-chip class="translucent" size="small" @click="" label
-          ><v-icon>mdi-pencil</v-icon></v-chip
-        >
-        <v-chip class="translucent" size="small" @click="" label
-          ><v-icon class="text-red">mdi-delete</v-icon></v-chip
-        >
-      </v-chip-group>
+      <slot name="editable"></slot>
       <template v-slot:placeholder>
         <div class="d-flex align-center justify-center fill-height">
           <v-progress-circular
@@ -52,14 +45,3 @@ defineProps<{ rom: Rom; editable: boolean }>();
     </v-img>
   </v-card>
 </template>
-
-<style scoped>
-.edit-cover {
-  bottom: -0.1rem;
-  right: -0.1rem;
-}
-.translucent {
-  background: rgba(0, 0, 0, 0.35);
-  backdrop-filter: blur(10px);
-}
-</style>
diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index 2767e8c22..410427a1a 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -1,22 +1,22 @@
 <script setup lang="ts">
 import Cover from "@/components/Details/Cover.vue";
+import romApi, { type UpdateRom } from "@/services/api/rom";
+import storeRoms from "@/stores/roms";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
-import { useDisplay } from "vuetify";
-
-import romApi, { type UpdateRom } from "@/services/api/rom";
-import storeRoms from "@/stores/roms";
+import { useDisplay, useTheme } from "vuetify";
 
+// Props
 const { xs, mdAndDown, smAndDown, md, lgAndUp } = useDisplay();
 const show = ref(false);
 const rom = ref<UpdateRom>();
 const romsStore = storeRoms();
+const theme = useTheme();
 const fileNameInputRules = {
   required: (value: string) => !!value || "Required",
   newFileName: (value: string) => !value.includes("/") || "Invalid characters",
 };
-
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showEditRomDialog", (romToEdit) => {
   show.value = true;
@@ -24,6 +24,15 @@ emitter?.on("showEditRomDialog", (romToEdit) => {
 });
 
 // Functions
+function triggerFileInput() {
+  const fileInput = document.getElementById("file-input");
+  fileInput?.click();
+}
+
+function removeArtwork() {
+  console.log(rom.value);
+}
+
 async function updateRom() {
   if (!rom.value) return;
 
@@ -156,18 +165,33 @@ function closeDialog() {
               :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
               :rom="rom"
               :editable="true"
-            />
-            <!-- <v-file-input
-              class="px-1 py-2"
-              @keyup.enter="updateRom()"
-              v-model="rom.artwork"
-              label="Custom artwork"
-              accept="image/*"
-              prepend-inner-icon="mdi-image"
-              prepend-icon=""
-              variant="outlined"
-              hide-details
-            /> -->
+            >
+              <template v-slot:editable>
+                <v-chip-group class="position-absolute edit-cover pa-0">
+                  <v-chip
+                    class="translucent"
+                    size="small"
+                    @click="triggerFileInput"
+                    label
+                    ><v-icon>mdi-pencil</v-icon>
+                    <v-file-input
+                      id="file-input"
+                      v-model="rom.artwork"
+                      accept="image/*"
+                      hide-details
+                      class="file-input"
+                    />
+                  </v-chip>
+                  <v-chip
+                    class="translucent"
+                    size="small"
+                    @click="removeArtwork"
+                    label
+                    ><v-icon class="text-red">mdi-delete</v-icon></v-chip
+                  >
+                </v-chip-group>
+              </template>
+            </cover>
           </v-col>
         </v-row>
         <v-row class="justify-center pa-2" no-gutters>
@@ -193,4 +217,16 @@ function closeDialog() {
 .edit-content-mobile {
   width: 85vw;
 }
+
+.edit-cover {
+  bottom: -0.1rem;
+  right: -0.1rem;
+}
+.file-input {
+  display: none;
+}
+.translucent {
+  background: rgba(0, 0, 0, 0.35);
+  backdrop-filter: blur(10px);
+}
 </style>
diff --git a/frontend/src/views/Details/Base.vue b/frontend/src/views/Details/Base.vue
index 71056ac8d..190b79a05 100644
--- a/frontend/src/views/Details/Base.vue
+++ b/frontend/src/views/Details/Base.vue
@@ -122,7 +122,7 @@ watch(
           'cover-xs': smAndDown,
         }"
       >
-        <cover :rom="rom" />
+        <cover :rom="rom" :editable="false" />
         <action-bar class="mt-2" :rom="rom" />
         <related-games class="mt-3 px-2" v-if="mdAndUp" :rom="rom" />
       </v-col>

From d1bdfedb3c6a8fbf7d9037d6ec030d2e35ebc2fc Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Sat, 6 Apr 2024 00:49:09 +0200
Subject: [PATCH 18/61] viewer role UI permissions fixed

---
 .../src/views/Settings/ControlPanel/Base.vue  | 29 +++++++++++++++----
 .../Settings/ControlPanel/General/Base.vue    |  6 +++-
 2 files changed, 29 insertions(+), 6 deletions(-)

diff --git a/frontend/src/views/Settings/ControlPanel/Base.vue b/frontend/src/views/Settings/ControlPanel/Base.vue
index b8d077e67..254f28e04 100644
--- a/frontend/src/views/Settings/ControlPanel/Base.vue
+++ b/frontend/src/views/Settings/ControlPanel/Base.vue
@@ -7,7 +7,7 @@ import ControlPanelUsers from "@/views/Settings/ControlPanel/Users/Base.vue";
 import { ref } from "vue";
 
 // Props
-const authStore = storeAuth();
+const auth = storeAuth();
 const heartbeatStore = storeHeartbeat();
 const tab = ref("general");
 </script>
@@ -15,9 +15,14 @@ const tab = ref("general");
   <v-app-bar elevation="0" density="compact">
     <v-tabs v-model="tab" slider-color="romm-accent-1" class="bg-primary">
       <v-tab value="general" rounded="0">General</v-tab>
-      <v-tab value="config" rounded="0">Config</v-tab>
       <v-tab
-        v-if="authStore.scopes.includes('users.read')"
+        v-if="auth.scopes.includes('platforms.write')"
+        value="config"
+        rounded="0"
+        >Config</v-tab
+      >
+      <v-tab
+        v-if="auth.scopes.includes('users.write')"
         value="users"
         rounded="0"
       >
@@ -45,9 +50,23 @@ const tab = ref("general");
       <span class="text-romm-accent-1">RomM</span>
       <span class="ml-1">{{ heartbeatStore.value.VERSION }}</span>
       <v-icon>mdi-circle-small</v-icon><v-icon>mdi-github</v-icon>
-      <span class="ml-1"><a style="text-decoration: none; color: inherit" href="https://github.com/rommapp/romm" target="_blank">Github</a></span>
+      <span class="ml-1"
+        ><a
+          style="text-decoration: none; color: inherit"
+          href="https://github.com/rommapp/romm"
+          target="_blank"
+          >Github</a
+        ></span
+      >
       <v-icon>mdi-circle-small</v-icon>
-      <span class="ml-1"><a style="text-decoration: none; color: inherit" href="https://discord.com/invite/P5HtHnhUDH" target="_blank">Join to our Discord</a></span>
+      <span class="ml-1"
+        ><a
+          style="text-decoration: none; color: inherit"
+          href="https://discord.com/invite/P5HtHnhUDH"
+          target="_blank"
+          >Join to our Discord</a
+        ></span
+      >
     </v-row>
   </v-bottom-navigation>
 </template>
diff --git a/frontend/src/views/Settings/ControlPanel/General/Base.vue b/frontend/src/views/Settings/ControlPanel/General/Base.vue
index 83662e7a1..125e820c2 100644
--- a/frontend/src/views/Settings/ControlPanel/General/Base.vue
+++ b/frontend/src/views/Settings/ControlPanel/General/Base.vue
@@ -2,10 +2,14 @@
 import InterfaceOptions from "@/components/Settings/General/Interface/InterfaceOptions.vue";
 import TaskStatus from "@/components/Settings/General/TaskStatus/TaskStatusCard.vue";
 import Theme from "@/components/Settings/General/Theme/ThemeCard.vue";
+import storeAuth from "@/stores/auth";
+
+// Props
+const auth = storeAuth();
 </script>
 
 <template>
   <theme />
   <interface-options class="mt-1" />
-  <task-status class="mt-1" />
+  <task-status v-if="auth.scopes.includes('tasks.run')" class="mt-1" />
 </template>

From bea7754ad67ecf9db8e17e95af908e8de0f796be Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Sat, 6 Apr 2024 01:27:09 +0200
Subject: [PATCH 19/61] refactor edit artwork/avatar interface

---
 .../src/components/Dialog/Rom/EditRom.vue     | 78 ++++++++---------
 .../src/components/Dialog/User/EditUser.vue   | 83 +++++++++++++------
 .../src/components/Gallery/AppBar/Base.vue    |  2 -
 3 files changed, 98 insertions(+), 65 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index 410427a1a..e26e5b1fa 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -161,37 +161,33 @@ function closeDialog() {
             />
           </v-col>
           <v-col cols="12" md="4" lg="3">
-            <cover
-              :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
-              :rom="rom"
-              :editable="true"
-            >
-              <template v-slot:editable>
-                <v-chip-group class="position-absolute edit-cover pa-0">
-                  <v-chip
-                    class="translucent"
-                    size="small"
-                    @click="triggerFileInput"
-                    label
-                    ><v-icon>mdi-pencil</v-icon>
-                    <v-file-input
-                      id="file-input"
-                      v-model="rom.artwork"
-                      accept="image/*"
-                      hide-details
-                      class="file-input"
-                    />
-                  </v-chip>
-                  <v-chip
-                    class="translucent"
-                    size="small"
-                    @click="removeArtwork"
-                    label
-                    ><v-icon class="text-red">mdi-delete</v-icon></v-chip
-                  >
-                </v-chip-group>
-              </template>
-            </cover>
+            <v-hover v-slot="{ isHovering, props }">
+              <cover
+                :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
+                :rom="rom"
+                :editable="true"
+                v-bind="props"
+              >
+                <template v-slot:editable>
+                  <v-fade-transition>
+                    <div
+                      v-if="isHovering"
+                      class="d-flex translucent v-card--reveal text-h4"
+                      @click="triggerFileInput"
+                    >
+                      <v-icon>mdi-pencil</v-icon>
+                    </div>
+                  </v-fade-transition>
+                  <v-file-input
+                    id="file-input"
+                    class="file-input"
+                    v-model="rom.artwork"
+                    accept="image/*"
+                    hide-details
+                  />
+                </template>
+              </cover>
+            </v-hover>
           </v-col>
         </v-row>
         <v-row class="justify-center pa-2" no-gutters>
@@ -209,24 +205,30 @@ function closeDialog() {
 .edit-content {
   width: 900px;
 }
-
 .edit-content-tablet {
   width: 620px;
 }
-
 .edit-content-mobile {
   width: 85vw;
 }
-
 .edit-cover {
-  bottom: -0.1rem;
-  right: -0.1rem;
+  bottom: 0rem;
+  right: -0.2rem;
 }
 .file-input {
   display: none;
 }
 .translucent {
-  background: rgba(0, 0, 0, 0.35);
-  backdrop-filter: blur(10px);
+  background: rgba(0, 0, 0, 0.2);
+  backdrop-filter: blur(2px);
+}
+.v-card--reveal {
+  align-items: center;
+  bottom: 0;
+  justify-content: center;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
 }
 </style>
diff --git a/frontend/src/components/Dialog/User/EditUser.vue b/frontend/src/components/Dialog/User/EditUser.vue
index 6003af0ab..bd7fee2a7 100644
--- a/frontend/src/components/Dialog/User/EditUser.vue
+++ b/frontend/src/components/Dialog/User/EditUser.vue
@@ -18,6 +18,11 @@ emitter?.on("showEditUserDialog", (userToEdit) => {
 });
 
 // Functions
+function triggerFileInput() {
+  const fileInput = document.getElementById("file-input");
+  fileInput?.click();
+}
+
 function editUser() {
   if (!user.value) return;
 
@@ -74,8 +79,8 @@ function closeDialog() {
       <v-divider class="border-opacity-25" :thickness="1" />
 
       <v-card-text>
-        <v-row no-gutters>
-          <v-col cols="12" lg="9">
+        <v-row class="align-center" no-gutters>
+          <v-col cols="12" sm="8">
             <v-row class="pa-2" no-gutters>
               <v-col>
                 <v-text-field
@@ -116,30 +121,39 @@ function closeDialog() {
               </v-col>
             </v-row>
           </v-col>
-          <v-col cols="12" lg="3">
+          <v-col cols="12" sm="4">
             <v-row class="pa-2 justify-center" no-gutters>
-              <v-avatar size="128" class="">
-                <v-img
-                  :src="
-                    user.avatar_path
-                      ? `/assets/romm/assets/${user.avatar_path}`
-                      : defaultAvatarPath
-                  "
-                />
-              </v-avatar>
-            </v-row>
-            <v-row class="pa-2" no-gutters>
-              <v-col>
-                <v-file-input
-                  class="text-truncate"
-                  v-model="user.avatar"
-                  label="Avatar"
-                  prepend-inner-icon="mdi-image"
-                  prepend-icon=""
-                  variant="outlined"
-                  hide-details
-                />
-              </v-col>
+              <v-hover v-slot="{ isHovering, props }">
+                <v-avatar size="190" class="ml-4" v-bind="props">
+                  <v-img
+                    :src="
+                      user.avatar_path
+                        ? `/assets/romm/assets/${user.avatar_path}`
+                        : defaultAvatarPath
+                    "
+                  >
+                    <v-fade-transition>
+                      <div
+                        v-if="isHovering"
+                        class="d-flex translucent v-card--reveal text-h4"
+                        @click="triggerFileInput"
+                      >
+                        <v-icon>mdi-pencil</v-icon>
+                      </div>
+                    </v-fade-transition>
+                    <v-file-input
+                      id="file-input"
+                      class="file-input text-truncate"
+                      v-model="user.avatar"
+                      label="Avatar"
+                      prepend-inner-icon="mdi-image"
+                      prepend-icon=""
+                      variant="outlined"
+                      hide-details
+                    />
+                  </v-img>
+                </v-avatar>
+              </v-hover>
             </v-row>
           </v-col>
         </v-row>
@@ -153,3 +167,22 @@ function closeDialog() {
     </v-card>
   </v-dialog>
 </template>
+
+<style scoped>
+.file-input {
+  display: none;
+}
+.translucent {
+  background: rgba(0, 0, 0, 0.2);
+  backdrop-filter: blur(2px);
+}
+.v-card--reveal {
+  align-items: center;
+  bottom: 0;
+  justify-content: center;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+}
+</style>
diff --git a/frontend/src/components/Gallery/AppBar/Base.vue b/frontend/src/components/Gallery/AppBar/Base.vue
index 2581a5d8a..36b4ead2b 100644
--- a/frontend/src/components/Gallery/AppBar/Base.vue
+++ b/frontend/src/components/Gallery/AppBar/Base.vue
@@ -1,12 +1,10 @@
 <script setup lang="ts">
 import AdminMenu from "@/components/Gallery/AppBar/AdminMenu.vue";
 import FilterBar from "@/components/Gallery/AppBar/FilterBar.vue";
-import FilterUnmatchedBtn from "@/components/Gallery/AppBar/FilterUnmatchedBtn.vue";
 import FilterBtn from "@/components/Gallery/AppBar/FilterBtn.vue";
 import FilterTextField from "@/components/Gallery/AppBar/FilterTextField.vue";
 import GalleryViewBtn from "@/components/Gallery/AppBar/GalleryViewBtn.vue";
 import SortBar from "@/components/Gallery/AppBar/SortBar.vue";
-import SortBtn from "@/components/Gallery/AppBar/SortBtn.vue";
 import storeAuth from "@/stores/auth";
 
 // Props

From 0cbc0d24f24f9553b69f3a091ddf08fc6982dacb Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Sat, 6 Apr 2024 02:53:00 +0200
Subject: [PATCH 20/61] preview user avatar before update

---
 .../src/components/Dialog/Rom/EditRom.vue     | 90 ++++++++++---------
 .../src/components/Dialog/User/EditUser.vue   | 41 +++++++--
 2 files changed, 81 insertions(+), 50 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index e26e5b1fa..53b69a6c0 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -5,14 +5,14 @@ import storeRoms from "@/stores/roms";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
-import { useDisplay, useTheme } from "vuetify";
+import { useDisplay } from "vuetify";
 
 // Props
 const { xs, mdAndDown, smAndDown, md, lgAndUp } = useDisplay();
 const show = ref(false);
 const rom = ref<UpdateRom>();
 const romsStore = storeRoms();
-const theme = useTheme();
+const imagePreviewUrl = ref<string | undefined>("");
 const fileNameInputRules = {
   required: (value: string) => !!value || "Required",
   newFileName: (value: string) => !value.includes("/") || "Invalid characters",
@@ -29,6 +29,17 @@ function triggerFileInput() {
   fileInput?.click();
 }
 
+function previewImage(event: { target: { files: any[] } }) {
+  const file = event.target.files[0];
+  const reader = new FileReader();
+  reader.onload = () => {
+    imagePreviewUrl.value = reader.result?.toString();
+  };
+  if (file) {
+    reader.readAsDataURL(file);
+  }
+}
+
 function removeArtwork() {
   console.log(rom.value);
 }
@@ -161,33 +172,37 @@ function closeDialog() {
             />
           </v-col>
           <v-col cols="12" md="4" lg="3">
-            <v-hover v-slot="{ isHovering, props }">
-              <cover
-                :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
-                :rom="rom"
-                :editable="true"
-                v-bind="props"
-              >
-                <template v-slot:editable>
-                  <v-fade-transition>
-                    <div
-                      v-if="isHovering"
-                      class="d-flex translucent v-card--reveal text-h4"
-                      @click="triggerFileInput"
-                    >
-                      <v-icon>mdi-pencil</v-icon>
-                    </div>
-                  </v-fade-transition>
-                  <v-file-input
-                    id="file-input"
-                    class="file-input"
-                    v-model="rom.artwork"
-                    accept="image/*"
-                    hide-details
-                  />
-                </template>
-              </cover>
-            </v-hover>
+            <cover
+              :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
+              :rom="rom"
+            >
+              <template v-slot:editable>
+                <v-chip-group class="position-absolute edit-cover pa-0">
+                  <v-chip
+                    class="translucent"
+                    size="small"
+                    @click="triggerFileInput"
+                    label
+                    ><v-icon>mdi-pencil</v-icon>
+                    <v-file-input
+                      id="file-input"
+                      v-model="rom.artwork"
+                      accept="image/*"
+                      hide-details
+                      class="file-input"
+                      @change="previewImage"
+                    />
+                  </v-chip>
+                  <v-chip
+                    class="translucent"
+                    size="small"
+                    @click="removeArtwork"
+                    label
+                    ><v-icon class="text-red">mdi-delete</v-icon></v-chip
+                  >
+                </v-chip-group>
+              </template>
+            </cover>
           </v-col>
         </v-row>
         <v-row class="justify-center pa-2" no-gutters>
@@ -212,23 +227,14 @@ function closeDialog() {
   width: 85vw;
 }
 .edit-cover {
-  bottom: 0rem;
-  right: -0.2rem;
+  bottom: -0.1rem;
+  right: -0.3rem;
 }
 .file-input {
   display: none;
 }
 .translucent {
-  background: rgba(0, 0, 0, 0.2);
-  backdrop-filter: blur(2px);
-}
-.v-card--reveal {
-  align-items: center;
-  bottom: 0;
-  justify-content: center;
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  cursor: pointer;
+  background: rgba(0, 0, 0, 0.35);
+  backdrop-filter: blur(10px);
 }
 </style>
diff --git a/frontend/src/components/Dialog/User/EditUser.vue b/frontend/src/components/Dialog/User/EditUser.vue
index bd7fee2a7..d18dc2e22 100644
--- a/frontend/src/components/Dialog/User/EditUser.vue
+++ b/frontend/src/components/Dialog/User/EditUser.vue
@@ -1,16 +1,16 @@
 <script setup lang="ts">
-import { ref, inject } from "vue";
-import type { Emitter } from "mitt";
-import type { Events, UserItem } from "@/types/emitter";
-
 import userApi from "@/services/api/user";
-import { defaultAvatarPath } from "@/utils";
 import storeUsers from "@/stores/users";
+import type { Events, UserItem } from "@/types/emitter";
+import { defaultAvatarPath } from "@/utils";
+import type { Emitter } from "mitt";
+import { inject, ref } from "vue";
 
+// Props
 const user = ref<UserItem | null>(null);
 const show = ref(false);
 const usersStore = storeUsers();
-
+const imagePreviewUrl = ref<string | undefined>("");
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showEditUserDialog", (userToEdit) => {
   user.value = { ...userToEdit, avatar: undefined };
@@ -23,6 +23,17 @@ function triggerFileInput() {
   fileInput?.click();
 }
 
+function previewImage(event: { target: { files: any[] } }) {
+  const file = event.target.files[0];
+  const reader = new FileReader();
+  reader.onload = () => {
+    imagePreviewUrl.value = reader.result?.toString();
+  };
+  if (file) {
+    reader.readAsDataURL(file);
+  }
+}
+
 function editUser() {
   if (!user.value) return;
 
@@ -54,10 +65,21 @@ function editUser() {
 
 function closeDialog() {
   show.value = false;
+  imagePreviewUrl.value = "";
 }
 </script>
 <template>
-  <v-dialog v-if="user" v-model="show" max-width="700px" :scrim="false">
+  <v-dialog
+    v-if="user"
+    v-model="show"
+    max-width="700px"
+    :scrim="true"
+    @click:outside="closeDialog"
+    @keydown.esc="closeDialog"
+    scroll-strategy="none"
+    no-click-animation
+    persistent
+  >
     <v-card>
       <v-toolbar density="compact" class="bg-terciary">
         <v-row class="align-center" no-gutters>
@@ -127,7 +149,9 @@ function closeDialog() {
                 <v-avatar size="190" class="ml-4" v-bind="props">
                   <v-img
                     :src="
-                      user.avatar_path
+                      imagePreviewUrl
+                        ? imagePreviewUrl
+                        : user.avatar_path
                         ? `/assets/romm/assets/${user.avatar_path}`
                         : defaultAvatarPath
                     "
@@ -150,6 +174,7 @@ function closeDialog() {
                       prepend-icon=""
                       variant="outlined"
                       hide-details
+                      @change="previewImage"
                     />
                   </v-img>
                 </v-avatar>

From 053c27dd808d0a11ee4e9cddf2e16f5c50add086 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Sat, 6 Apr 2024 18:44:10 +0200
Subject: [PATCH 21/61] preview game custom artwork before update

---
 frontend/src/components/Details/Cover.vue     | 27 ++++------------
 .../src/components/Dialog/Rom/EditRom.vue     | 24 ++++++++++++--
 frontend/src/views/Details/Base.vue           | 32 ++++++++++++++-----
 3 files changed, 52 insertions(+), 31 deletions(-)

diff --git a/frontend/src/components/Details/Cover.vue b/frontend/src/components/Details/Cover.vue
index 86548c9b4..c8c752e01 100644
--- a/frontend/src/components/Details/Cover.vue
+++ b/frontend/src/components/Details/Cover.vue
@@ -1,34 +1,19 @@
 <script setup lang="ts">
 import storeDownload from "@/stores/download";
-import type { Rom } from "@/stores/roms";
-import { useTheme } from "vuetify";
-const theme = useTheme();
 
-defineProps<{ rom: Rom }>();
+defineProps<{ romId: number; src: string; lazySrc: string }>();
 const downloadStore = storeDownload();
 </script>
 <template>
   <v-card
     elevation="2"
-    :loading="downloadStore.value.includes(rom.id) ? 'romm-accent-1' : false"
+    :loading="downloadStore.value.includes(romId) ? 'romm-accent-1' : false"
   >
     <v-img
-      :value="rom.id"
-      :key="rom.id"
-      :src="
-        !rom.igdb_id && !rom.has_cover
-          ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
-          : !rom.has_cover
-          ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
-          : `/assets/romm/resources/${rom.path_cover_l}`
-      "
-      :lazy-src="
-        !rom.igdb_id && !rom.has_cover
-          ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
-          : !rom.has_cover
-          ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
-          : `/assets/romm/resources/${rom.path_cover_s}`
-      "
+      :value="romId"
+      :key="romId"
+      :src="src"
+      :lazy-src="lazySrc"
       :aspect-ratio="3 / 4"
     >
       <slot name="editable"></slot>
diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index 53b69a6c0..4f5ffaf6c 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -5,9 +5,10 @@ import storeRoms from "@/stores/roms";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
-import { useDisplay } from "vuetify";
+import { useDisplay, useTheme } from "vuetify";
 
 // Props
+const theme = useTheme();
 const { xs, mdAndDown, smAndDown, md, lgAndUp } = useDisplay();
 const show = ref(false);
 const rom = ref<UpdateRom>();
@@ -91,6 +92,7 @@ async function updateRom() {
 
 function closeDialog() {
   show.value = false;
+  imagePreviewUrl.value = "";
 }
 </script>
 
@@ -174,7 +176,25 @@ function closeDialog() {
           <v-col cols="12" md="4" lg="3">
             <cover
               :class="{ 'mx-16': smAndDown, 'ml-2': md, 'my-4': smAndDown }"
-              :rom="rom"
+              :romId="rom.id"
+              :src="
+                imagePreviewUrl
+                  ? imagePreviewUrl
+                  : !rom.igdb_id && !rom.has_cover
+                  ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
+                  : !rom.has_cover
+                  ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
+                  : `/assets/romm/resources/${rom.path_cover_l}`
+              "
+              :lazy-src="
+                imagePreviewUrl
+                  ? imagePreviewUrl
+                  : !rom.igdb_id && !rom.has_cover
+                  ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
+                  : !rom.has_cover
+                  ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
+                  : `/assets/romm/resources/${rom.path_cover_s}`
+              "
             >
               <template v-slot:editable>
                 <v-chip-group class="position-absolute edit-cover pa-0">
diff --git a/frontend/src/views/Details/Base.vue b/frontend/src/views/Details/Base.vue
index 190b79a05..dd9e72964 100644
--- a/frontend/src/views/Details/Base.vue
+++ b/frontend/src/views/Details/Base.vue
@@ -1,11 +1,4 @@
 <script setup lang="ts">
-import storeDownload from "@/stores/download";
-import type { Events } from "@/types/emitter";
-import type { Emitter } from "mitt";
-import { inject, onBeforeMount, ref, watch } from "vue";
-import { useRoute } from "vue-router";
-import { useDisplay } from "vuetify";
-
 import type { PlatformSchema } from "@/__generated__";
 import ActionBar from "@/components/Details/ActionBar.vue";
 import AdditionalContent from "@/components/Details/AdditionalContent.vue";
@@ -24,7 +17,13 @@ import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
 import SearchRomDialog from "@/components/Dialog/Rom/SearchRom.vue";
 import platformApi from "@/services/api/platform";
 import romApi from "@/services/api/rom";
+import storeDownload from "@/stores/download";
 import type { Rom } from "@/stores/roms";
+import type { Events } from "@/types/emitter";
+import type { Emitter } from "mitt";
+import { inject, onBeforeMount, ref, watch } from "vue";
+import { useRoute } from "vue-router";
+import { useDisplay, useTheme } from "vuetify";
 
 const route = useRoute();
 const rom = ref<Rom>();
@@ -38,6 +37,7 @@ const tab = ref<
   | "relatedgames"
   | "emulation"
 >("details");
+const theme = useTheme();
 const { smAndDown, mdAndDown, mdAndUp, lgAndUp } = useDisplay();
 const emitter = inject<Emitter<Events>>("emitter");
 const showEmulation = ref(false);
@@ -122,7 +122,23 @@ watch(
           'cover-xs': smAndDown,
         }"
       >
-        <cover :rom="rom" :editable="false" />
+        <cover
+          :romId="rom.id"
+          :src="
+            !rom.igdb_id && !rom.has_cover
+              ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
+              : !rom.has_cover
+              ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
+              : `/assets/romm/resources/${rom.path_cover_l}`
+          "
+          :lazy-src="
+            !rom.igdb_id && !rom.has_cover
+              ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
+              : !rom.has_cover
+              ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
+              : `/assets/romm/resources/${rom.path_cover_s}`
+          "
+        />
         <action-bar class="mt-2" :rom="rom" />
         <related-games class="mt-3 px-2" v-if="mdAndUp" :rom="rom" />
       </v-col>

From c3e1f4f44cd0e32e0a04df184e44798b0dbd5ea7 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Sat, 6 Apr 2024 15:29:40 -0400
Subject: [PATCH 22/61] [ROMM-618] Add last logged in and last active for users

---
 .../versions/0016_user_last_login_active.py   | 39 +++++++++++++++++++
 backend/endpoints/auth.py                     |  9 ++++-
 backend/endpoints/responses/identity.py       |  3 ++
 backend/handler/auth_handler/hybrid_auth.py   |  5 +++
 backend/models/assets.py                      |  6 ++-
 backend/models/user.py                        | 14 +++++--
 frontend/src/__generated__/index.ts           |  1 +
 .../__generated__/models/TinfoilFeedSchema.ts | 11 ++++++
 .../src/__generated__/models/UserSchema.ts    |  2 +
 frontend/src/utils/index.ts                   | 14 +++++++
 .../Settings/ControlPanel/Users/Base.vue      | 11 +++++-
 11 files changed, 107 insertions(+), 8 deletions(-)
 create mode 100644 backend/alembic/versions/0016_user_last_login_active.py
 create mode 100644 frontend/src/__generated__/models/TinfoilFeedSchema.ts

diff --git a/backend/alembic/versions/0016_user_last_login_active.py b/backend/alembic/versions/0016_user_last_login_active.py
new file mode 100644
index 000000000..24ba3d9d3
--- /dev/null
+++ b/backend/alembic/versions/0016_user_last_login_active.py
@@ -0,0 +1,39 @@
+"""empty message
+
+Revision ID: 0016_user_last_login_active
+Revises: 0015_mobygames_data
+Create Date: 2024-04-06 15:16:50.539968
+
+"""
+
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = "0016_user_last_login_active"
+down_revision = "0015_mobygames_data"
+branch_labels = None
+depends_on = None
+
+
+def upgrade() -> None:
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table("users", schema=None) as batch_op:
+        batch_op.add_column(
+            sa.Column("last_login", sa.DateTime(timezone=True), nullable=True)
+        )
+        batch_op.add_column(
+            sa.Column("last_active", sa.DateTime(timezone=True), nullable=True)
+        )
+
+    # ### end Alembic commands ###
+
+
+def downgrade() -> None:
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table("users", schema=None) as batch_op:
+        batch_op.drop_column("last_active")
+        batch_op.drop_column("last_login")
+
+    # ### end Alembic commands ###
diff --git a/backend/endpoints/auth.py b/backend/endpoints/auth.py
index ed6448569..ac4bd8768 100644
--- a/backend/endpoints/auth.py
+++ b/backend/endpoints/auth.py
@@ -1,4 +1,4 @@
-from datetime import timedelta
+from datetime import timedelta, datetime
 from typing import Annotated, Final
 
 from endpoints.forms.identity import OAuth2RequestForm
@@ -7,7 +7,7 @@
 from exceptions.auth_exceptions import AuthCredentialsException, DisabledException
 from fastapi import APIRouter, Depends, HTTPException, Request, status
 from fastapi.security.http import HTTPBasic
-from handler import auth_handler, oauth_handler
+from handler import auth_handler, oauth_handler, db_user_handler
 
 ACCESS_TOKEN_EXPIRE_MINUTES: Final = 30
 REFRESH_TOKEN_EXPIRE_DAYS: Final = 7
@@ -156,6 +156,11 @@ def login(request: Request, credentials=Depends(HTTPBasic())) -> MessageResponse
 
     request.session.update({"iss": "romm:auth", "sub": user.username})
 
+    # Update last login and active times
+    db_user_handler.update_user(
+        user.id, {"last_login": datetime.now(), "last_active": datetime.now()}
+    )
+
     return {"msg": "Successfully logged in"}
 
 
diff --git a/backend/endpoints/responses/identity.py b/backend/endpoints/responses/identity.py
index 09b4d48b7..7efe0ef4d 100644
--- a/backend/endpoints/responses/identity.py
+++ b/backend/endpoints/responses/identity.py
@@ -1,3 +1,4 @@
+from datetime import datetime
 from models.user import Role
 from pydantic import BaseModel
 
@@ -9,6 +10,8 @@ class UserSchema(BaseModel):
     role: Role
     oauth_scopes: list[str]
     avatar_path: str
+    last_login: datetime | None
+    last_active: datetime | None
 
     class Config:
         from_attributes = True
diff --git a/backend/handler/auth_handler/hybrid_auth.py b/backend/handler/auth_handler/hybrid_auth.py
index 4783a74c6..4c54a2ef9 100644
--- a/backend/handler/auth_handler/hybrid_auth.py
+++ b/backend/handler/auth_handler/hybrid_auth.py
@@ -10,6 +10,7 @@ async def authenticate(self, conn: HTTPConnection):
         # Check if session key already stored in cache
         user = await auth_handler.get_current_active_user_from_session(conn)
         if user:
+            user.set_last_active()
             return (AuthCredentials(user.oauth_scopes), user)
 
         # Check if Authorization header exists
@@ -28,11 +29,14 @@ async def authenticate(self, conn: HTTPConnection):
             if user is None:
                 return (AuthCredentials([]), None)
 
+            user.set_last_active()
             return (AuthCredentials(user.oauth_scopes), user)
 
         # Check if bearer auth header is valid
         if scheme.lower() == "bearer":
             user, payload = await oauth_handler.get_current_active_user_from_bearer_token(token)
+            if user is None:
+                return (AuthCredentials([]), None)
 
             # Only access tokens can request resources
             if payload.get("type") != "access":
@@ -42,6 +46,7 @@ async def authenticate(self, conn: HTTPConnection):
             token_scopes = set(list(payload.get("scopes").split(" ")))
             overlapping_scopes = list(token_scopes & set(user.oauth_scopes))
 
+            user.set_last_active()
             return (AuthCredentials(overlapping_scopes), user)
 
         return (AuthCredentials([]), None)
diff --git a/backend/models/assets.py b/backend/models/assets.py
index 677c9fd84..24e47215d 100644
--- a/backend/models/assets.py
+++ b/backend/models/assets.py
@@ -9,9 +9,11 @@ class BaseAsset(BaseModel):
     __abstract__ = True
 
     id = Column(Integer(), primary_key=True, autoincrement=True)
-    created_at = Column(DateTime, server_default=func.now(), nullable=False)
+    created_at = Column(
+        DateTime(timezone=True), server_default=func.now(), nullable=False
+    )
     updated_at = Column(
-        DateTime,
+        DateTime(timezone=True),
         server_default=func.now(),
         onupdate=func.now(),
         nullable=False,
diff --git a/backend/models/user.py b/backend/models/user.py
index f05d5a2cd..74a4354d3 100644
--- a/backend/models/user.py
+++ b/backend/models/user.py
@@ -1,8 +1,9 @@
 import enum
+import datetime
 
 from models.base import BaseModel
 from models.assets import Save, Screenshot, State
-from sqlalchemy import Boolean, Column, Enum, Integer, String
+from sqlalchemy import Boolean, Column, Enum, Integer, String, DateTime
 from starlette.authentication import SimpleUser
 from sqlalchemy.orm import Mapped, relationship
 
@@ -24,6 +25,8 @@ class User(BaseModel, SimpleUser):
     enabled: bool = Column(Boolean(), default=True)
     role: Role = Column(Enum(Role), default=Role.VIEWER)
     avatar_path: str = Column(String(length=255), default="")
+    last_login: datetime = Column(DateTime(timezone=True), nullable=True)
+    last_active: datetime = Column(DateTime(timezone=True), nullable=True)
 
     saves: Mapped[list[Save]] = relationship(
         "Save",
@@ -48,8 +51,13 @@ def oauth_scopes(self):
             return WRITE_SCOPES
 
         return DEFAULT_SCOPES
-    
+
     @property
     def fs_safe_folder_name(self):
         # Uses the ID to avoid issues with username changes
-        return f'User:{self.id}'.encode("utf-8").hex()
+        return f"User:{self.id}".encode("utf-8").hex()
+
+    def set_last_active(self):
+        from handler import db_user_handler
+
+        db_user_handler.update_user(self.id, {"last_active": datetime.datetime.now()})
diff --git a/frontend/src/__generated__/index.ts b/frontend/src/__generated__/index.ts
index b03863248..dae98fd15 100644
--- a/frontend/src/__generated__/index.ts
+++ b/frontend/src/__generated__/index.ts
@@ -32,6 +32,7 @@ export type { SearchRomSchema } from './models/SearchRomSchema';
 export type { StateSchema } from './models/StateSchema';
 export type { StatsReturn } from './models/StatsReturn';
 export type { TaskDict } from './models/TaskDict';
+export type { TinfoilFeedSchema } from './models/TinfoilFeedSchema';
 export type { TokenResponse } from './models/TokenResponse';
 export type { UploadedSavesResponse } from './models/UploadedSavesResponse';
 export type { UploadedScreenshotsResponse } from './models/UploadedScreenshotsResponse';
diff --git a/frontend/src/__generated__/models/TinfoilFeedSchema.ts b/frontend/src/__generated__/models/TinfoilFeedSchema.ts
new file mode 100644
index 000000000..905a6cc0f
--- /dev/null
+++ b/frontend/src/__generated__/models/TinfoilFeedSchema.ts
@@ -0,0 +1,11 @@
+/* generated using openapi-typescript-codegen -- do no edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+export type TinfoilFeedSchema = {
+    files: Array<Record<string, any>>;
+    directories: Array<string>;
+    success: string;
+};
+
diff --git a/frontend/src/__generated__/models/UserSchema.ts b/frontend/src/__generated__/models/UserSchema.ts
index 27c6c7eaf..8542f19f5 100644
--- a/frontend/src/__generated__/models/UserSchema.ts
+++ b/frontend/src/__generated__/models/UserSchema.ts
@@ -12,5 +12,7 @@ export type UserSchema = {
     role: Role;
     oauth_scopes: Array<string>;
     avatar_path: string;
+    last_login: (string | null);
+    last_active: (string | null);
 };
 
diff --git a/frontend/src/utils/index.ts b/frontend/src/utils/index.ts
index 1bd5e20db..994efee85 100644
--- a/frontend/src/utils/index.ts
+++ b/frontend/src/utils/index.ts
@@ -87,6 +87,20 @@ export function formatBytes(bytes: number, decimals = 2) {
   return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
 }
 
+/**
+ *
+ * Format timestamp to human-readable text
+ *
+ * @param string timestamp
+ * @returns string Formatted timestamp
+ */
+export function formatTimestamp(timestamp: string | null) {
+  if (!timestamp) return "-";
+
+  const date = new Date(timestamp);
+  return date.toLocaleString();
+}
+
 export function regionToEmoji(region: string) {
   switch (region.toLowerCase()) {
     case "as":
diff --git a/frontend/src/views/Settings/ControlPanel/Users/Base.vue b/frontend/src/views/Settings/ControlPanel/Users/Base.vue
index c3e8fa43c..31e57e05a 100644
--- a/frontend/src/views/Settings/ControlPanel/Users/Base.vue
+++ b/frontend/src/views/Settings/ControlPanel/Users/Base.vue
@@ -11,7 +11,7 @@ import userApi from "@/services/api/user";
 import storeAuth from "@/stores/auth";
 import storeUsers from "@/stores/users";
 import type { UserItem } from "@/types/emitter";
-import { defaultAvatarPath } from "@/utils";
+import { defaultAvatarPath, formatTimestamp } from "@/utils";
 
 const HEADERS = [
   {
@@ -33,6 +33,12 @@ const HEADERS = [
     sortable: true,
     key: "role",
   },
+  {
+    title: "Last active",
+    align: "start",
+    sortable: true,
+    key: "last_active",
+  },
   {
     title: "Enabled",
     align: "start",
@@ -129,6 +135,9 @@ onMounted(() => {
             />
           </v-avatar>
         </template>
+        <template v-slot:item.last_active="{ item }">
+          {{ formatTimestamp(item.raw.last_active) }}
+        </template>
         <template v-slot:item.enabled="{ item }">
           <v-switch
             color="romm-accent-1"

From 27be753a692ab4f2add36c063927f28fbf5a68ea Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Sun, 7 Apr 2024 00:55:20 +0200
Subject: [PATCH 23/61] remove artwork added

---
 frontend/src/components/Dialog/Rom/EditRom.vue | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index 4f5ffaf6c..97ca146a4 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -41,8 +41,17 @@ function previewImage(event: { target: { files: any[] } }) {
   }
 }
 
-function removeArtwork() {
-  console.log(rom.value);
+async function removeArtwork() {
+  imagePreviewUrl.value = `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`;
+  try {
+    if(!rom.value) return;
+    const response = await fetch(imagePreviewUrl.value);
+    const blob = await response.blob();
+    rom.value.artwork = new Array<File>(new File([blob], "default.png", { type: blob.type }));
+  } catch (error) {
+    console.error('Error getting "missing cover" artwork.', error);
+    return null;
+  }
 }
 
 async function updateRom() {

From 7669c1a28fb1f84d4b77e9bc1cad87e07240d72e Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Sun, 7 Apr 2024 20:19:00 +0200
Subject: [PATCH 24/61] fixed remove cover

---
 backend/endpoints/rom.py                      |  7 ++++
 .../fs_handler/fs_resources_handler.py        | 41 +++++++++++++------
 .../src/components/Dialog/Rom/EditRom.vue     | 14 ++-----
 frontend/src/services/api/rom.ts              |  4 +-
 4 files changed, 42 insertions(+), 24 deletions(-)

diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index b792dffe4..545796c85 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -250,6 +250,7 @@ async def update_rom(
     request: Request,
     id: int,
     rename_as_igdb: bool = False,
+    remove_cover: bool = False,
     artwork: Optional[UploadFile] = File(None),
 ) -> RomSchema:
     """Update rom endpoint
@@ -317,6 +318,12 @@ async def update_rom(
     cleaned_data["file_name_no_ext"] = fs_rom_handler.get_file_name_with_no_extension(
         fs_safe_file_name
     )
+
+    if remove_cover:
+        fs_resource_handler.remove_cover(
+            rom_name=cleaned_data["name"], platform_fs_slug=platform_fs_slug
+        )
+
     cleaned_data.update(
         fs_resource_handler.get_rom_cover(
             overwrite=True,
diff --git a/backend/handler/fs_handler/fs_resources_handler.py b/backend/handler/fs_handler/fs_resources_handler.py
index 37954603c..0d6d5dec6 100644
--- a/backend/handler/fs_handler/fs_resources_handler.py
+++ b/backend/handler/fs_handler/fs_resources_handler.py
@@ -23,7 +23,8 @@ class FSResourceHandler(FSHandler):
     def __init__(self) -> None:
         pass
 
-    def _cover_exists(self, fs_slug: str, rom_name: str, size: CoverSize):
+    @staticmethod
+    def _cover_exists(fs_slug: str, rom_name: str, size: CoverSize):
         """Check if rom cover exists in filesystem
 
         Args:
@@ -39,7 +40,8 @@ def _cover_exists(self, fs_slug: str, rom_name: str, size: CoverSize):
             )
         )
 
-    def resize_cover(self, cover_path: str, size: CoverSize = CoverSize.BIG) -> None:
+    @staticmethod
+    def resize_cover(cover_path: str, size: CoverSize = CoverSize.BIG) -> None:
         """Resizes the cover image to the standard size
 
         Args:
@@ -86,7 +88,7 @@ def _store_cover(
         """
         cover_file = f"{size.value}.png"
         cover_path = f"{RESOURCES_BASE_PATH}/{fs_slug}/{rom_name}/cover"
-        
+
         try:
             res = requests.get(
                 url_cover.replace("t_thumb", f"t_cover_{size.value}"),
@@ -99,14 +101,15 @@ def _store_cover(
                 status_code=status.HTTP_503_SERVICE_UNAVAILABLE,
                 detail="Can't connect to IGDB, check your internet connection.",
             )
-        
+
         if res.status_code == 200:
             Path(cover_path).mkdir(parents=True, exist_ok=True)
             with open(f"{cover_path}/{cover_file}", "wb") as f:
                 shutil.copyfileobj(res.raw, f)
             self.resize_cover(f"{cover_path}/{cover_file}", size)
 
-    def _get_cover_path(self, fs_slug: str, rom_name: str, size: CoverSize):
+    @staticmethod
+    def _get_cover_path(fs_slug: str, rom_name: str, size: CoverSize):
         """Returns rom cover filesystem path adapted to frontend folder structure
 
         Args:
@@ -147,18 +150,29 @@ def get_rom_cover(
             "path_cover_l": path_cover_l,
         }
 
-    def build_artwork_path(self, rom_name: str, fs_slug: str, file_ext: str):
+    @staticmethod
+    def remove_cover(
+        rom_name: str,
+        platform_fs_slug: str,
+    ):
+        shutil.rmtree(os.path.join(RESOURCES_BASE_PATH, platform_fs_slug, rom_name))
+
+    @staticmethod
+    def build_artwork_path(rom_name: str, platform_fs_slug: str, file_ext: str):
         q_rom_name = quote(rom_name)
 
-        path_cover_l = f"{fs_slug}/{q_rom_name}/cover/{CoverSize.BIG.value}.{file_ext}"
+        path_cover_l = (
+            f"{platform_fs_slug}/{q_rom_name}/cover/{CoverSize.BIG.value}.{file_ext}"
+        )
         path_cover_s = (
-            f"{fs_slug}/{q_rom_name}/cover/{CoverSize.SMALL.value}.{file_ext}"
+            f"{platform_fs_slug}/{q_rom_name}/cover/{CoverSize.SMALL.value}.{file_ext}"
         )
-        artwork_path = f"{RESOURCES_BASE_PATH}/{fs_slug}/{rom_name}/cover"
+        artwork_path = f"{RESOURCES_BASE_PATH}/{platform_fs_slug}/{rom_name}/cover"
         Path(artwork_path).mkdir(parents=True, exist_ok=True)
         return path_cover_l, path_cover_s, artwork_path
 
-    def _store_screenshot(self, fs_slug: str, rom_name: str, url: str, idx: int):
+    @staticmethod
+    def _store_screenshot(fs_slug: str, rom_name: str, url: str, idx: int):
         """Store roms resources in filesystem
 
         Args:
@@ -168,7 +182,7 @@ def _store_screenshot(self, fs_slug: str, rom_name: str, url: str, idx: int):
         """
         screenshot_file = f"{idx}.jpg"
         screenshot_path = f"{RESOURCES_BASE_PATH}/{fs_slug}/{rom_name}/screenshots"
-        
+
         try:
             res = requests.get(url, stream=True, timeout=120)
         except requests.exceptions.ConnectionError:
@@ -177,7 +191,7 @@ def _store_screenshot(self, fs_slug: str, rom_name: str, url: str, idx: int):
                 status_code=status.HTTP_503_SERVICE_UNAVAILABLE,
                 detail="Can't connect to IGDB, check your internet connection.",
             )
-        
+
         if res.status_code == 200:
             Path(screenshot_path).mkdir(parents=True, exist_ok=True)
             with open(f"{screenshot_path}/{screenshot_file}", "wb") as f:
@@ -188,7 +202,8 @@ def _store_screenshot(self, fs_slug: str, rom_name: str, url: str, idx: int):
                         f"Failure writing screenshot {url} to file (ProtocolError)"
                     )
 
-    def _get_screenshot_path(self, fs_slug: str, rom_name: str, idx: str):
+    @staticmethod
+    def _get_screenshot_path(fs_slug: str, rom_name: str, idx: str):
         """Returns rom cover filesystem path adapted to frontend folder structure
 
         Args:
diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index 97ca146a4..c7aa6556d 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -14,6 +14,7 @@ const show = ref(false);
 const rom = ref<UpdateRom>();
 const romsStore = storeRoms();
 const imagePreviewUrl = ref<string | undefined>("");
+const removeCover = ref(false);
 const fileNameInputRules = {
   required: (value: string) => !!value || "Required",
   newFileName: (value: string) => !value.includes("/") || "Invalid characters",
@@ -43,15 +44,7 @@ function previewImage(event: { target: { files: any[] } }) {
 
 async function removeArtwork() {
   imagePreviewUrl.value = `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`;
-  try {
-    if(!rom.value) return;
-    const response = await fetch(imagePreviewUrl.value);
-    const blob = await response.blob();
-    rom.value.artwork = new Array<File>(new File([blob], "default.png", { type: blob.type }));
-  } catch (error) {
-    console.error('Error getting "missing cover" artwork.', error);
-    return null;
-  }
+  removeCover.value = true;
 }
 
 async function updateRom() {
@@ -75,8 +68,9 @@ async function updateRom() {
 
   show.value = false;
   emitter?.emit("showLoadingDialog", { loading: true, scrim: true });
+
   await romApi
-    .updateRom({ rom: rom.value })
+    .updateRom({ rom: rom.value, removeCover: removeCover.value })
     .then(({ data }) => {
       emitter?.emit("snackbarShow", {
         msg: "Rom updated successfully!",
diff --git a/frontend/src/services/api/rom.ts b/frontend/src/services/api/rom.ts
index 8c8f743a8..09f55f79b 100644
--- a/frontend/src/services/api/rom.ts
+++ b/frontend/src/services/api/rom.ts
@@ -144,9 +144,11 @@ export type UpdateRom = Rom & {
 async function updateRom({
   rom,
   renameAsIGDB = false,
+  removeCover = false
 }: {
   rom: UpdateRom;
   renameAsIGDB?: boolean;
+  removeCover?: boolean;
 }): Promise<{ data: RomSchema }> {
   var formData = new FormData();
   if (rom.igdb_id) formData.append("igdb_id", rom.igdb_id.toString());
@@ -157,7 +159,7 @@ async function updateRom({
   if (rom.artwork) formData.append("artwork", rom.artwork[0]);
 
   return api.put(`/roms/${rom.id}`, formData, {
-    params: { rename_as_igdb: renameAsIGDB },
+    params: { rename_as_igdb: renameAsIGDB, remove_cover: removeCover },
   });
 }
 

From a5ec0007ea946181add9c305812e13e9c1e8af31 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Sun, 7 Apr 2024 20:53:26 +0200
Subject: [PATCH 25/61] metric system disoplay for last login date

---
 frontend/src/utils/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/utils/index.ts b/frontend/src/utils/index.ts
index 994efee85..031c8b7d5 100644
--- a/frontend/src/utils/index.ts
+++ b/frontend/src/utils/index.ts
@@ -98,7 +98,7 @@ export function formatTimestamp(timestamp: string | null) {
   if (!timestamp) return "-";
 
   const date = new Date(timestamp);
-  return date.toLocaleString();
+  return date.toLocaleString("en-GB");
 }
 
 export function regionToEmoji(region: string) {

From 5d409bdce7769850ba29c14fdd30ab172adc8aee Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 01:00:37 +0200
Subject: [PATCH 26/61] added multi-select layer button

---
 frontend/src/components/Details/ActionBar.vue |   1 +
 .../src/components/Gallery/AppBar/Base.vue    |   3 +-
 .../Gallery/AppBar/SelectingBtn.vue           |  31 ++++
 .../src/components/Gallery/FabMenu/Base.vue   | 142 ++++++++++++------
 frontend/src/components/Game/Card/Cover.vue   |  25 +--
 frontend/src/stores/roms.ts                   |  14 +-
 6 files changed, 146 insertions(+), 70 deletions(-)
 create mode 100644 frontend/src/components/Gallery/AppBar/SelectingBtn.vue

diff --git a/frontend/src/components/Details/ActionBar.vue b/frontend/src/components/Details/ActionBar.vue
index cc33f9dcd..d0624adf9 100644
--- a/frontend/src/components/Details/ActionBar.vue
+++ b/frontend/src/components/Details/ActionBar.vue
@@ -80,6 +80,7 @@ function toggleEmulation() {
     </v-col>
   </v-row>
 </template>
+
 <style scoped>
 .tooltip :deep(.v-overlay__content) {
   background: rgba(201, 201, 201, 0.98) !important;
diff --git a/frontend/src/components/Gallery/AppBar/Base.vue b/frontend/src/components/Gallery/AppBar/Base.vue
index 2581a5d8a..11a307e37 100644
--- a/frontend/src/components/Gallery/AppBar/Base.vue
+++ b/frontend/src/components/Gallery/AppBar/Base.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import AdminMenu from "@/components/Gallery/AppBar/AdminMenu.vue";
 import FilterBar from "@/components/Gallery/AppBar/FilterBar.vue";
-import FilterUnmatchedBtn from "@/components/Gallery/AppBar/FilterUnmatchedBtn.vue";
 import FilterBtn from "@/components/Gallery/AppBar/FilterBtn.vue";
 import FilterTextField from "@/components/Gallery/AppBar/FilterTextField.vue";
+import SelectingBtn from "@/components/Gallery/AppBar/SelectingBtn.vue";
 import GalleryViewBtn from "@/components/Gallery/AppBar/GalleryViewBtn.vue";
 import SortBar from "@/components/Gallery/AppBar/SortBar.vue";
 import SortBtn from "@/components/Gallery/AppBar/SortBtn.vue";
@@ -18,6 +18,7 @@ const auth = storeAuth();
     <!-- <sort-btn /> -->
     <filter-btn />
     <filter-text-field />
+    <selecting-btn />
     <gallery-view-btn />
     <template v-if="auth.scopes.includes('roms.write')">
       <v-menu location="bottom">
diff --git a/frontend/src/components/Gallery/AppBar/SelectingBtn.vue b/frontend/src/components/Gallery/AppBar/SelectingBtn.vue
new file mode 100644
index 000000000..04e224ba3
--- /dev/null
+++ b/frontend/src/components/Gallery/AppBar/SelectingBtn.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import storeRoms from "@/stores/roms";
+
+// Props
+const romsStore = storeRoms();
+</script>
+
+<template>
+  <v-tooltip
+    location="bottom"
+    class="tooltip"
+    transition="fade-transition"
+    text="Active multi-select"
+    open-delay="1000"
+    ><template v-slot:activator="{ props }">
+      <v-btn
+        @click="romsStore.isSelecting()"
+        :color="romsStore.selecting ? 'romm-accent-1' : ''"
+        rounded="0"
+        variant="text"
+        v-bind="props"
+        class="mr-0"
+        icon="mdi-select-group" /></template
+  ></v-tooltip>
+</template>
+<style scoped>
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
+</style>
diff --git a/frontend/src/components/Gallery/FabMenu/Base.vue b/frontend/src/components/Gallery/FabMenu/Base.vue
index 04849e469..d5dae7ef1 100644
--- a/frontend/src/components/Gallery/FabMenu/Base.vue
+++ b/frontend/src/components/Gallery/FabMenu/Base.vue
@@ -37,12 +37,12 @@ async function onScan() {
 }
 
 function selectAllRoms() {
-  if (romsStore.filteredRoms.length === romsStore.selectedRoms.length) {
-    romsStore.resetSelection();
-    emitter?.emit("openFabMenu", false);
-  } else {
-    romsStore.setSelection(romsStore.filteredRoms);
-  }
+  romsStore.setSelection(romsStore.filteredRoms);
+}
+
+function resetSelection() {
+  romsStore.resetSelection();
+  emitter?.emit("openFabMenu", false);
 }
 
 function onDownload() {
@@ -53,47 +53,103 @@ function onDownload() {
 </script>
 
 <template>
-  <v-btn
-    color="terciary"
-    elevation="8"
-    :icon="
-      romsStore.filteredRoms.length === romsStore.selectedRoms.length
-        ? 'mdi-select'
-        : 'mdi-select-all'
-    "
-    class="mb-2 ml-1"
-    @click.stop="selectAllRoms"
-  />
+  <v-tooltip
+    open-delay="500"
+    class="tooltip"
+    text="Reset selection"
+    location="top"
+  >
+    <template v-slot:activator="{ props }">
+      <v-btn
+        v-bind="props"
+        color="terciary"
+        elevation="8"
+        icon="mdi-select"
+        class="mb-2 ml-1"
+        @click.stop="resetSelection"
+      />
+    </template>
+  </v-tooltip>
 
-  <v-btn
-    v-if="auth.scopes.includes('roms.write')"
-    color="terciary"
-    elevation="8"
-    icon
-    class="mb-2 ml-1"
-    @click="onScan"
+  <v-tooltip open-delay="500" class="tooltip" text="Select all" location="top">
+    <template v-slot:activator="{ props }">
+      <v-btn
+        v-bind="props"
+        color="terciary"
+        elevation="8"
+        icon="mdi-select-all"
+        class="mb-2 ml-1"
+        @click.stop="selectAllRoms"
+      />
+    </template>
+  </v-tooltip>
+
+  <v-tooltip
+    open-delay="500"
+    class="tooltip"
+    text="Scan selected games"
+    location="top"
   >
-    <v-icon>mdi-magnify-scan</v-icon>
-  </v-btn>
+    <template v-slot:activator="{ props }">
+      <v-btn
+        v-bind="props"
+        v-if="auth.scopes.includes('roms.write')"
+        color="terciary"
+        elevation="8"
+        icon
+        class="mb-2 ml-1"
+        @click="onScan"
+      >
+        <v-icon>mdi-magnify-scan</v-icon>
+      </v-btn>
+    </template>
+  </v-tooltip>
 
-  <v-btn
-    color="terciary"
-    elevation="8"
-    icon
-    class="mb-2 ml-1"
-    @click="onDownload"
+  <v-tooltip
+    open-delay="500"
+    class="tooltip"
+    text="Download selected games"
+    location="top"
   >
-    <v-icon>mdi-download</v-icon>
-  </v-btn>
+    <template v-slot:activator="{ props }">
+      <v-btn
+        v-bind="props"
+        color="terciary"
+        elevation="8"
+        icon
+        class="mb-2 ml-1"
+        @click="onDownload"
+      >
+        <v-icon>mdi-download</v-icon>
+      </v-btn>
+    </template>
+  </v-tooltip>
 
-  <v-btn
-    v-if="auth.scopes.includes('roms.write')"
-    color="terciary"
-    elevation="8"
-    icon
-    class="mb-3 ml-1"
-    @click="emitter?.emit('showDeleteRomDialog', romsStore.selectedRoms)"
+  <v-tooltip
+    open-delay="500"
+    class="tooltip"
+    text="Delete selected games"
+    location="top"
   >
-    <v-icon color="romm-red">mdi-delete</v-icon>
-  </v-btn>
+    <template v-slot:activator="{ props }">
+      <v-btn
+        v-bind="props"
+        v-if="auth.scopes.includes('roms.write')"
+        color="terciary"
+        elevation="8"
+        icon
+        class="mb-3 ml-1"
+        @click="emitter?.emit('showDeleteRomDialog', romsStore.selectedRoms)"
+      >
+        <v-icon color="romm-red">mdi-delete</v-icon>
+      </v-btn>
+    </template>
+  </v-tooltip>
 </template>
+
+<style scoped>
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
+</style>
diff --git a/frontend/src/components/Game/Card/Cover.vue b/frontend/src/components/Game/Card/Cover.vue
index c2fcc1908..48942c45e 100644
--- a/frontend/src/components/Game/Card/Cover.vue
+++ b/frontend/src/components/Game/Card/Cover.vue
@@ -7,6 +7,7 @@ import { identity, isNull } from "lodash";
 import { ref } from "vue";
 import { useTheme } from "vuetify";
 
+// Props
 defineProps<{
   rom: Rom;
   isHoveringTop: boolean;
@@ -28,21 +29,15 @@ const showLanguages = isNull(localStorage.getItem("settings.showLanguages"))
 const showSiblings = isNull(localStorage.getItem("settings.showSiblings"))
   ? true
   : localStorage.getItem("settings.showSiblings") === "true";
-
 let timeout: ReturnType<typeof setTimeout>;
-// Functions
-function onSelectRom(event: MouseEvent) {
-  if (!event.ctrlKey && !event.shiftKey) {
-    event.preventDefault();
-    emit("selectRom", event);
-  }
-}
 
+// Functions
 function onNavigate(event: MouseEvent) {
   if (
     event.ctrlKey ||
     event.shiftKey ||
-    (romsStore.touchScreen && romsStore.selectedRoms.length > 0)
+    romsStore.selecting ||
+    romsStore.selectedRoms.length > 0
   ) {
     event.preventDefault();
     event.stopPropagation();
@@ -54,7 +49,6 @@ function onTouchStart(event: TouchEvent) {
   card.value.$el.addEventListener("contextmenu", (event: Event) => {
     event.preventDefault();
   });
-  romsStore.isTouchScreen(true);
   timeout = setTimeout(() => {
     emit("selectRom", event);
   }, 500);
@@ -69,7 +63,7 @@ function onTouchEnd() {
   <router-link
     style="text-decoration: none; color: inherit"
     :to="
-      romsStore.touchScreen && romsStore.selectedRoms.length > 0
+      romsStore.selecting || romsStore.selectedRoms.length > 0
         ? {}
         : {
             name: 'rom',
@@ -125,7 +119,6 @@ function onTouchEnd() {
               'text-truncate': galleryViewStore.current == 0 && !isHovering,
             }"
           >
-            
             <v-list-item>{{ rom.name }}</v-list-item>
           </div>
         </v-expand-transition>
@@ -161,14 +154,6 @@ function onTouchEnd() {
             +{{ rom.siblings.length }}
           </v-chip>
         </v-row>
-        <v-icon
-          v-show="isHoveringTop && showSelector"
-          @click="onSelectRom"
-          size="small"
-          class="position-absolute checkbox"
-          :class="{ 'checkbox-selected': selected }"
-          >{{ selected ? "mdi-circle-slice-8" : "mdi-circle-outline" }}</v-icon
-        >
       </v-img>
     </v-hover>
   </router-link>
diff --git a/frontend/src/stores/roms.ts b/frontend/src/stores/roms.ts
index bfe256442..04c761ca7 100644
--- a/frontend/src/stores/roms.ts
+++ b/frontend/src/stores/roms.ts
@@ -23,7 +23,7 @@ export default defineStore("roms", {
     lastSelectedIndex: -1,
     cursor: "" as string | null,
     searchCursor: "" as string | null,
-    touchScreen: false,
+    selecting: false,
   }),
 
   getters: {
@@ -54,9 +54,11 @@ export default defineStore("roms", {
 
       // Group roms by external id
       this._grouped = Object.values(
-        groupBy(this._all, (game) =>
-          // If external id is null, generate a random id so that the roms are not grouped
-          game.igdb_id || game.moby_id || nanoid()
+        groupBy(
+          this._all,
+          (game) =>
+            // If external id is null, generate a random id so that the roms are not grouped
+            game.igdb_id || game.moby_id || nanoid()
         )
       )
         .map((games) => ({
@@ -180,8 +182,8 @@ export default defineStore("roms", {
     updateLastSelected(index: number) {
       this.lastSelectedIndex = index;
     },
-    isTouchScreen(touchScreen: boolean) {
-      this.touchScreen = touchScreen;
+    isSelecting() {
+      this.selecting = !this.selecting;
     },
     resetSelection() {
       this._selectedIDs = [];

From d32f5cf7170434a5b87272c17a34764b060530a1 Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Sun, 7 Apr 2024 19:04:34 -0400
Subject: [PATCH 27/61] fix cover removal not sticking

---
 backend/endpoints/rom.py                      | 20 +++++++++----------
 .../fs_handler/fs_resources_handler.py        |  6 ++++--
 .../components/Details/BackgroundHeader.vue   |  4 ++--
 .../src/components/Details/SourceTable.vue    |  2 +-
 .../src/components/Dialog/Rom/EditRom.vue     |  4 ++--
 .../components/Dialog/Rom/SearchRomGlobal.vue |  4 ++--
 frontend/src/components/Game/Card/Cover.vue   |  4 ++--
 frontend/src/stores/roms.ts                   |  2 +-
 frontend/src/views/Details/Base.vue           |  4 ++--
 9 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index 545796c85..b9d9c785c 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -320,19 +320,19 @@ async def update_rom(
     )
 
     if remove_cover:
-        fs_resource_handler.remove_cover(
+        cleaned_data.update(fs_resource_handler.remove_cover(
             rom_name=cleaned_data["name"], platform_fs_slug=platform_fs_slug
+        ))
+    else:
+        cleaned_data.update(
+            fs_resource_handler.get_rom_cover(
+                overwrite=True,
+                platform_fs_slug=platform_fs_slug,
+                rom_name=cleaned_data["name"],
+                url_cover=cleaned_data.get("url_cover", ""),
+            )
         )
 
-    cleaned_data.update(
-        fs_resource_handler.get_rom_cover(
-            overwrite=True,
-            platform_fs_slug=platform_fs_slug,
-            rom_name=cleaned_data["name"],
-            url_cover=cleaned_data.get("url_cover", ""),
-        )
-    )
-
     cleaned_data.update(
         fs_resource_handler.get_rom_screenshots(
             platform_fs_slug=platform_fs_slug,
diff --git a/backend/handler/fs_handler/fs_resources_handler.py b/backend/handler/fs_handler/fs_resources_handler.py
index 0d6d5dec6..322b2e7e8 100644
--- a/backend/handler/fs_handler/fs_resources_handler.py
+++ b/backend/handler/fs_handler/fs_resources_handler.py
@@ -50,7 +50,6 @@ def resize_cover(cover_path: str, size: CoverSize = CoverSize.BIG) -> None:
         """
         cover = Image.open(cover_path)
         if size == CoverSize.BIG and cover.size[1] > DEFAULT_HEIGHT_COVER_L:
-
             big_dimensions = (DEFAULT_WIDTH_COVER_L, DEFAULT_HEIGHT_COVER_L)
             background = Image.new("RGBA", big_dimensions, (0, 0, 0, 0))
             cover.thumbnail(big_dimensions)
@@ -155,7 +154,10 @@ def remove_cover(
         rom_name: str,
         platform_fs_slug: str,
     ):
-        shutil.rmtree(os.path.join(RESOURCES_BASE_PATH, platform_fs_slug, rom_name))
+        shutil.rmtree(
+            os.path.join(RESOURCES_BASE_PATH, platform_fs_slug, rom_name, "cover")
+        )
+        return { "path_cover_s": "", "path_cover_l": "" }
 
     @staticmethod
     def build_artwork_path(rom_name: str, platform_fs_slug: str, file_ext: str):
diff --git a/frontend/src/components/Details/BackgroundHeader.vue b/frontend/src/components/Details/BackgroundHeader.vue
index 9c095f140..03da20de6 100644
--- a/frontend/src/components/Details/BackgroundHeader.vue
+++ b/frontend/src/components/Details/BackgroundHeader.vue
@@ -5,13 +5,13 @@ const theme = useTheme();
 
 const props = defineProps<{ rom: RomSchema }>();
 const imgSrc =
-  !props.rom.igdb_id && !props.rom.has_cover
+  !props.rom.igdb_id && !props.rom.moby_id && !props.rom.has_cover
     ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
     : !props.rom.has_cover
     ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
     : `/assets/romm/resources/${props.rom.path_cover_s}`;
 const imgSrcLazy =
-  !props.rom.igdb_id && !props.rom.has_cover
+  !props.rom.igdb_id && !props.rom.moby_id && !props.rom.has_cover
     ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
     : !props.rom.has_cover
     ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
diff --git a/frontend/src/components/Details/SourceTable.vue b/frontend/src/components/Details/SourceTable.vue
index b1702b5b9..165dca6a1 100644
--- a/frontend/src/components/Details/SourceTable.vue
+++ b/frontend/src/components/Details/SourceTable.vue
@@ -7,7 +7,7 @@ defineProps<{ rom: Rom }>();
 <template>
   <div rounded="0" class="table">
     <v-row
-      v-if="rom.igdb_id"
+      v-if="rom.igdb_id || rom.moby_id"
       class="align-center justify-center pa-2"
       no-gutters
     >
diff --git a/frontend/src/components/Dialog/Rom/EditRom.vue b/frontend/src/components/Dialog/Rom/EditRom.vue
index c7aa6556d..78c3e86ef 100644
--- a/frontend/src/components/Dialog/Rom/EditRom.vue
+++ b/frontend/src/components/Dialog/Rom/EditRom.vue
@@ -183,7 +183,7 @@ function closeDialog() {
               :src="
                 imagePreviewUrl
                   ? imagePreviewUrl
-                  : !rom.igdb_id && !rom.has_cover
+                  : !rom.igdb_id && !rom.moby_id && !rom.has_cover
                   ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
                   : !rom.has_cover
                   ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
@@ -192,7 +192,7 @@ function closeDialog() {
               :lazy-src="
                 imagePreviewUrl
                   ? imagePreviewUrl
-                  : !rom.igdb_id && !rom.has_cover
+                  : !rom.igdb_id && !rom.moby_id && !rom.has_cover
                   ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
                   : !rom.has_cover
                   ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
diff --git a/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue b/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
index b09cfa6f6..c9341e36a 100644
--- a/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
@@ -219,14 +219,14 @@ onBeforeUnmount(() => {
                   <v-img
                     v-bind="props"
                     :src="
-                      !rom.igdb_id && !rom.has_cover
+                      !rom.igdb_id && !rom.moby_id && !rom.has_cover
                         ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
                         : !rom.has_cover
                         ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
                         : `/assets/romm/resources/${rom.path_cover_l}`
                     "
                     :lazy-src="
-                      !rom.igdb_id && !rom.has_cover
+                      !rom.igdb_id && !rom.moby_id && !rom.has_cover
                         ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
                         : !rom.has_cover
                         ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
diff --git a/frontend/src/components/Game/Card/Cover.vue b/frontend/src/components/Game/Card/Cover.vue
index c2fcc1908..00e3c2d77 100644
--- a/frontend/src/components/Game/Card/Cover.vue
+++ b/frontend/src/components/Game/Card/Cover.vue
@@ -93,14 +93,14 @@ function onTouchEnd() {
         :key="rom.id"
         v-bind="props"
         :src="
-          !rom.igdb_id && !rom.has_cover
+          !rom.igdb_id && !rom.moby_id && !rom.has_cover
             ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
             : !rom.has_cover
             ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
             : `/assets/romm/resources/${rom.path_cover_l}`
         "
         :lazy-src="
-          !rom.igdb_id && !rom.has_cover
+          !rom.igdb_id && !rom.moby_id && !rom.has_cover
             ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
             : !rom.has_cover
             ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
diff --git a/frontend/src/stores/roms.ts b/frontend/src/stores/roms.ts
index bfe256442..91248223d 100644
--- a/frontend/src/stores/roms.ts
+++ b/frontend/src/stores/roms.ts
@@ -130,7 +130,7 @@ export default defineStore("roms", {
     },
     filterUnmatched() {
       this._filteredIDs = this.filteredRoms
-        .filter((rom) => !rom.igdb_id)
+        .filter((rom) => !rom.igdb_id && !rom.moby_id)
         .map((roms) => roms.id);
     },
     filterGenre(genreToFilter: string) {
diff --git a/frontend/src/views/Details/Base.vue b/frontend/src/views/Details/Base.vue
index dd9e72964..186ec61bb 100644
--- a/frontend/src/views/Details/Base.vue
+++ b/frontend/src/views/Details/Base.vue
@@ -125,14 +125,14 @@ watch(
         <cover
           :romId="rom.id"
           :src="
-            !rom.igdb_id && !rom.has_cover
+            !rom.igdb_id && !rom.moby_id && !rom.has_cover
               ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
               : !rom.has_cover
               ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
               : `/assets/romm/resources/${rom.path_cover_l}`
           "
           :lazy-src="
-            !rom.igdb_id && !rom.has_cover
+            !rom.igdb_id && !rom.moby_id && !rom.has_cover
               ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
               : !rom.has_cover
               ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`

From dd2f57fc3454804a6653d23cb1a3e88014ceee5a Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 01:23:35 +0200
Subject: [PATCH 28/61] re-fetch screenshots only when changed game match

---
 backend/endpoints/rom.py                      | 26 ++++++++++++-------
 .../fs_handler/fs_resources_handler.py        | 11 +++++---
 2 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index b9d9c785c..27701e8d7 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -320,9 +320,11 @@ async def update_rom(
     )
 
     if remove_cover:
-        cleaned_data.update(fs_resource_handler.remove_cover(
-            rom_name=cleaned_data["name"], platform_fs_slug=platform_fs_slug
-        ))
+        cleaned_data.update(
+            fs_resource_handler.remove_cover(
+                rom_name=cleaned_data["name"], platform_fs_slug=platform_fs_slug
+            )
+        )
     else:
         cleaned_data.update(
             fs_resource_handler.get_rom_cover(
@@ -333,13 +335,17 @@ async def update_rom(
             )
         )
 
-    cleaned_data.update(
-        fs_resource_handler.get_rom_screenshots(
-            platform_fs_slug=platform_fs_slug,
-            rom_name=cleaned_data["name"],
-            url_screenshots=cleaned_data.get("url_screenshots", []),
-        ),
-    )
+    if (
+        cleaned_data["igdb_id"] != db_rom.igdb_id
+        or cleaned_data["moby_id"] != db_rom.moby_id
+    ):
+        cleaned_data.update(
+            fs_resource_handler.get_rom_screenshots(
+                platform_fs_slug=platform_fs_slug,
+                rom_name=cleaned_data["name"],
+                url_screenshots=cleaned_data.get("url_screenshots", []),
+            ),
+        )
 
     if artwork is not None:
         file_ext = artwork.filename.split(".")[-1]
diff --git a/backend/handler/fs_handler/fs_resources_handler.py b/backend/handler/fs_handler/fs_resources_handler.py
index 322b2e7e8..a399a551a 100644
--- a/backend/handler/fs_handler/fs_resources_handler.py
+++ b/backend/handler/fs_handler/fs_resources_handler.py
@@ -154,10 +154,13 @@ def remove_cover(
         rom_name: str,
         platform_fs_slug: str,
     ):
-        shutil.rmtree(
-            os.path.join(RESOURCES_BASE_PATH, platform_fs_slug, rom_name, "cover")
-        )
-        return { "path_cover_s": "", "path_cover_l": "" }
+        try:
+            shutil.rmtree(
+                os.path.join(RESOURCES_BASE_PATH, platform_fs_slug, rom_name, "cover")
+            )
+        except FileNotFoundError:
+            log.warning(f"Couldn't remove {rom_name} cover")
+        return {"path_cover_s": "", "path_cover_l": ""}
 
     @staticmethod
     def build_artwork_path(rom_name: str, platform_fs_slug: str, file_ext: str):

From 4c2c4ecfeff9d5aeb97279b1977b1b432d9d7391 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 11:11:14 +0200
Subject: [PATCH 29/61] fixed readme links

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 2db9d6688..36a1bde15 100644
--- a/README.md
+++ b/README.md
@@ -27,7 +27,7 @@ RomM (ROM Manager) allows you to scan, enrich, and browse your game collection w
 
 ## Features
 
-- Scans your existing games library and enchances it with metadata from [IGDB][igdb] and [MobyGames][mobygames]
+- Scans your existing games library and enchances it with metadata from [IGDB][igdb-api] and [MobyGames][mobygames-api]
 - Supports a large number of **[platforms][platform-support]**
 - Play games directly from the browser using [EmulatorJS][wiki-emulatorjs-url]
 - Share your library with friend while [limiting access and permissions][authentication]

From cff9d161a101a72a99041fd922bd4cd51ad41362 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 17:19:50 +0200
Subject: [PATCH 30/61] improved upload roms dialog

---
 .../Dialog/Config/CreatePlatformBinding.vue   |   1 -
 .../src/components/Dialog/Rom/UploadRom.vue   | 109 ++++++++++++++----
 frontend/src/components/Drawer/Base.vue       |  16 ++-
 frontend/src/types/emitter.d.ts               |   1 +
 4 files changed, 97 insertions(+), 30 deletions(-)

diff --git a/frontend/src/components/Dialog/Config/CreatePlatformBinding.vue b/frontend/src/components/Dialog/Config/CreatePlatformBinding.vue
index a75f2ecc2..1c942a72e 100644
--- a/frontend/src/components/Dialog/Config/CreatePlatformBinding.vue
+++ b/frontend/src/components/Dialog/Config/CreatePlatformBinding.vue
@@ -102,4 +102,3 @@ function closeDialog() {
     </v-card>
   </v-dialog>
 </template>
-@/services/configApi
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 5fc826447..5b120528f 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -1,18 +1,22 @@
 <script setup lang="ts">
-import { ref, inject } from "vue";
-import { useDisplay } from "vuetify";
-import type { Emitter } from "mitt";
-import type { Events } from "@/types/emitter";
-import { type Platform } from "@/stores/platforms";
-import socket from "@/services/socket";
+import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
 import romApi from "@/services/api/rom";
+import socket from "@/services/socket";
+import storePlatforms, { type Platform } from "@/stores/platforms";
 import storeScanning from "@/stores/scanning";
+import type { Events } from "@/types/emitter";
+import { formatBytes } from "@/utils";
+import type { Emitter } from "mitt";
+import { inject, ref } from "vue";
+import { useDisplay } from "vuetify";
 
+// Props
 const { xs, mdAndDown, lgAndUp } = useDisplay();
 const show = ref(false);
-const romsToUpload = ref([]);
+const romsToUpload = ref<File[]>([]);
 const scanningStore = storeScanning();
 const platform = ref<Platform | null>(null);
+const platforms = storePlatforms();
 
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
@@ -73,10 +77,19 @@ async function uploadRoms() {
         timeout: 4000,
       });
     });
+  romsToUpload.value = [];
+  platform.value = null;
+}
+
+function triggerFileInput() {
+  const fileInput = document.getElementById("file-input");
+  fileInput?.click();
 }
 
 function closeDialog() {
   show.value = false;
+  romsToUpload.value = [];
+  platform.value = null;
 }
 </script>
 
@@ -119,20 +132,70 @@ function closeDialog() {
       <v-divider class="border-opacity-25" :thickness="1" />
 
       <v-card-text>
-        <v-row class="pa-2" no-gutters>
-          <v-file-input
-            @keyup.enter="uploadRoms()"
-            :label="`Upload rom(s) to ${platform?.name}`"
-            v-model="romsToUpload"
-            prepend-inner-icon="mdi-disc"
-            prepend-icon=""
-            multiple
-            chips
-            required
-            variant="outlined"
-            hide-details
-          />
+        <v-select
+          label="Platform"
+          item-title="name"
+          v-model="platform"
+          :items="platforms.value"
+          variant="outlined"
+          rounded="0"
+          prepend-inner-icon="mdi-controller"
+          prepend-icon=""
+          return-object
+          clearable
+          hide-details
+        >
+          <template v-slot:item="{ props, item }">
+            <v-list-item
+              class="py-2"
+              v-bind="props"
+              :title="item.raw.name ?? ''"
+            >
+              <template v-slot:prepend>
+                <v-avatar :rounded="0" size="35">
+                  <platform-icon :key="item.raw.slug" :slug="item.raw.slug" />
+                </v-avatar>
+              </template>
+            </v-list-item>
+          </template>
+        </v-select>
+      </v-card-text>
+      <v-card-text v-if="romsToUpload.length > 0" class="scroll bg-terciary py-2 px-8">
+        <v-row
+          v-for="rom in romsToUpload"
+          class="py-2"
+          no-gutters
+        >
+          <v-col cols="9" lg="10">
+            {{ rom.name }}
+          </v-col>
+          <v-col cols="3" lg="2">
+            [<span class="text-romm-accent-1">{{ formatBytes(rom.size) }}</span
+            >]
+          </v-col>
         </v-row>
+      </v-card-text>
+      <v-card-text>
+        <v-btn
+          size="large"
+          block
+          prepend-icon="mdi-plus"
+          variant="outlined"
+          class="text-romm-accent-1"
+          @click="triggerFileInput"
+        >
+          Add games
+        </v-btn>
+        <v-file-input
+          class="file-input"
+          id="file-input"
+          @keyup.enter="uploadRoms()"
+          v-model="romsToUpload"
+          multiple
+          required
+        />
+      </v-card-text>
+      <v-card-text>
         <v-row class="justify-center pa-2" no-gutters>
           <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>
           <v-btn @click="uploadRoms()" class="text-romm-green ml-5 bg-terciary">
@@ -156,4 +219,10 @@ function closeDialog() {
 .edit-content-mobile {
   width: 85vw;
 }
+.file-input {
+  display: none;
+}
+.scroll {
+  overflow-y: scroll;
+}
 </style>
diff --git a/frontend/src/components/Drawer/Base.vue b/frontend/src/components/Drawer/Base.vue
index f5d2493cd..d54ed8fdc 100644
--- a/frontend/src/components/Drawer/Base.vue
+++ b/frontend/src/components/Drawer/Base.vue
@@ -2,9 +2,10 @@
 import type { Events } from "@/types/emitter";
 
 import type { Emitter } from "mitt";
-import { inject, onMounted, ref } from "vue";
+import { inject, ref } from "vue";
 import { useDisplay } from "vuetify";
 
+import AddPlatformDialog from "@/components/Dialog/Platform/AddPlatform.vue";
 import SearchRomGlobalDialog from "@/components/Dialog/Rom/SearchRomGlobal.vue";
 import RailFooter from "@/components/Drawer/Footer.vue";
 import DrawerHeader from "@/components/Drawer/Header.vue";
@@ -28,12 +29,6 @@ emitter?.on("toggleDrawer", () => {
 emitter?.on("toggleDrawerRail", () => {
   rail.value = !rail.value;
   localStorage.setItem("rail", rail.value.toString());
-
-
-async function addPlatform(){
-  const { data: message } = await platformApi.uploadPlatform("romm");
-  console.log(message)
-}
 });
 </script>
 
@@ -110,8 +105,10 @@ async function addPlatform(){
             >
           </template>
         </v-list-item>
-        <v-list-item class="bg-terciary" @click="addPlatform">
-          <span v-if="!rail" class="text-body-2 text-truncate">Add platform</span>
+        <v-list-item class="bg-terciary" @click="emitter?.emit('showAddPlatformDialog', null)">
+          <span v-if="!rail" class="text-body-2 text-truncate"
+            >Add platform</span
+          >
           <template v-slot:prepend>
             <v-avatar :rounded="0" size="40"
               ><v-icon>mdi-plus</v-icon></v-avatar
@@ -153,4 +150,5 @@ async function addPlatform(){
   </v-navigation-drawer>
 
   <search-rom-global-dialog />
+  <add-platform-dialog />
 </template>
diff --git a/frontend/src/types/emitter.d.ts b/frontend/src/types/emitter.d.ts
index f696fb7b6..8ede2b79c 100644
--- a/frontend/src/types/emitter.d.ts
+++ b/frontend/src/types/emitter.d.ts
@@ -22,6 +22,7 @@ export type Events = {
   showEditRomDialog: Rom;
   showDeleteRomDialog: Rom[];
   showUploadRomDialog: Platform;
+  showAddPlatformDialog: null;
   showCreatePlatformBindingDialog: {
     fsSlug: string;
     slug: string;

From 1fe73c7ac8ed955ac6b07e8f29022f799e7a790c Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 17:20:02 +0200
Subject: [PATCH 31/61] add platform dialog added

---
 .../Dialog/Platform/AddPlatform.vue           | 86 +++++++++++++++++++
 1 file changed, 86 insertions(+)
 create mode 100644 frontend/src/components/Dialog/Platform/AddPlatform.vue

diff --git a/frontend/src/components/Dialog/Platform/AddPlatform.vue b/frontend/src/components/Dialog/Platform/AddPlatform.vue
new file mode 100644
index 000000000..2d3d7c90b
--- /dev/null
+++ b/frontend/src/components/Dialog/Platform/AddPlatform.vue
@@ -0,0 +1,86 @@
+<script setup lang="ts">
+import type { Events } from "@/types/emitter";
+import type { Emitter } from "mitt";
+import { inject, onBeforeUnmount, ref } from "vue";
+
+// Props
+const show = ref(false);
+const fsSlugToCreate = ref();
+const slugToCreate = ref();
+const emitter = inject<Emitter<Events>>("emitter");
+emitter?.on("showAddPlatformDialog", () => {
+  show.value = true;
+});
+
+// Functions
+function addPlatform() {
+  console.log(fsSlugToCreate.value);
+  console.log(slugToCreate.value);
+}
+
+function closeDialog() {
+  show.value = false;
+}
+
+onBeforeUnmount(() => {
+  emitter?.off("showAddPlatformDialog");
+});
+</script>
+
+<template>
+  <v-dialog
+    :modelValue="show"
+    max-width="500px" 
+    scroll-strategy="none"
+    :scrim="true"
+    @click:outside="closeDialog"
+    @keydown.esc="closeDialog"
+    no-click-animation
+    persistent
+  >
+    <v-card>
+      <v-toolbar density="compact" class="bg-terciary">
+        <v-row class="align-center" no-gutters>
+          <v-col cols="10">
+            <v-icon icon="mdi-controller" class="ml-5 mr-2" />
+          </v-col>
+          <v-col>
+            <v-btn
+              @click="closeDialog"
+              class="bg-terciary"
+              rounded="0"
+              variant="text"
+              icon="mdi-close"
+              block
+            />
+          </v-col>
+        </v-row>
+      </v-toolbar>
+      <v-divider class="border-opacity-25" :thickness="1" />
+
+      <v-card-text>
+        <v-row class="pa-2 align-center" no-gutters>
+          <v-text-field
+            @keyup.enter=""
+            v-model="fsSlugToCreate"
+            label="Platform name (folder name)"
+            variant="outlined"
+            required
+            hide-details
+          />
+        </v-row>
+        <v-row class="justify-center pa-2" no-gutters>
+          <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>
+          <v-btn
+            @click="addPlatform()"
+            class="text-romm-green bg-terciary ml-5"
+          >
+            Confirm
+          </v-btn>
+        </v-row>
+      </v-card-text>
+    </v-card>
+  </v-dialog>
+</template>
+
+<style scoped></style>

From df047cc5e98847c422842048376f48cde4405e64 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 18:31:02 +0200
Subject: [PATCH 32/61] upload roms button in drawer added

---
 backend/endpoints/platform.py                 | 15 +++++++---
 backend/exceptions/fs_exceptions.py           |  9 ++++++
 backend/handler/fs_handler/__init__.py        | 11 ++++++++
 .../fs_handler/fs_platforms_handler.py        | 13 ++++++++-
 backend/handler/fs_handler/fs_roms_handler.py |  8 ------
 .../Dialog/Platform/AddPlatform.vue           | 28 +++++++++++++++++--
 .../src/components/Dialog/Rom/UploadRom.vue   | 15 +++++-----
 frontend/src/components/Drawer/Base.vue       | 10 +++++++
 frontend/src/services/api/platform.ts         |  8 ++++--
 frontend/src/types/emitter.d.ts               |  2 +-
 10 files changed, 93 insertions(+), 26 deletions(-)

diff --git a/backend/endpoints/platform.py b/backend/endpoints/platform.py
index 6c67b91f8..a03ed4fa1 100644
--- a/backend/endpoints/platform.py
+++ b/backend/endpoints/platform.py
@@ -1,8 +1,9 @@
 from decorators.auth import protected_route
 from endpoints.responses import MessageResponse
 from endpoints.responses.platform import PlatformSchema
+from exceptions.fs_exceptions import PlatformAlreadyExistsException
 from fastapi import APIRouter, HTTPException, Request, status
-from handler import db_platform_handler, igdb_handler
+from handler import db_platform_handler, igdb_handler, fs_platform_handler
 from logger.logger import log
 
 router = APIRouter()
@@ -21,9 +22,15 @@ async def add_platforms(request: Request) -> MessageResponse:
 
     data = await request.json()
     fs_slug = data["fs_slug"]
-    platform = igdb_handler.get_platform(fs_slug)
-    log.debug(platform)
-
+    try:
+        fs_platform_handler.add_platforms(fs_slug=fs_slug)
+    except PlatformAlreadyExistsException as e:
+        log.error(str(e))
+        raise HTTPException(
+            status_code=status.HTTP_500_INTERNAL_SERVER_ERROR, detail=str(e)
+        )
+    # platform = igdb_handler.get_platform(fs_slug)
+    # db_platform_handler.add_platform(platform=platform)
     return {"msg": f"Platform created successfully!"}
 
 
diff --git a/backend/exceptions/fs_exceptions.py b/backend/exceptions/fs_exceptions.py
index 466c7cfca..f66697886 100644
--- a/backend/exceptions/fs_exceptions.py
+++ b/backend/exceptions/fs_exceptions.py
@@ -19,6 +19,15 @@ def __repr__(self):
         return self.message
 
 
+class PlatformAlreadyExistsException(Exception):
+    def __init__(self, fs_slug: str):
+        self.message = f"Can't create platform {fs_slug}: already exists"
+        super().__init__(self.message)
+
+    def __repr__(self):
+        return self.message
+
+
 class RomsNotFoundException(Exception):
     def __init__(self, platform: str):
         self.message = f"Roms not found for platform {platform}. {folder_struct_msg}"
diff --git a/backend/handler/fs_handler/__init__.py b/backend/handler/fs_handler/__init__.py
index e8cc9b823..f6ca74864 100644
--- a/backend/handler/fs_handler/__init__.py
+++ b/backend/handler/fs_handler/__init__.py
@@ -1,8 +1,11 @@
+import os
 import re
 from abc import ABC
 from enum import Enum
 from typing import Final
 
+from config.config_manager import config_manager as cm
+
 DEFAULT_WIDTH_COVER_L: Final = 264  # Width of big cover of IGDB
 DEFAULT_HEIGHT_COVER_L: Final = 352  # Height of big cover of IGDB
 DEFAULT_WIDTH_COVER_S: Final = 90  # Width of small cover of IGDB
@@ -84,6 +87,14 @@ class FSHandler(ABC):
     def __init__(self) -> None:
         pass
 
+    def get_fs_structure(self, fs_slug: str) -> str:
+        cnfg = cm.get_config()
+        return (
+            f"{cnfg.ROMS_FOLDER_NAME}/{fs_slug}"
+            if os.path.exists(cnfg.HIGH_PRIO_STRUCTURE_PATH)
+            else f"{fs_slug}/{cnfg.ROMS_FOLDER_NAME}"
+        )
+
     def get_file_name_with_no_extension(self, file_name: str) -> str:
         return re.sub(EXTENSION_REGEX, "", file_name).strip()
 
diff --git a/backend/handler/fs_handler/fs_platforms_handler.py b/backend/handler/fs_handler/fs_platforms_handler.py
index ae1439cfc..5b598341a 100644
--- a/backend/handler/fs_handler/fs_platforms_handler.py
+++ b/backend/handler/fs_handler/fs_platforms_handler.py
@@ -2,7 +2,7 @@
 
 from config import LIBRARY_BASE_PATH
 from config.config_manager import config_manager as cm, Config
-from exceptions.fs_exceptions import FolderStructureNotMatchException
+from exceptions.fs_exceptions import FolderStructureNotMatchException, PlatformAlreadyExistsException
 from handler.fs_handler import FSHandler
 
 
@@ -17,6 +17,17 @@ def _exclude_platforms(self, config: Config, platforms: list):
             if platform not in config.EXCLUDED_PLATFORMS
         ]
 
+    def add_platforms(self, fs_slug: str) -> None:
+        cnfg = cm.get_config()
+        try:
+            (
+                os.mkdir(f"{cnfg.HIGH_PRIO_STRUCTURE_PATH}/{fs_slug}")
+                if os.path.exists(cnfg.HIGH_PRIO_STRUCTURE_PATH)
+                else os.mkdir(f"{LIBRARY_BASE_PATH}/{fs_slug}/roms")
+            )
+        except FileExistsError:
+            raise PlatformAlreadyExistsException(fs_slug)
+
     def get_platforms(self) -> list[str]:
         """Gets all filesystem platforms
 
diff --git a/backend/handler/fs_handler/fs_roms_handler.py b/backend/handler/fs_handler/fs_roms_handler.py
index 7c5116f67..066164799 100644
--- a/backend/handler/fs_handler/fs_roms_handler.py
+++ b/backend/handler/fs_handler/fs_roms_handler.py
@@ -22,14 +22,6 @@ class FSRomsHandler(FSHandler):
     def __init__(self) -> None:
         pass
 
-    def get_fs_structure(self, fs_slug: str):
-        cnfg = cm.get_config()
-        return (
-            f"{cnfg.ROMS_FOLDER_NAME}/{fs_slug}"
-            if os.path.exists(cnfg.HIGH_PRIO_STRUCTURE_PATH)
-            else f"{fs_slug}/{cnfg.ROMS_FOLDER_NAME}"
-        )
-
     def remove_file(self, file_name: str, file_path: str):
         try:
             os.remove(f"{LIBRARY_BASE_PATH}/{file_path}/{file_name}")
diff --git a/frontend/src/components/Dialog/Platform/AddPlatform.vue b/frontend/src/components/Dialog/Platform/AddPlatform.vue
index 2d3d7c90b..888e927ab 100644
--- a/frontend/src/components/Dialog/Platform/AddPlatform.vue
+++ b/frontend/src/components/Dialog/Platform/AddPlatform.vue
@@ -2,6 +2,7 @@
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, onBeforeUnmount, ref } from "vue";
+import platformApi from "@/services/api/platform";
 
 // Props
 const show = ref(false);
@@ -14,12 +15,33 @@ emitter?.on("showAddPlatformDialog", () => {
 
 // Functions
 function addPlatform() {
-  console.log(fsSlugToCreate.value);
-  console.log(slugToCreate.value);
+  platformApi
+    .uploadPlatform({ fsSlug: fsSlugToCreate.value })
+    .then(() => {
+      emitter?.emit("snackbarShow", {
+        msg: `Platform ${fsSlugToCreate.value} created successfully!`,
+        icon: "mdi-check-bold",
+        color: "green",
+        timeout: 2000,
+      });
+      closeDialog();
+    })
+    .catch((error) => {
+      console.log(error);
+      emitter?.emit("snackbarShow", {
+        msg: error.response.data.detail,
+        icon: "mdi-close-circle",
+        color: "red",
+      });
+    })
+    .finally(() => {
+      emitter?.emit("showLoadingDialog", { loading: false, scrim: false });
+    });
 }
 
 function closeDialog() {
   show.value = false;
+  fsSlugToCreate.value = null;
 }
 
 onBeforeUnmount(() => {
@@ -30,7 +52,7 @@ onBeforeUnmount(() => {
 <template>
   <v-dialog
     :modelValue="show"
-    max-width="500px" 
+    max-width="500px"
     scroll-strategy="none"
     :scrim="true"
     @click:outside="closeDialog"
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 5b120528f..2a320aebd 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -20,7 +20,9 @@ const platforms = storePlatforms();
 
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
-  platform.value = platformWhereUpload;
+  if (platformWhereUpload) {
+    platform.value = platformWhereUpload;
+  }
   show.value = true;
 });
 
@@ -160,12 +162,11 @@ function closeDialog() {
           </template>
         </v-select>
       </v-card-text>
-      <v-card-text v-if="romsToUpload.length > 0" class="scroll bg-terciary py-2 px-8">
-        <v-row
-          v-for="rom in romsToUpload"
-          class="py-2"
-          no-gutters
-        >
+      <v-card-text
+        v-if="romsToUpload.length > 0"
+        class="scroll bg-terciary py-2 px-8"
+      >
+        <v-row v-for="rom in romsToUpload" class="py-2" no-gutters>
           <v-col cols="9" lg="10">
             {{ rom.name }}
           </v-col>
diff --git a/frontend/src/components/Drawer/Base.vue b/frontend/src/components/Drawer/Base.vue
index d54ed8fdc..73a31700e 100644
--- a/frontend/src/components/Drawer/Base.vue
+++ b/frontend/src/components/Drawer/Base.vue
@@ -115,6 +115,16 @@ emitter?.on("toggleDrawerRail", () => {
             >
           </template>
         </v-list-item>
+        <v-list-item class="bg-terciary" @click="emitter?.emit('showUploadRomDialog', null)">
+          <span v-if="!rail" class="text-body-2 text-truncate"
+            >Upload roms</span
+          >
+          <template v-slot:prepend>
+            <v-avatar :rounded="0" size="40"
+              ><v-icon>mdi-plus</v-icon></v-avatar
+            >
+          </template>
+        </v-list-item>
       </v-list-group>
     </v-list>
 
diff --git a/frontend/src/services/api/platform.ts b/frontend/src/services/api/platform.ts
index e7b12fa31..d1e7af6e3 100644
--- a/frontend/src/services/api/platform.ts
+++ b/frontend/src/services/api/platform.ts
@@ -3,8 +3,12 @@ import api from "@/services/api/index";
 
 export const platformApi = api;
 
-async function uploadPlatform(slug: string): Promise<{ data: MessageResponse[] }> {
-  return api.post("/platforms", {"slug": slug});
+async function uploadPlatform({
+  fsSlug,
+}: {
+  fsSlug: string;
+}): Promise<{ data: MessageResponse[] }> {
+  return api.post("/platforms", { fs_slug: fsSlug });
 }
 
 async function getPlatforms(): Promise<{ data: PlatformSchema[] }> {
diff --git a/frontend/src/types/emitter.d.ts b/frontend/src/types/emitter.d.ts
index 8ede2b79c..6fd2fb227 100644
--- a/frontend/src/types/emitter.d.ts
+++ b/frontend/src/types/emitter.d.ts
@@ -21,7 +21,7 @@ export type Events = {
   showSearchRomGlobalDialog: null;
   showEditRomDialog: Rom;
   showDeleteRomDialog: Rom[];
-  showUploadRomDialog: Platform;
+  showUploadRomDialog: Platform | null;
   showAddPlatformDialog: null;
   showCreatePlatformBindingDialog: {
     fsSlug: string;

From 492d8212996f956d247cda0555cbf32deccb8902 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 18:32:02 +0200
Subject: [PATCH 33/61] upload roms icon fixed

---
 frontend/src/components/Drawer/Base.vue                 | 2 +-
 frontend/src/components/Gallery/AppBar/UploadRomBtn.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Drawer/Base.vue b/frontend/src/components/Drawer/Base.vue
index 73a31700e..7eb7deb89 100644
--- a/frontend/src/components/Drawer/Base.vue
+++ b/frontend/src/components/Drawer/Base.vue
@@ -121,7 +121,7 @@ emitter?.on("toggleDrawerRail", () => {
           >
           <template v-slot:prepend>
             <v-avatar :rounded="0" size="40"
-              ><v-icon>mdi-plus</v-icon></v-avatar
+              ><v-icon>mdi-upload</v-icon></v-avatar
             >
           </template>
         </v-list-item>
diff --git a/frontend/src/components/Gallery/AppBar/UploadRomBtn.vue b/frontend/src/components/Gallery/AppBar/UploadRomBtn.vue
index 40e9e913f..da11149b6 100644
--- a/frontend/src/components/Gallery/AppBar/UploadRomBtn.vue
+++ b/frontend/src/components/Gallery/AppBar/UploadRomBtn.vue
@@ -16,7 +16,7 @@ const romsStore = storeRoms();
     class="py-4 pr-5"
   >
     <v-list-item-title class="d-flex"
-      ><v-icon icon="mdi-upload" class="mr-2" />Upload games</v-list-item-title
+      ><v-icon icon="mdi-upload" class="mr-2" />Upload roms</v-list-item-title
     >
   </v-list-item>
 </template>

From a2d5e2d7490410fb866f7efb76c73e245a534edd Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Mon, 8 Apr 2024 23:45:36 +0200
Subject: [PATCH 34/61] fixed quick scan from gallery

---
 frontend/src/components/Dialog/Rom/UploadRom.vue  | 15 +++++++++------
 .../src/components/Gallery/AppBar/ScanBtn.vue     |  2 +-
 frontend/src/services/api/rom.ts                  |  6 +++---
 3 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 2a320aebd..48c36b1f3 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -31,16 +31,18 @@ async function uploadRoms() {
   if (!platform.value) return;
   show.value = false;
   scanningStore.set(true);
+  const platformId = platform.value.id
   emitter?.emit("snackbarShow", {
     msg: `Uploading ${romsToUpload.value.length} roms to ${platform.value.name}...`,
     icon: "mdi-loading mdi-spin",
     color: "romm-accent-1",
   });
 
+
   await romApi
     .uploadRoms({
       romsToUpload: romsToUpload.value,
-      platform: platform.value.id,
+      platformId: platformId,
     })
     .then(({ data }) => {
       const { uploaded_roms, skipped_roms } = data;
@@ -64,7 +66,7 @@ async function uploadRoms() {
       if (!socket.connected) socket.connect();
       setTimeout(() => {
         socket.emit("scan", {
-          platforms: [platform.value?.id],
+          platforms: [platformId],
           type: "quick",
         });
       }, 2000);
@@ -133,7 +135,7 @@ function closeDialog() {
       </v-toolbar>
       <v-divider class="border-opacity-25" :thickness="1" />
 
-      <v-card-text>
+      <v-card-text class="my-4 py-0">
         <v-select
           label="Platform"
           item-title="name"
@@ -141,6 +143,7 @@ function closeDialog() {
           :items="platforms.value"
           variant="outlined"
           rounded="0"
+          density="comfortable"
           prepend-inner-icon="mdi-controller"
           prepend-icon=""
           return-object
@@ -176,7 +179,7 @@ function closeDialog() {
           </v-col>
         </v-row>
       </v-card-text>
-      <v-card-text>
+      <v-card-text class="mt-4 py-0">
         <v-btn
           size="large"
           block
@@ -196,8 +199,8 @@ function closeDialog() {
           required
         />
       </v-card-text>
-      <v-card-text>
-        <v-row class="justify-center pa-2" no-gutters>
+      <v-card-text class="my-4 py-0">
+        <v-row class="justify-center px-2" no-gutters>
           <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>
           <v-btn @click="uploadRoms()" class="text-romm-green ml-5 bg-terciary">
             Upload
diff --git a/frontend/src/components/Gallery/AppBar/ScanBtn.vue b/frontend/src/components/Gallery/AppBar/ScanBtn.vue
index 7d90002bb..c74ab0c2e 100644
--- a/frontend/src/components/Gallery/AppBar/ScanBtn.vue
+++ b/frontend/src/components/Gallery/AppBar/ScanBtn.vue
@@ -14,7 +14,7 @@ async function scan() {
 
   socket.emit("scan", {
     platforms: [romsStore.platform.id],
-    type: "unidentified",
+    type: "quick",
   });
 }
 </script>
diff --git a/frontend/src/services/api/rom.ts b/frontend/src/services/api/rom.ts
index 09f55f79b..daf34fc7a 100644
--- a/frontend/src/services/api/rom.ts
+++ b/frontend/src/services/api/rom.ts
@@ -13,10 +13,10 @@ import type { Rom } from "@/stores/roms";
 export const romApi = api;
 
 async function uploadRoms({
-  platform,
+  platformId,
   romsToUpload,
 }: {
-  platform: number;
+  platformId: number;
   romsToUpload: File[];
 }): Promise<{ data: AddRomsResponse }> {
   let formData = new FormData();
@@ -26,7 +26,7 @@ async function uploadRoms({
     headers: {
       "Content-Type": "multipart/form-data",
     },
-    params: { platform_id: platform },
+    params: { platform_id: platformId },
   });
 }
 

From 2e26d06e90d706799b479e3a10d46e0a8918b51d Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 00:11:04 +0200
Subject: [PATCH 35/61] dialogs unified into home page

---
 frontend/src/components/Dashboard/Recent.vue  |  11 -
 .../src/components/Dialog/Rom/MatchRom.vue    | 383 ++++++++++++++++++
 .../src/components/Dialog/Rom/SearchRom.vue   | 350 ++++++++--------
 .../components/Dialog/Rom/SearchRomGlobal.vue | 377 -----------------
 frontend/src/components/Drawer/Base.vue       |  18 +-
 .../src/components/Game/AdminMenu/Base.vue    |   2 +-
 .../Settings/Config/ExclusionsCard.vue        |   3 -
 .../Settings/Config/PlatformBindingCard.vue   |   5 -
 .../Settings/Config/PlatformVersionsCard.vue  |   5 -
 frontend/src/types/emitter.d.ts               |   4 +-
 frontend/src/views/Details/Base.vue           |  11 -
 frontend/src/views/Gallery/Base.vue           |  14 -
 frontend/src/views/Home.vue                   |  35 ++
 .../Settings/ControlPanel/Users/Base.vue      |  17 +-
 14 files changed, 606 insertions(+), 629 deletions(-)
 create mode 100644 frontend/src/components/Dialog/Rom/MatchRom.vue
 delete mode 100644 frontend/src/components/Dialog/Rom/SearchRomGlobal.vue

diff --git a/frontend/src/components/Dashboard/Recent.vue b/frontend/src/components/Dashboard/Recent.vue
index 7d9f8284c..3d6850846 100644
--- a/frontend/src/components/Dashboard/Recent.vue
+++ b/frontend/src/components/Dashboard/Recent.vue
@@ -1,9 +1,4 @@
 <script setup lang="ts">
-import LoadingDialog from "@/components/Dialog/Loading.vue";
-import DeleteRomDialog from "@/components/Dialog/Rom/DeleteRom.vue";
-import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
-import SearchRomDialog from "@/components/Dialog/Rom/SearchRom.vue";
-import UploadRomDialog from "@/components/Dialog/Rom/UploadRom.vue";
 import GameCard from "@/components/Game/Card/Base.vue";
 import romApi from "@/services/api/rom";
 import storeRoms from "@/stores/roms";
@@ -69,12 +64,6 @@ onMounted(() => {
       <!-- TODO: Add a button to upload roms if no roms were uploaded in the last 30 days -->
     </v-card-text>
   </v-card>
-
-  <search-rom-dialog />
-  <upload-rom-dialog />
-  <edit-rom-dialog />
-  <delete-rom-dialog />
-  <loading-dialog />
 </template>
 <style scoped>
 .scroll {
diff --git a/frontend/src/components/Dialog/Rom/MatchRom.vue b/frontend/src/components/Dialog/Rom/MatchRom.vue
new file mode 100644
index 000000000..e5b6f3746
--- /dev/null
+++ b/frontend/src/components/Dialog/Rom/MatchRom.vue
@@ -0,0 +1,383 @@
+<script setup lang="ts">
+import type { SearchRomSchema } from "@/__generated__";
+import romApi from "@/services/api/rom";
+import storeRoms, { type Rom } from "@/stores/roms";
+import type { Events } from "@/types/emitter";
+import type { Emitter } from "mitt";
+import { inject, onBeforeUnmount, ref } from "vue";
+import { useDisplay, useTheme } from "vuetify";
+
+const { xs, mdAndDown, lgAndUp } = useDisplay();
+const show = ref(false);
+const rom = ref<Rom | null>(null);
+const romsStore = storeRoms();
+const renameAsIGDB = ref(false);
+const searching = ref(false);
+const searchTerm = ref("");
+const searchBy = ref("Name");
+const searchExtended = ref(false);
+const matchedRoms = ref<SearchRomSchema[]>([]);
+const theme = useTheme();
+const emitter = inject<Emitter<Events>>("emitter");
+emitter?.on("showMatchRomDialog", (romToSearch) => {
+  rom.value = romToSearch;
+  searchTerm.value = romToSearch.name || romToSearch.file_name_no_tags || "";
+  show.value = true;
+  searchRom();
+});
+
+// Functions
+function toggleExtended() {
+  searchExtended.value = !searchExtended.value;
+}
+
+async function searchRom() {
+  if (!rom.value) return;
+
+  // Auto hide android keyboard
+  const inputElement = document.getElementById("search-text-field");
+  inputElement?.blur();
+
+  if (!searching.value) {
+    searching.value = true;
+    await romApi
+      .searchRom({
+        romId: rom.value.id,
+        searchTerm: searchTerm.value,
+        searchBy: searchBy.value,
+        searchExtended: searchExtended.value,
+      })
+      .then((response) => {
+        matchedRoms.value = response.data;
+      })
+      .catch((error) => {
+        emitter?.emit("snackbarShow", {
+          msg: error.response.data.detail,
+          icon: "mdi-close-circle",
+          color: "red",
+        });
+      })
+      .finally(() => {
+        searching.value = false;
+      });
+  }
+}
+
+async function updateRom(matchedRom: SearchRomSchema) {
+  if (!rom.value) return;
+
+  show.value = false;
+  emitter?.emit("showLoadingDialog", { loading: true, scrim: true });
+
+  Object.assign(rom.value, matchedRom);
+
+  await romApi
+    .updateRom({ rom: rom.value, renameAsIGDB: renameAsIGDB.value })
+    .then(({ data }) => {
+      emitter?.emit("snackbarShow", {
+        msg: "Rom updated successfully!",
+        icon: "mdi-check-bold",
+        color: "green",
+      });
+      romsStore.update(data);
+      emitter?.emit("refreshView", null);
+    })
+    .catch((error) => {
+      emitter?.emit("snackbarShow", {
+        msg: error.response.data.detail,
+        icon: "mdi-close-circle",
+        color: "red",
+      });
+    })
+    .finally(() => {
+      emitter?.emit("showLoadingDialog", { loading: false, scrim: false });
+    });
+}
+
+function closeDialog() {
+  show.value = false;
+  searchBy.value = "Name";
+  searchExtended.value = false;
+}
+
+onBeforeUnmount(() => {
+  emitter?.off("showMatchRomDialog");
+});
+</script>
+
+<template>
+  <v-dialog
+    :modelValue="show"
+    scroll-strategy="none"
+    width="auto"
+    :scrim="true"
+    @click:outside="closeDialog"
+    @keydown.esc="closeDialog"
+    no-click-animation
+    persistent
+  >
+    <v-card
+      :class="{
+        'search-content': lgAndUp,
+        'search-content-tablet': mdAndDown,
+        'search-content-mobile': xs,
+      }"
+      rounded="0"
+    >
+      <v-toolbar density="compact" class="bg-terciary">
+        <v-row class="align-center" no-gutters>
+          <v-col cols="9" xs="9" sm="10" md="10" lg="11">
+            <v-icon icon="mdi-search-web" class="ml-5" />
+          </v-col>
+          <v-col>
+            <v-btn
+              @click="closeDialog"
+              class="bg-terciary"
+              rounded="0"
+              variant="text"
+              icon="mdi-close"
+              block
+            />
+          </v-col>
+        </v-row>
+      </v-toolbar>
+
+      <v-divider class="border-opacity-25" :thickness="1" />
+
+      <v-toolbar density="compact" class="bg-primary">
+        <v-row class="align-center" no-gutters>
+          <v-col cols="5" xs="5" sm="5" md="6" lg="8">
+            <v-text-field
+              id="search-text-field"
+              @keyup.enter="searchRom()"
+              @click:clear="searchTerm = ''"
+              class="bg-terciary"
+              v-model="searchTerm"
+              label="search"
+              hide-details
+              clearable
+            />
+          </v-col>
+          <v-col cols="3" xs="3" sm="3" md="2" lg="2">
+            <v-select
+              label="by"
+              class="bg-terciary"
+              :items="['ID', 'Name']"
+              v-model="searchBy"
+              hide-details
+            />
+          </v-col>
+
+          <v-col cols="2" xs="2" sm="2" md="2" lg="1">
+            <v-tooltip
+              location="top"
+              class="tooltip"
+              transition="fade-transition"
+              text="Extended search to match by alternative names. This will take longer."
+              open-delay="500"
+              ><template v-slot:activator="{ props }">
+                <v-btn
+                  v-bind="props"
+                  @click="toggleExtended"
+                  class="bg-terciary"
+                  :color="searchExtended ? 'romm-accent-1' : ''"
+                  rounded="0"
+                  variant="tonal"
+                  icon="mdi-layers-search-outline"
+                  block /></template></v-tooltip
+          ></v-col>
+          <v-col cols="2" xs="2" sm="2" md="2" lg="1">
+            <v-btn
+              type="submit"
+              @click="searchRom()"
+              class="bg-terciary"
+              rounded="0"
+              variant="text"
+              icon="mdi-search-web"
+              block
+              :disabled="searching"
+            />
+          </v-col>
+        </v-row>
+      </v-toolbar>
+
+      <v-divider class="border-opacity-25" :thickness="1" />
+
+      <v-card-text class="pa-1 scroll">
+        <v-row
+          class="justify-center align-center loader-searching fill-height"
+          v-show="searching"
+          no-gutters
+        >
+          <v-progress-circular
+            :width="2"
+            :size="40"
+            color="romm-accent-1"
+            indeterminate
+          />
+        </v-row>
+        <v-row
+          class="justify-center align-center loader-searching fill-height"
+          v-show="!searching && matchedRoms.length == 0"
+          no-gutters
+        >
+          <span>No results found</span>
+        </v-row>
+        <v-row no-gutters>
+          <v-col
+            class="pa-1"
+            cols="4"
+            xs="4"
+            sm="3"
+            md="3"
+            lg="2"
+            v-show="!searching"
+            v-for="matchedRom in matchedRoms"
+          >
+            <v-hover v-slot="{ isHovering, props }">
+              <v-card
+                @click="updateRom(matchedRom)"
+                v-bind="props"
+                class="matched-rom"
+                :class="{ 'on-hover': isHovering }"
+                :elevation="isHovering ? 20 : 3"
+              >
+                <v-hover v-slot="{ isHovering, props }" open-delay="800">
+                  <v-img
+                    v-bind="props"
+                    :src="
+                      !matchedRom.url_cover
+                        ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
+                        : matchedRom.url_cover
+                    "
+                    :lazy-src="
+                      !matchedRom.url_cover
+                        ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
+                        : matchedRom.url_cover
+                    "
+                    :aspect-ratio="3 / 4"
+                  >
+                    <template v-slot:placeholder>
+                      <div
+                        class="d-flex align-center justify-center fill-height"
+                      >
+                        <v-progress-circular
+                          color="romm-accent-1"
+                          :width="2"
+                          indeterminate
+                        />
+                      </div>
+                    </template>
+                    <v-expand-transition>
+                      <div
+                        v-if="isHovering || !matchedRom.url_cover"
+                        class="translucent text-caption"
+                      >
+                        <v-list-item>{{ matchedRom.name }}</v-list-item>
+                      </div>
+                    </v-expand-transition>
+                    <v-row no-gutters class="text-white pa-1">
+                      <v-tooltip
+                        location="top"
+                        class="tooltip"
+                        transition="fade-transition"
+                        text="IGDB matched"
+                        open-delay="500"
+                        ><template v-slot:activator="{ props }">
+                          <v-avatar
+                            v-bind="props"
+                            v-if="matchedRom.igdb_id"
+                            class="mr-1"
+                            size="30"
+                            rounded="1"
+                          >
+                            <v-img
+                              src="/assets/scrappers/igdb.png"
+                            /> </v-avatar></template
+                      ></v-tooltip>
+                      <v-tooltip
+                        location="top"
+                        class="tooltip"
+                        transition="fade-transition"
+                        text="Mobygames matched"
+                        open-delay="500"
+                        ><template v-slot:activator="{ props }">
+                          <v-avatar
+                            v-bind="props"
+                            v-if="matchedRom.moby_id"
+                            class="mr-1"
+                            size="30"
+                            rounded="1"
+                          >
+                            <v-img
+                              src="/assets/scrappers/moby.png"
+                            /> </v-avatar></template
+                      ></v-tooltip>
+                    </v-row> </v-img
+                ></v-hover>
+                <v-card-text>
+                  <v-row class="pa-1 align-center">
+                    <v-col class="pa-0 ml-1 text-truncate">
+                      <span :title="matchedRom.name">{{
+                        matchedRom.name
+                      }}</span>
+                    </v-col>
+                  </v-row>
+                </v-card-text>
+              </v-card>
+            </v-hover>
+          </v-col>
+        </v-row>
+      </v-card-text>
+
+      <v-divider class="border-opacity-25" :thickness="1" />
+
+      <v-toolbar class="bg-terciary" density="compact">
+        <v-checkbox
+          v-model="renameAsIGDB"
+          label="Rename rom"
+          class="ml-3"
+          hide-details
+        />
+      </v-toolbar>
+    </v-card>
+  </v-dialog>
+</template>
+
+<style scoped>
+.scroll {
+  overflow-y: scroll;
+}
+
+.search-content {
+  width: 60vw;
+  height: 80vh;
+}
+
+.search-content-tablet {
+  width: 75vw;
+  height: 640px;
+}
+
+.search-content-mobile {
+  width: 85vw;
+  height: 640px;
+}
+.matched-rom {
+  transition-property: all;
+  transition-duration: 0.1s;
+}
+.matched-rom.on-hover {
+  z-index: 1 !important;
+  transform: scale(1.05);
+}
+.translucent {
+  background: rgba(0, 0, 0, 0.35);
+  backdrop-filter: blur(10px);
+  text-shadow: 1px 1px 1px #000000, 0 0 1px #000000;
+}
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
+</style>
diff --git a/frontend/src/components/Dialog/Rom/SearchRom.vue b/frontend/src/components/Dialog/Rom/SearchRom.vue
index a6d98cf36..eead57557 100644
--- a/frontend/src/components/Dialog/Rom/SearchRom.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRom.vue
@@ -1,103 +1,88 @@
 <script setup lang="ts">
-import type { SearchRomSchema } from "@/__generated__";
+import type { RomSchema } from "@/__generated__";
+import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
 import romApi from "@/services/api/rom";
-import storeRoms, { type Rom } from "@/stores/roms";
+import storeGalleryView from "@/stores/galleryView";
 import type { Events } from "@/types/emitter";
+import { languageToEmoji, regionToEmoji } from "@/utils";
+import { identity, isNull } from "lodash";
 import type { Emitter } from "mitt";
 import { inject, onBeforeUnmount, ref } from "vue";
+import { useRouter } from "vue-router";
 import { useDisplay, useTheme } from "vuetify";
 
+const theme = useTheme();
 const { xs, mdAndDown, lgAndUp } = useDisplay();
+const galleryViewStore = storeGalleryView();
 const show = ref(false);
-const rom = ref<Rom | null>(null);
-const romsStore = storeRoms();
-const renameAsIGDB = ref(false);
 const searching = ref(false);
-const searchTerm = ref("");
-const searchBy = ref("Name");
-const searchExtended = ref(false);
-const matchedRoms = ref<SearchRomSchema[]>([]);
-const theme = useTheme();
+const router = useRouter();
+const searchedRoms = ref();
+const filteredRoms = ref();
+const platforms = ref();
+const selectedPlatform = ref();
+const searchValue = ref("");
+const showRegions = isNull(localStorage.getItem("settings.showRegions"))
+  ? true
+  : localStorage.getItem("settings.showRegions") === "true";
+const showLanguages = isNull(localStorage.getItem("settings.showLanguages"))
+  ? true
+  : localStorage.getItem("settings.showLanguages") === "true";
+const showSiblings = isNull(localStorage.getItem("settings.showSiblings"))
+  ? true
+  : localStorage.getItem("settings.showSiblings") === "true";
+
 const emitter = inject<Emitter<Events>>("emitter");
-emitter?.on("showSearchRomDialog", (romToSearch) => {
-  rom.value = romToSearch;
-  searchTerm.value = romToSearch.name || romToSearch.file_name_no_tags || "";
+emitter?.on("showSearchRomDialog", () => {
   show.value = true;
-  searchRom();
 });
 
-// Functions
-function toggleExtended() {
-  searchExtended.value = !searchExtended.value;
+function clearFilter() {
+  selectedPlatform.value = null;
 }
 
-async function searchRom() {
-  if (!rom.value) return;
-
+async function searchRoms() {
   // Auto hide android keyboard
   const inputElement = document.getElementById("search-text-field");
   inputElement?.blur();
+  searching.value = true;
+  searchedRoms.value = (
+    await romApi.getRoms({ searchTerm: searchValue.value, size: 250 })
+  ).data.items.sort((a, b) => {
+    return a.platform_name.localeCompare(b.platform_name);
+  });
+  platforms.value = [
+    ...new Set(
+      searchedRoms.value.map(
+        (rom: { platform_name: string }) => rom.platform_name
+      )
+    ),
+  ];
+  filterRoms();
+  searching.value = false;
+}
 
-  if (!searching.value) {
-    searching.value = true;
-    await romApi
-      .searchRom({
-        romId: rom.value.id,
-        searchTerm: searchTerm.value,
-        searchBy: searchBy.value,
-        searchExtended: searchExtended.value,
-      })
-      .then((response) => {
-        matchedRoms.value = response.data;
-      })
-      .catch((error) => {
-        emitter?.emit("snackbarShow", {
-          msg: error.response.data.detail,
-          icon: "mdi-close-circle",
-          color: "red",
-        });
-      })
-      .finally(() => {
-        searching.value = false;
-      });
+async function filterRoms() {
+  if (!selectedPlatform.value) {
+    filteredRoms.value = searchedRoms.value;
+  } else {
+    filteredRoms.value = searchedRoms.value.filter(
+      (rom: { platform_name: string }) =>
+        rom.platform_name == selectedPlatform.value
+    );
   }
 }
 
-async function updateRom(matchedRom: SearchRomSchema) {
-  if (!rom.value) return;
-
-  show.value = false;
-  emitter?.emit("showLoadingDialog", { loading: true, scrim: true });
-
-  Object.assign(rom.value, matchedRom);
-
-  await romApi
-    .updateRom({ rom: rom.value, renameAsIGDB: renameAsIGDB.value })
-    .then(({ data }) => {
-      emitter?.emit("snackbarShow", {
-        msg: "Rom updated successfully!",
-        icon: "mdi-check-bold",
-        color: "green",
-      });
-      romsStore.update(data);
-      emitter?.emit("refreshView", null);
-    })
-    .catch((error) => {
-      emitter?.emit("snackbarShow", {
-        msg: error.response.data.detail,
-        icon: "mdi-close-circle",
-        color: "red",
-      });
-    })
-    .finally(() => {
-      emitter?.emit("showLoadingDialog", { loading: false, scrim: false });
-    });
+function romDetails(rom: RomSchema) {
+  router.push({
+    name: "rom",
+    params: { rom: rom.id },
+  });
+  closeDialog();
 }
 
 function closeDialog() {
   show.value = false;
-  searchBy.value = "Name";
-  searchExtended.value = false;
 }
 
 onBeforeUnmount(() => {
@@ -126,13 +111,15 @@ onBeforeUnmount(() => {
     >
       <v-toolbar density="compact" class="bg-terciary">
         <v-row class="align-center" no-gutters>
-          <v-col cols="9" xs="9" sm="10" md="10" lg="11">
-            <v-icon icon="mdi-search-web" class="ml-5" />
+          <v-col cols="10" xs="10" sm="11" md="11" lg="11">
+            <v-icon icon="mdi-magnify" class="ml-5" />
+            <v-avatar :rounded="0" :size="30" class="mx-4"
+              ><v-img src="/assets/isotipo.svg"
+            /></v-avatar>
           </v-col>
-          <v-col>
+          <v-col cols="2" xs="2" sm="1" md="1" lg="1">
             <v-btn
               @click="closeDialog"
-              class="bg-terciary"
               rounded="0"
               variant="text"
               icon="mdi-close"
@@ -146,54 +133,40 @@ onBeforeUnmount(() => {
 
       <v-toolbar density="compact" class="bg-primary">
         <v-row class="align-center" no-gutters>
-          <v-col cols="5" xs="5" sm="5" md="6" lg="8">
+          <v-col cols="6" xs="6" sm="6" md="6" lg="7">
             <v-text-field
+              autofocus
               id="search-text-field"
-              @keyup.enter="searchRom()"
-              @click:clear="searchTerm = ''"
-              class="bg-terciary"
-              v-model="searchTerm"
-              label="search"
+              @keyup.enter="searchRoms"
+              @click:clear="searchRoms"
+              v-model="searchValue"
+              label="Search"
               hide-details
+              class="bg-terciary"
               clearable
             />
           </v-col>
-          <v-col cols="3" xs="3" sm="3" md="2" lg="2">
+          <v-col cols="4" xs="4" sm="5" md="5" lg="4">
             <v-select
-              label="by"
+              @click:clear="clearFilter"
+              clearable
+              label="Platform"
               class="bg-terciary"
-              :items="['ID', 'Name']"
-              v-model="searchBy"
               hide-details
-            />
+              v-model="selectedPlatform"
+              @update:model-value="filterRoms"
+              :items="platforms"
+            >
+            </v-select>
           </v-col>
-
-          <v-col cols="2" xs="2" sm="2" md="2" lg="1">
-            <v-tooltip
-              location="top"
-              class="tooltip"
-              transition="fade-transition"
-              text="Extended search to match by alternative names. This will take longer."
-              open-delay="500"
-              ><template v-slot:activator="{ props }">
-                <v-btn
-                  v-bind="props"
-                  @click="toggleExtended"
-                  class="bg-terciary"
-                  :color="searchExtended ? 'romm-accent-1' : ''"
-                  rounded="0"
-                  variant="tonal"
-                  icon="mdi-layers-search-outline"
-                  block /></template></v-tooltip
-          ></v-col>
-          <v-col cols="2" xs="2" sm="2" md="2" lg="1">
+          <v-col cols="2" xs="2" sm="1" md="1" lg="1">
             <v-btn
               type="submit"
-              @click="searchRom()"
+              @click="searchRoms"
               class="bg-terciary"
               rounded="0"
               variant="text"
-              icon="mdi-search-web"
+              icon="mdi-magnify"
               block
               :disabled="searching"
             />
@@ -218,7 +191,7 @@ onBeforeUnmount(() => {
         </v-row>
         <v-row
           class="justify-center align-center loader-searching fill-height"
-          v-show="!searching && matchedRoms.length == 0"
+          v-show="!searching && searchedRoms?.length == 0"
           no-gutters
         >
           <span>No results found</span>
@@ -227,16 +200,16 @@ onBeforeUnmount(() => {
           <v-col
             class="pa-1"
             cols="4"
-            xs="4"
-            sm="3"
-            md="3"
+            sm="2"
+            md="2"
             lg="2"
+            xl="2"
             v-show="!searching"
-            v-for="matchedRom in matchedRoms"
+            v-for="rom in filteredRoms"
           >
             <v-hover v-slot="{ isHovering, props }">
               <v-card
-                @click="updateRom(matchedRom)"
+                @click="romDetails(rom)"
                 v-bind="props"
                 class="matched-rom"
                 :class="{ 'on-hover': isHovering }"
@@ -246,14 +219,18 @@ onBeforeUnmount(() => {
                   <v-img
                     v-bind="props"
                     :src="
-                      !matchedRom.url_cover
+                      !rom.igdb_id && !rom.moby_id && !rom.has_cover
+                        ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
+                        : !rom.has_cover
                         ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
-                        : matchedRom.url_cover
+                        : `/assets/romm/resources/${rom.path_cover_l}`
                     "
                     :lazy-src="
-                      !matchedRom.url_cover
+                      !rom.igdb_id && !rom.moby_id && !rom.has_cover
+                        ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
+                        : !rom.has_cover
                         ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
-                        : matchedRom.url_cover
+                        : `/assets/romm/resources/${rom.path_cover_s}`
                     "
                     :aspect-ratio="3 / 4"
                   >
@@ -270,58 +247,78 @@ onBeforeUnmount(() => {
                     </template>
                     <v-expand-transition>
                       <div
-                        v-if="isHovering || !matchedRom.url_cover"
+                        v-if="isHovering || !rom.has_cover"
                         class="translucent text-caption"
+                        :class="{
+                          'text-truncate':
+                            galleryViewStore.current == 0 && !isHovering,
+                        }"
                       >
-                        <v-list-item>{{ matchedRom.name }}</v-list-item>
+                        <v-list-item>{{ rom.name }}</v-list-item>
                       </div>
                     </v-expand-transition>
-                    <v-row no-gutters class="text-white pa-1">
-                      <v-tooltip
-                        location="top"
-                        class="tooltip"
-                        transition="fade-transition"
-                        text="IGDB matched"
-                        open-delay="500"
-                        ><template v-slot:activator="{ props }">
-                          <v-avatar
-                            v-bind="props"
-                            v-if="matchedRom.igdb_id"
-                            class="mr-1"
-                            size="30"
-                            rounded="1"
-                          >
-                            <v-img
-                              src="/assets/scrappers/igdb.png"
-                            /> </v-avatar></template
-                      ></v-tooltip>
-                      <v-tooltip
-                        location="top"
-                        class="tooltip"
-                        transition="fade-transition"
-                        text="Mobygames matched"
-                        open-delay="500"
-                        ><template v-slot:activator="{ props }">
-                          <v-avatar
-                            v-bind="props"
-                            v-if="matchedRom.moby_id"
-                            class="mr-1"
-                            size="30"
-                            rounded="1"
-                          >
-                            <v-img
-                              src="/assets/scrappers/moby.png"
-                            /> </v-avatar></template
-                      ></v-tooltip>
-                    </v-row> </v-img
-                ></v-hover>
+                    <v-row no-gutters class="text-white px-1">
+                      <v-chip
+                        v-if="
+                          rom.regions.filter(identity).length > 0 && showRegions
+                        "
+                        :title="`Regions: ${rom.regions.join(', ')}`"
+                        class="translucent mr-1 mt-1 px-1"
+                        :class="{ 'emoji-collection': rom.regions.length > 3 }"
+                        density="compact"
+                      >
+                        <span
+                          class="emoji"
+                          v-for="region in rom.regions.slice(0, 3)"
+                        >
+                          {{ regionToEmoji(region) }}
+                        </span>
+                      </v-chip>
+                      <v-chip
+                        v-if="
+                          rom.languages.filter(identity).length > 0 &&
+                          showLanguages
+                        "
+                        :title="`Languages: ${rom.languages.join(', ')}`"
+                        class="translucent mr-1 mt-1 px-1"
+                        :class="{
+                          'emoji-collection': rom.languages.length > 3,
+                        }"
+                        density="compact"
+                      >
+                        <span
+                          class="emoji"
+                          v-for="language in rom.languages.slice(0, 3)"
+                        >
+                          {{ languageToEmoji(language) }}
+                        </span>
+                      </v-chip>
+                      <v-chip
+                        v-if="
+                          rom.siblings &&
+                          rom.siblings.length > 0 &&
+                          showSiblings
+                        "
+                        :title="`${rom.siblings.length + 1} versions`"
+                        class="translucent mr-1 mt-1"
+                        density="compact"
+                      >
+                        +{{ rom.siblings.length }}
+                      </v-chip>
+                    </v-row></v-img
+                  ></v-hover
+                >
                 <v-card-text>
                   <v-row class="pa-1 align-center">
                     <v-col class="pa-0 ml-1 text-truncate">
-                      <span :title="matchedRom.name">{{
-                        matchedRom.name
-                      }}</span>
+                      <span>{{ rom.name }}</span>
                     </v-col>
+                    <v-avatar :rounded="0" size="20" class="ml-2">
+                      <platform-icon
+                        :key="rom.platform_slug"
+                        :slug="rom.platform_slug"
+                      />
+                    </v-avatar>
                   </v-row>
                 </v-card-text>
               </v-card>
@@ -329,22 +326,15 @@ onBeforeUnmount(() => {
           </v-col>
         </v-row>
       </v-card-text>
-
-      <v-divider class="border-opacity-25" :thickness="1" />
-
-      <v-toolbar class="bg-terciary" density="compact">
-        <v-checkbox
-          v-model="renameAsIGDB"
-          label="Rename rom"
-          class="ml-3"
-          hide-details
-        />
-      </v-toolbar>
     </v-card>
   </v-dialog>
 </template>
 
 <style scoped>
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
 .scroll {
   overflow-y: scroll;
 }
@@ -376,8 +366,12 @@ onBeforeUnmount(() => {
   backdrop-filter: blur(10px);
   text-shadow: 1px 1px 1px #000000, 0 0 1px #000000;
 }
-.tooltip :deep(.v-overlay__content) {
-  background: rgba(201, 201, 201, 0.98) !important;
-  color: rgb(41, 41, 41) !important;
+
+.emoji-collection {
+  mask-image: linear-gradient(to right, black 0%, black 70%, transparent 100%);
+}
+
+.emoji {
+  margin: 0 2px;
 }
 </style>
diff --git a/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue b/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
deleted file mode 100644
index c9341e36a..000000000
--- a/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
+++ /dev/null
@@ -1,377 +0,0 @@
-<script setup lang="ts">
-import type { RomSchema } from "@/__generated__";
-import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
-import romApi from "@/services/api/rom";
-import storeGalleryView from "@/stores/galleryView";
-import type { Events } from "@/types/emitter";
-import { languageToEmoji, regionToEmoji } from "@/utils";
-import { identity, isNull } from "lodash";
-import type { Emitter } from "mitt";
-import { inject, onBeforeUnmount, ref } from "vue";
-import { useRouter } from "vue-router";
-import { useDisplay, useTheme } from "vuetify";
-
-const theme = useTheme();
-const { xs, mdAndDown, lgAndUp } = useDisplay();
-const galleryViewStore = storeGalleryView();
-const show = ref(false);
-const searching = ref(false);
-const router = useRouter();
-const searchedRoms = ref();
-const filteredRoms = ref();
-const platforms = ref();
-const selectedPlatform = ref();
-const searchValue = ref("");
-const showRegions = isNull(localStorage.getItem("settings.showRegions"))
-  ? true
-  : localStorage.getItem("settings.showRegions") === "true";
-const showLanguages = isNull(localStorage.getItem("settings.showLanguages"))
-  ? true
-  : localStorage.getItem("settings.showLanguages") === "true";
-const showSiblings = isNull(localStorage.getItem("settings.showSiblings"))
-  ? true
-  : localStorage.getItem("settings.showSiblings") === "true";
-
-const emitter = inject<Emitter<Events>>("emitter");
-emitter?.on("showSearchRomGlobalDialog", () => {
-  show.value = true;
-});
-
-function clearFilter() {
-  selectedPlatform.value = null;
-}
-
-async function searchRoms() {
-  // Auto hide android keyboard
-  const inputElement = document.getElementById("search-text-field");
-  inputElement?.blur();
-  searching.value = true;
-  searchedRoms.value = (
-    await romApi.getRoms({ searchTerm: searchValue.value, size: 250 })
-  ).data.items.sort((a, b) => {
-    return a.platform_name.localeCompare(b.platform_name);
-  });
-  platforms.value = [
-    ...new Set(
-      searchedRoms.value.map(
-        (rom: { platform_name: string }) => rom.platform_name
-      )
-    ),
-  ];
-  filterRoms();
-  searching.value = false;
-}
-
-async function filterRoms() {
-  if (!selectedPlatform.value) {
-    filteredRoms.value = searchedRoms.value;
-  } else {
-    filteredRoms.value = searchedRoms.value.filter(
-      (rom: { platform_name: string }) =>
-        rom.platform_name == selectedPlatform.value
-    );
-  }
-}
-
-function romDetails(rom: RomSchema) {
-  router.push({
-    name: "rom",
-    params: { rom: rom.id },
-  });
-  closeDialog();
-}
-
-function closeDialog() {
-  show.value = false;
-}
-
-onBeforeUnmount(() => {
-  emitter?.off("showSearchRomGlobalDialog");
-});
-</script>
-
-<template>
-  <v-dialog
-    :modelValue="show"
-    scroll-strategy="none"
-    width="auto"
-    :scrim="true"
-    @click:outside="closeDialog"
-    @keydown.esc="closeDialog"
-    no-click-animation
-    persistent
-  >
-    <v-card
-      :class="{
-        'search-content': lgAndUp,
-        'search-content-tablet': mdAndDown,
-        'search-content-mobile': xs,
-      }"
-      rounded="0"
-    >
-      <v-toolbar density="compact" class="bg-terciary">
-        <v-row class="align-center" no-gutters>
-          <v-col cols="10" xs="10" sm="11" md="11" lg="11">
-            <v-icon icon="mdi-magnify" class="ml-5" />
-            <v-avatar :rounded="0" :size="30" class="mx-4"
-              ><v-img src="/assets/isotipo.svg"
-            /></v-avatar>
-          </v-col>
-          <v-col cols="2" xs="2" sm="1" md="1" lg="1">
-            <v-btn
-              @click="closeDialog"
-              rounded="0"
-              variant="text"
-              icon="mdi-close"
-              block
-            />
-          </v-col>
-        </v-row>
-      </v-toolbar>
-
-      <v-divider class="border-opacity-25" :thickness="1" />
-
-      <v-toolbar density="compact" class="bg-primary">
-        <v-row class="align-center" no-gutters>
-          <v-col cols="6" xs="6" sm="6" md="6" lg="7">
-            <v-text-field
-              autofocus
-              id="search-text-field"
-              @keyup.enter="searchRoms"
-              @click:clear="searchRoms"
-              v-model="searchValue"
-              label="Search"
-              hide-details
-              class="bg-terciary"
-              clearable
-            />
-          </v-col>
-          <v-col cols="4" xs="4" sm="5" md="5" lg="4">
-            <v-select
-              @click:clear="clearFilter"
-              clearable
-              label="Platform"
-              class="bg-terciary"
-              hide-details
-              v-model="selectedPlatform"
-              @update:model-value="filterRoms"
-              :items="platforms"
-            >
-            </v-select>
-          </v-col>
-          <v-col cols="2" xs="2" sm="1" md="1" lg="1">
-            <v-btn
-              type="submit"
-              @click="searchRoms"
-              class="bg-terciary"
-              rounded="0"
-              variant="text"
-              icon="mdi-magnify"
-              block
-              :disabled="searching"
-            />
-          </v-col>
-        </v-row>
-      </v-toolbar>
-
-      <v-divider class="border-opacity-25" :thickness="1" />
-
-      <v-card-text class="pa-1 scroll">
-        <v-row
-          class="justify-center align-center loader-searching fill-height"
-          v-show="searching"
-          no-gutters
-        >
-          <v-progress-circular
-            :width="2"
-            :size="40"
-            color="romm-accent-1"
-            indeterminate
-          />
-        </v-row>
-        <v-row
-          class="justify-center align-center loader-searching fill-height"
-          v-show="!searching && searchedRoms?.length == 0"
-          no-gutters
-        >
-          <span>No results found</span>
-        </v-row>
-        <v-row no-gutters>
-          <v-col
-            class="pa-1"
-            cols="4"
-            sm="2"
-            md="2"
-            lg="2"
-            xl="2"
-            v-show="!searching"
-            v-for="rom in filteredRoms"
-          >
-            <v-hover v-slot="{ isHovering, props }">
-              <v-card
-                @click="romDetails(rom)"
-                v-bind="props"
-                class="matched-rom"
-                :class="{ 'on-hover': isHovering }"
-                :elevation="isHovering ? 20 : 3"
-              >
-                <v-hover v-slot="{ isHovering, props }" open-delay="800">
-                  <v-img
-                    v-bind="props"
-                    :src="
-                      !rom.igdb_id && !rom.moby_id && !rom.has_cover
-                        ? `/assets/default/cover/big_${theme.global.name.value}_unmatched.png`
-                        : !rom.has_cover
-                        ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
-                        : `/assets/romm/resources/${rom.path_cover_l}`
-                    "
-                    :lazy-src="
-                      !rom.igdb_id && !rom.moby_id && !rom.has_cover
-                        ? `/assets/default/cover/small_${theme.global.name.value}_unmatched.png`
-                        : !rom.has_cover
-                        ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
-                        : `/assets/romm/resources/${rom.path_cover_s}`
-                    "
-                    :aspect-ratio="3 / 4"
-                  >
-                    <template v-slot:placeholder>
-                      <div
-                        class="d-flex align-center justify-center fill-height"
-                      >
-                        <v-progress-circular
-                          color="romm-accent-1"
-                          :width="2"
-                          indeterminate
-                        />
-                      </div>
-                    </template>
-                    <v-expand-transition>
-                      <div
-                        v-if="isHovering || !rom.has_cover"
-                        class="translucent text-caption"
-                        :class="{
-                          'text-truncate':
-                            galleryViewStore.current == 0 && !isHovering,
-                        }"
-                      >
-                        <v-list-item>{{ rom.name }}</v-list-item>
-                      </div>
-                    </v-expand-transition>
-                    <v-row no-gutters class="text-white px-1">
-                      <v-chip
-                        v-if="
-                          rom.regions.filter(identity).length > 0 && showRegions
-                        "
-                        :title="`Regions: ${rom.regions.join(', ')}`"
-                        class="translucent mr-1 mt-1 px-1"
-                        :class="{ 'emoji-collection': rom.regions.length > 3 }"
-                        density="compact"
-                      >
-                        <span
-                          class="emoji"
-                          v-for="region in rom.regions.slice(0, 3)"
-                        >
-                          {{ regionToEmoji(region) }}
-                        </span>
-                      </v-chip>
-                      <v-chip
-                        v-if="
-                          rom.languages.filter(identity).length > 0 &&
-                          showLanguages
-                        "
-                        :title="`Languages: ${rom.languages.join(', ')}`"
-                        class="translucent mr-1 mt-1 px-1"
-                        :class="{
-                          'emoji-collection': rom.languages.length > 3,
-                        }"
-                        density="compact"
-                      >
-                        <span
-                          class="emoji"
-                          v-for="language in rom.languages.slice(0, 3)"
-                        >
-                          {{ languageToEmoji(language) }}
-                        </span>
-                      </v-chip>
-                      <v-chip
-                        v-if="
-                          rom.siblings &&
-                          rom.siblings.length > 0 &&
-                          showSiblings
-                        "
-                        :title="`${rom.siblings.length + 1} versions`"
-                        class="translucent mr-1 mt-1"
-                        density="compact"
-                      >
-                        +{{ rom.siblings.length }}
-                      </v-chip>
-                    </v-row></v-img
-                  ></v-hover
-                >
-                <v-card-text>
-                  <v-row class="pa-1 align-center">
-                    <v-col class="pa-0 ml-1 text-truncate">
-                      <span>{{ rom.name }}</span>
-                    </v-col>
-                    <v-avatar :rounded="0" size="20" class="ml-2">
-                      <platform-icon
-                        :key="rom.platform_slug"
-                        :slug="rom.platform_slug"
-                      />
-                    </v-avatar>
-                  </v-row>
-                </v-card-text>
-              </v-card>
-            </v-hover>
-          </v-col>
-        </v-row>
-      </v-card-text>
-    </v-card>
-  </v-dialog>
-</template>
-
-<style scoped>
-.tooltip :deep(.v-overlay__content) {
-  background: rgba(201, 201, 201, 0.98) !important;
-  color: rgb(41, 41, 41) !important;
-}
-.scroll {
-  overflow-y: scroll;
-}
-
-.search-content {
-  width: 60vw;
-  height: 80vh;
-}
-
-.search-content-tablet {
-  width: 75vw;
-  height: 640px;
-}
-
-.search-content-mobile {
-  width: 85vw;
-  height: 640px;
-}
-.matched-rom {
-  transition-property: all;
-  transition-duration: 0.1s;
-}
-.matched-rom.on-hover {
-  z-index: 1 !important;
-  transform: scale(1.05);
-}
-.translucent {
-  background: rgba(0, 0, 0, 0.35);
-  backdrop-filter: blur(10px);
-  text-shadow: 1px 1px 1px #000000, 0 0 1px #000000;
-}
-
-.emoji-collection {
-  mask-image: linear-gradient(to right, black 0%, black 70%, transparent 100%);
-}
-
-.emoji {
-  margin: 0 2px;
-}
-</style>
diff --git a/frontend/src/components/Drawer/Base.vue b/frontend/src/components/Drawer/Base.vue
index 7eb7deb89..550a2a05e 100644
--- a/frontend/src/components/Drawer/Base.vue
+++ b/frontend/src/components/Drawer/Base.vue
@@ -5,14 +5,11 @@ import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
 import { useDisplay } from "vuetify";
 
-import AddPlatformDialog from "@/components/Dialog/Platform/AddPlatform.vue";
-import SearchRomGlobalDialog from "@/components/Dialog/Rom/SearchRomGlobal.vue";
 import RailFooter from "@/components/Drawer/Footer.vue";
 import DrawerHeader from "@/components/Drawer/Header.vue";
 import PlatformListItem from "@/components/Platform/PlatformListItem.vue";
 import storeAuth from "@/stores/auth";
 import storePlatforms from "@/stores/platforms";
-import platformApi from "@/services/api/platform";
 
 // Props
 const { lgAndUp } = useDisplay();
@@ -44,7 +41,7 @@ emitter?.on("toggleDrawerRail", () => {
       <drawer-header :rail="rail" />
       <v-divider />
       <v-list-item
-        @click="emitter?.emit('showSearchRomGlobalDialog', null)"
+        @click="emitter?.emit('showSearchRomDialog', null)"
         :class="{ 'px-4': !rail }"
         class="bg-terciary"
       >
@@ -105,7 +102,10 @@ emitter?.on("toggleDrawerRail", () => {
             >
           </template>
         </v-list-item>
-        <v-list-item class="bg-terciary" @click="emitter?.emit('showAddPlatformDialog', null)">
+        <v-list-item
+          class="bg-terciary"
+          @click="emitter?.emit('showAddPlatformDialog', null)"
+        >
           <span v-if="!rail" class="text-body-2 text-truncate"
             >Add platform</span
           >
@@ -115,7 +115,10 @@ emitter?.on("toggleDrawerRail", () => {
             >
           </template>
         </v-list-item>
-        <v-list-item class="bg-terciary" @click="emitter?.emit('showUploadRomDialog', null)">
+        <v-list-item
+          class="bg-terciary"
+          @click="emitter?.emit('showUploadRomDialog', null)"
+        >
           <span v-if="!rail" class="text-body-2 text-truncate"
             >Upload roms</span
           >
@@ -158,7 +161,4 @@ emitter?.on("toggleDrawerRail", () => {
       <rail-footer :rail="rail" />
     </template>
   </v-navigation-drawer>
-
-  <search-rom-global-dialog />
-  <add-platform-dialog />
 </template>
diff --git a/frontend/src/components/Game/AdminMenu/Base.vue b/frontend/src/components/Game/AdminMenu/Base.vue
index 052a0550e..0f7c44ffe 100644
--- a/frontend/src/components/Game/AdminMenu/Base.vue
+++ b/frontend/src/components/Game/AdminMenu/Base.vue
@@ -15,7 +15,7 @@ const heartbeat = storeHeartbeat();
     <v-list-item
       :disabled="!heartbeat.value.ANY_SOURCE_ENABLED"
       :title="!heartbeat.value.ANY_SOURCE_ENABLED ? 'No metadata source enabled' : ''"
-      @click="emitter?.emit('showSearchRomDialog', rom)"
+      @click="emitter?.emit('showMatchRomDialog', rom)"
       class="py-4 pr-5"
     >
       <v-list-item-title class="d-flex"
diff --git a/frontend/src/components/Settings/Config/ExclusionsCard.vue b/frontend/src/components/Settings/Config/ExclusionsCard.vue
index 63250279f..b5f62ee45 100644
--- a/frontend/src/components/Settings/Config/ExclusionsCard.vue
+++ b/frontend/src/components/Settings/Config/ExclusionsCard.vue
@@ -4,7 +4,6 @@ import storeAuth from "@/stores/auth";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
-import CreateExclusionDialog from "@/components/Dialog/Config/CreateExclusion.vue";
 
 // Props
 const emitter = inject<Emitter<Events>>("emitter");
@@ -220,8 +219,6 @@ const editable = ref(false);
       </v-row>
     </v-card-text>
   </v-card>
-
-  <create-exclusion-dialog />
 </template>
 
 <style scoped></style>
diff --git a/frontend/src/components/Settings/Config/PlatformBindingCard.vue b/frontend/src/components/Settings/Config/PlatformBindingCard.vue
index 96e087deb..6be665d21 100644
--- a/frontend/src/components/Settings/Config/PlatformBindingCard.vue
+++ b/frontend/src/components/Settings/Config/PlatformBindingCard.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import CreatePlatformBindingDialog from "@/components/Dialog/Config/CreatePlatformBinding.vue";
-import DeletePlatformBindingDialog from "@/components/Dialog/Config/DeletePlatformBinding.vue";
 import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
 import storeAuth from "@/stores/auth";
 import storeConfig from "@/stores/config";
@@ -121,9 +119,6 @@ const editable = ref(false);
       </v-row>
     </v-card-text>
   </v-card>
-
-  <create-platform-binding-dialog />
-  <delete-platform-binding-dialog />
 </template>
 
 <style scoped>
diff --git a/frontend/src/components/Settings/Config/PlatformVersionsCard.vue b/frontend/src/components/Settings/Config/PlatformVersionsCard.vue
index d71e912ee..4f4794fe6 100644
--- a/frontend/src/components/Settings/Config/PlatformVersionsCard.vue
+++ b/frontend/src/components/Settings/Config/PlatformVersionsCard.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import CreatePlatformVersionDialog from "@/components/Dialog/Config/CreatePlatformVersion.vue";
-import DeletePlatformVersionDialog from "@/components/Dialog/Config/DeletePlatformVersion.vue";
 import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
 import storeAuth from "@/stores/auth";
 import storeConfig from "@/stores/config";
@@ -121,9 +119,6 @@ const editable = ref(false);
       </v-row>
     </v-card-text>
   </v-card>
-
-  <create-platform-version-dialog />
-  <delete-platform-version-dialog />
 </template>
 
 <style scoped>
diff --git a/frontend/src/types/emitter.d.ts b/frontend/src/types/emitter.d.ts
index 6fd2fb227..429c83dc2 100644
--- a/frontend/src/types/emitter.d.ts
+++ b/frontend/src/types/emitter.d.ts
@@ -17,8 +17,8 @@ export type SnackbarStatus = {
 
 export type Events = {
   showDeletePlatformDialog: Platform;
-  showSearchRomDialog: Rom;
-  showSearchRomGlobalDialog: null;
+  showMatchRomDialog: Rom;
+  showSearchRomDialog: null;
   showEditRomDialog: Rom;
   showDeleteRomDialog: Rom[];
   showUploadRomDialog: Platform | null;
diff --git a/frontend/src/views/Details/Base.vue b/frontend/src/views/Details/Base.vue
index 186ec61bb..5ce3bc9c9 100644
--- a/frontend/src/views/Details/Base.vue
+++ b/frontend/src/views/Details/Base.vue
@@ -10,11 +10,6 @@ import RelatedGames from "@/components/Details/RelatedGames.vue";
 import Saves from "@/components/Details/Saves.vue";
 import States from "@/components/Details/States.vue";
 import TitleInfo from "@/components/Details/Title.vue";
-import DeleteAssetDialog from "@/components/Dialog/Asset/DeleteAssets.vue";
-import LoadingDialog from "@/components/Dialog/Loading.vue";
-import DeleteRomDialog from "@/components/Dialog/Rom/DeleteRom.vue";
-import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
-import SearchRomDialog from "@/components/Dialog/Rom/SearchRom.vue";
 import platformApi from "@/services/api/platform";
 import romApi from "@/services/api/rom";
 import storeDownload from "@/stores/download";
@@ -269,12 +264,6 @@ watch(
       </template>
     </v-row>
   </template>
-
-  <search-rom-dialog />
-  <edit-rom-dialog />
-  <delete-rom-dialog />
-  <loading-dialog />
-  <delete-asset-dialog />
 </template>
 
 <style scoped>
diff --git a/frontend/src/views/Gallery/Base.vue b/frontend/src/views/Gallery/Base.vue
index 559e8e3d5..ba72035a9 100644
--- a/frontend/src/views/Gallery/Base.vue
+++ b/frontend/src/views/Gallery/Base.vue
@@ -1,10 +1,4 @@
 <script setup lang="ts">
-import LoadingDialog from "@/components/Dialog/Loading.vue";
-import DeletePlatformDialog from "@/components/Dialog/Platform/DeletePlatform.vue";
-import DeleteRomDialog from "@/components/Dialog/Rom/DeleteRom.vue";
-import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
-import SearchRomDialog from "@/components/Dialog/Rom/SearchRom.vue";
-import UploadRomDialog from "@/components/Dialog/Rom/UploadRom.vue";
 import GalleryAppBar from "@/components/Gallery/AppBar/Base.vue";
 import FabMenu from "@/components/Gallery/FabMenu/Base.vue";
 import GameCard from "@/components/Game/Card/Base.vue";
@@ -313,14 +307,6 @@ onBeforeRouteUpdate(async (to, _) => {
       </v-menu>
     </div>
   </v-layout-item>
-
-  <delete-platform-dialog />
-
-  <search-rom-dialog />
-  <upload-rom-dialog />
-  <edit-rom-dialog />
-  <delete-rom-dialog />
-  <loading-dialog />
 </template>
 
 <style scoped>
diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue
index 786ec3b2f..d749f3382 100644
--- a/frontend/src/views/Home.vue
+++ b/frontend/src/views/Home.vue
@@ -1,5 +1,22 @@
 <script setup lang="ts">
 import AppBar from "@/components/AppBar/Base.vue";
+import DeleteAssetDialog from "@/components/Dialog/Asset/DeleteAssets.vue";
+import CreateExclusionDialog from "@/components/Dialog/Config/CreateExclusion.vue";
+import CreatePlatformBindingDialog from "@/components/Dialog/Config/CreatePlatformBinding.vue";
+import CreatePlatformVersionDialog from "@/components/Dialog/Config/CreatePlatformVersion.vue";
+import DeletePlatformBindingDialog from "@/components/Dialog/Config/DeletePlatformBinding.vue";
+import DeletePlatformVersionDialog from "@/components/Dialog/Config/DeletePlatformVersion.vue";
+import LoadingDialog from "@/components/Dialog/Loading.vue";
+import AddPlatformDialog from "@/components/Dialog/Platform/AddPlatform.vue";
+import DeletePlatformDialog from "@/components/Dialog/Platform/DeletePlatform.vue";
+import DeleteRomDialog from "@/components/Dialog/Rom/DeleteRom.vue";
+import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
+import MatchRomDialog from "@/components/Dialog/Rom/MatchRom.vue";
+import SearchRomDialog from "@/components/Dialog/Rom/SearchRom.vue";
+import UploadRomDialog from "@/components/Dialog/Rom/UploadRom.vue";
+import CreateUserDialog from "@/components/Dialog/User/CreateUser.vue";
+import DeleteUserDialog from "@/components/Dialog/User/DeleteUser.vue";
+import EditUserDialog from "@/components/Dialog/User/EditUser.vue";
 import Drawer from "@/components/Drawer/Base.vue";
 import platformApi from "@/services/api/platform";
 import userApi from "@/services/api/user";
@@ -62,6 +79,24 @@ onMounted(() => {
   <drawer />
   <app-bar v-if="mdAndDown" />
   <router-view :key="refreshView" />
+
+  <add-platform-dialog />
+  <delete-platform-dialog />
+  <search-rom-dialog />
+  <match-rom-dialog />
+  <upload-rom-dialog />
+  <edit-rom-dialog />
+  <delete-rom-dialog />
+  <delete-asset-dialog />
+  <create-platform-binding-dialog />
+  <delete-platform-binding-dialog />
+  <create-platform-version-dialog />
+  <delete-platform-version-dialog />
+  <create-exclusion-dialog />
+  <create-user-dialog />
+  <edit-user-dialog />
+  <delete-user-dialog />
+  <loading-dialog />
 </template>
 
 <style scoped>
diff --git a/frontend/src/views/Settings/ControlPanel/Users/Base.vue b/frontend/src/views/Settings/ControlPanel/Users/Base.vue
index 31e57e05a..2d99dc09e 100644
--- a/frontend/src/views/Settings/ControlPanel/Users/Base.vue
+++ b/frontend/src/views/Settings/ControlPanel/Users/Base.vue
@@ -1,17 +1,12 @@
 <script setup lang="ts">
-import type { Events } from "@/types/emitter";
-import type { Emitter } from "mitt";
-import { inject, onMounted, ref } from "vue";
-import { VDataTable } from "vuetify/labs/VDataTable";
-
-import CreateUserDialog from "@/components/Dialog/User/CreateUser.vue";
-import DeleteUserDialog from "@/components/Dialog/User/DeleteUser.vue";
-import EditUserDialog from "@/components/Dialog/User/EditUser.vue";
 import userApi from "@/services/api/user";
 import storeAuth from "@/stores/auth";
 import storeUsers from "@/stores/users";
-import type { UserItem } from "@/types/emitter";
+import type { Events, UserItem } from "@/types/emitter";
 import { defaultAvatarPath, formatTimestamp } from "@/utils";
+import type { Emitter } from "mitt";
+import { inject, onMounted, ref } from "vue";
+import { VDataTable } from "vuetify/labs/VDataTable";
 
 const HEADERS = [
   {
@@ -168,9 +163,5 @@ onMounted(() => {
         </template>
       </v-data-table>
     </v-card-text>
-
-    <create-user-dialog />
-    <edit-user-dialog />
-    <delete-user-dialog />
   </v-card>
 </template>

From 7a7ccd9c6a9e842a5310233dba2fdd3891f3c9c1 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 00:25:10 +0200
Subject: [PATCH 36/61] upload roms dialog revamped

---
 .../src/components/Dialog/Rom/UploadRom.vue   | 108 ++++++++++--------
 1 file changed, 58 insertions(+), 50 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 48c36b1f3..7d6483497 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -31,14 +31,13 @@ async function uploadRoms() {
   if (!platform.value) return;
   show.value = false;
   scanningStore.set(true);
-  const platformId = platform.value.id
+  const platformId = platform.value.id;
   emitter?.emit("snackbarShow", {
     msg: `Uploading ${romsToUpload.value.length} roms to ${platform.value.name}...`,
     icon: "mdi-loading mdi-spin",
     color: "romm-accent-1",
   });
 
-
   await romApi
     .uploadRoms({
       romsToUpload: romsToUpload.value,
@@ -133,38 +132,66 @@ function closeDialog() {
           </v-col>
         </v-row>
       </v-toolbar>
+
       <v-divider class="border-opacity-25" :thickness="1" />
 
-      <v-card-text class="my-4 py-0">
-        <v-select
-          label="Platform"
-          item-title="name"
-          v-model="platform"
-          :items="platforms.value"
-          variant="outlined"
-          rounded="0"
-          density="comfortable"
-          prepend-inner-icon="mdi-controller"
-          prepend-icon=""
-          return-object
-          clearable
-          hide-details
-        >
-          <template v-slot:item="{ props, item }">
-            <v-list-item
-              class="py-2"
-              v-bind="props"
-              :title="item.raw.name ?? ''"
+      <v-toolbar density="compact" class="bg-primary">
+        <v-row class="align-center" no-gutters>
+          <v-col cols="9">
+            <v-select
+              label="Platform"
+              item-title="name"
+              v-model="platform"
+              :items="platforms.value"
+              prepend-inner-icon="mdi-controller"
+              prepend-icon=""
+              return-object
+              clearable
+              hide-details
             >
-              <template v-slot:prepend>
-                <v-avatar :rounded="0" size="35">
-                  <platform-icon :key="item.raw.slug" :slug="item.raw.slug" />
-                </v-avatar>
+              <template v-slot:item="{ props, item }">
+                <v-list-item
+                  class="py-2"
+                  v-bind="props"
+                  :title="item.raw.name ?? ''"
+                >
+                  <template v-slot:prepend>
+                    <v-avatar :rounded="0" size="35">
+                      <platform-icon
+                        :key="item.raw.slug"
+                        :slug="item.raw.slug"
+                      />
+                    </v-avatar>
+                  </template>
+                </v-list-item>
               </template>
-            </v-list-item>
-          </template>
-        </v-select>
-      </v-card-text>
+            </v-select>
+          </v-col>
+          <v-col cols="3">
+            <v-btn
+              block
+              icon=""
+              class="text-romm-accent-1 bg-terciary"
+              rounded="0"
+              variant="text"
+              @click="triggerFileInput"
+            >
+              <v-icon class="mr-2">mdi-plus</v-icon>Add roms
+            </v-btn>
+            <v-file-input
+              class="file-input"
+              id="file-input"
+              @keyup.enter="uploadRoms()"
+              v-model="romsToUpload"
+              multiple
+              required
+            />
+          </v-col>
+        </v-row>
+      </v-toolbar>
+
+      <v-divider class="border-opacity-25" :thickness="1" />
+
       <v-card-text
         v-if="romsToUpload.length > 0"
         class="scroll bg-terciary py-2 px-8"
@@ -179,26 +206,7 @@ function closeDialog() {
           </v-col>
         </v-row>
       </v-card-text>
-      <v-card-text class="mt-4 py-0">
-        <v-btn
-          size="large"
-          block
-          prepend-icon="mdi-plus"
-          variant="outlined"
-          class="text-romm-accent-1"
-          @click="triggerFileInput"
-        >
-          Add games
-        </v-btn>
-        <v-file-input
-          class="file-input"
-          id="file-input"
-          @keyup.enter="uploadRoms()"
-          v-model="romsToUpload"
-          multiple
-          required
-        />
-      </v-card-text>
+
       <v-card-text class="my-4 py-0">
         <v-row class="justify-center px-2" no-gutters>
           <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>

From 3d78f4e51d35bc471e0ca8195b5a1aa592f81286 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 12:42:46 +0200
Subject: [PATCH 37/61] scan platform after creating it

---
 backend/handler/fs_handler/fs_platforms_handler.py  | 13 ++++++++++---
 .../src/components/Dialog/Platform/AddPlatform.vue  | 13 +++++++++++--
 2 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/backend/handler/fs_handler/fs_platforms_handler.py b/backend/handler/fs_handler/fs_platforms_handler.py
index 5b598341a..e7d185065 100644
--- a/backend/handler/fs_handler/fs_platforms_handler.py
+++ b/backend/handler/fs_handler/fs_platforms_handler.py
@@ -1,8 +1,13 @@
 import os
+from pathlib import Path
 
 from config import LIBRARY_BASE_PATH
-from config.config_manager import config_manager as cm, Config
-from exceptions.fs_exceptions import FolderStructureNotMatchException, PlatformAlreadyExistsException
+from config.config_manager import Config
+from config.config_manager import config_manager as cm
+from exceptions.fs_exceptions import (
+    FolderStructureNotMatchException,
+    PlatformAlreadyExistsException,
+)
 from handler.fs_handler import FSHandler
 
 
@@ -23,7 +28,9 @@ def add_platforms(self, fs_slug: str) -> None:
             (
                 os.mkdir(f"{cnfg.HIGH_PRIO_STRUCTURE_PATH}/{fs_slug}")
                 if os.path.exists(cnfg.HIGH_PRIO_STRUCTURE_PATH)
-                else os.mkdir(f"{LIBRARY_BASE_PATH}/{fs_slug}/roms")
+                else Path(os.path.join(LIBRARY_BASE_PATH, fs_slug, "roms")).mkdir(
+                    parents=True
+                )
             )
         except FileExistsError:
             raise PlatformAlreadyExistsException(fs_slug)
diff --git a/frontend/src/components/Dialog/Platform/AddPlatform.vue b/frontend/src/components/Dialog/Platform/AddPlatform.vue
index 888e927ab..03a4f4b43 100644
--- a/frontend/src/components/Dialog/Platform/AddPlatform.vue
+++ b/frontend/src/components/Dialog/Platform/AddPlatform.vue
@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import platformApi from "@/services/api/platform";
+import socket from "@/services/socket";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, onBeforeUnmount, ref } from "vue";
-import platformApi from "@/services/api/platform";
 
 // Props
 const show = ref(false);
@@ -19,11 +20,19 @@ function addPlatform() {
     .uploadPlatform({ fsSlug: fsSlugToCreate.value })
     .then(() => {
       emitter?.emit("snackbarShow", {
-        msg: `Platform ${fsSlugToCreate.value} created successfully!`,
+        msg: `Platform ${fsSlugToCreate.value} created successfully! Starting scan...`,
         icon: "mdi-check-bold",
         color: "green",
         timeout: 2000,
       });
+
+      if (!socket.connected) socket.connect();
+      setTimeout(() => {
+        socket.emit("scan", {
+          platforms: [],
+          type: "new_platforms",
+        });
+      }, 2000);
       closeDialog();
     })
     .catch((error) => {

From c099f8284281c5093421c28c7362e4f6d058cd8a Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 12:58:03 +0200
Subject: [PATCH 38/61] improved add platform and upload roms dialogs

---
 .../Dialog/Platform/AddPlatform.vue           |  5 ++--
 .../src/components/Dialog/Rom/UploadRom.vue   | 25 ++++++++++++++++---
 2 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/Dialog/Platform/AddPlatform.vue b/frontend/src/components/Dialog/Platform/AddPlatform.vue
index 03a4f4b43..2877ac95b 100644
--- a/frontend/src/components/Dialog/Platform/AddPlatform.vue
+++ b/frontend/src/components/Dialog/Platform/AddPlatform.vue
@@ -7,7 +7,7 @@ import { inject, onBeforeUnmount, ref } from "vue";
 
 // Props
 const show = ref(false);
-const fsSlugToCreate = ref();
+const fsSlugToCreate = ref<string>("");
 const slugToCreate = ref();
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showAddPlatformDialog", () => {
@@ -50,7 +50,7 @@ function addPlatform() {
 
 function closeDialog() {
   show.value = false;
-  fsSlugToCreate.value = null;
+  fsSlugToCreate.value = "";
 }
 
 onBeforeUnmount(() => {
@@ -105,6 +105,7 @@ onBeforeUnmount(() => {
           <v-btn
             @click="addPlatform()"
             class="text-romm-green bg-terciary ml-5"
+            :disabled="fsSlugToCreate == ''"
           >
             Confirm
           </v-btn>
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 7d6483497..419ec40b2 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -89,6 +89,10 @@ function triggerFileInput() {
   fileInput?.click();
 }
 
+function removeRomFromList(romName: string) {
+  romsToUpload.value = romsToUpload.value.filter((rom) => rom.name !== romName);
+}
+
 function closeDialog() {
   show.value = false;
   romsToUpload.value = [];
@@ -196,21 +200,36 @@ function closeDialog() {
         v-if="romsToUpload.length > 0"
         class="scroll bg-terciary py-2 px-8"
       >
-        <v-row v-for="rom in romsToUpload" class="py-2" no-gutters>
-          <v-col cols="9" lg="10">
+        <v-row v-for="rom in romsToUpload" class="py-2 align-center" no-gutters>
+          <v-col cols="8" lg="9">
             {{ rom.name }}
           </v-col>
           <v-col cols="3" lg="2">
             [<span class="text-romm-accent-1">{{ formatBytes(rom.size) }}</span
             >]
           </v-col>
+          <v-col cols="1"
+            ><v-btn
+              @click="removeRomFromList(rom.name)"
+              icon
+              size="x-small"
+              rounded="0"
+              variant="text"
+              class="pa-0 ma-0"
+              ><v-icon class="text-romm-red">mdi-delete</v-icon></v-btn
+            ></v-col
+          >
         </v-row>
       </v-card-text>
 
       <v-card-text class="my-4 py-0">
         <v-row class="justify-center px-2" no-gutters>
           <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>
-          <v-btn @click="uploadRoms()" class="text-romm-green ml-5 bg-terciary">
+          <v-btn
+            @click="uploadRoms()"
+            class="text-romm-green ml-5 bg-terciary"
+            :disabled="romsToUpload.length == 0 || platform == null"
+          >
             Upload
           </v-btn>
         </v-row>

From 9e43e14faea886113fb2432e49efa25f08cb8d9b Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 13:10:55 +0200
Subject: [PATCH 39/61] fixed loading dialog

---
 frontend/src/views/Details/Base.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/src/views/Details/Base.vue b/frontend/src/views/Details/Base.vue
index 5ce3bc9c9..03b0ce890 100644
--- a/frontend/src/views/Details/Base.vue
+++ b/frontend/src/views/Details/Base.vue
@@ -93,7 +93,6 @@ onBeforeMount(async () => {
 watch(
   () => route.fullPath,
   async () => {
-    emitter?.emit("showLoadingDialog", { loading: true, scrim: false });
     await fetchDetails();
   }
 );

From b122e93db247eefbe73c11fcace6e2ddcbe1e3f7 Mon Sep 17 00:00:00 2001
From: Zurdi <34356590+zurdi15@users.noreply.github.com>
Date: Tue, 9 Apr 2024 13:48:29 +0200
Subject: [PATCH 40/61] remove unused code

---
 backend/endpoints/platform.py | 2 --
 1 file changed, 2 deletions(-)

diff --git a/backend/endpoints/platform.py b/backend/endpoints/platform.py
index a03ed4fa1..3b2635ce5 100644
--- a/backend/endpoints/platform.py
+++ b/backend/endpoints/platform.py
@@ -29,8 +29,6 @@ async def add_platforms(request: Request) -> MessageResponse:
         raise HTTPException(
             status_code=status.HTTP_500_INTERNAL_SERVER_ERROR, detail=str(e)
         )
-    # platform = igdb_handler.get_platform(fs_slug)
-    # db_platform_handler.add_platform(platform=platform)
     return {"msg": f"Platform created successfully!"}
 
 

From 680e6809b9a05452eaec411649616435717767b4 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 16:26:26 +0200
Subject: [PATCH 41/61] improved scan logs

---
 frontend/src/views/Library/Scan/Base.vue | 55 +++++++++++-------------
 1 file changed, 26 insertions(+), 29 deletions(-)

diff --git a/frontend/src/views/Library/Scan/Base.vue b/frontend/src/views/Library/Scan/Base.vue
index d63430ed9..2b8dfd355 100644
--- a/frontend/src/views/Library/Scan/Base.vue
+++ b/frontend/src/views/Library/Scan/Base.vue
@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import { computed, ref, watch } from "vue";
-import { storeToRefs } from "pinia";
 import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
 import socket from "@/services/socket";
 import storeHeartbeat from "@/stores/heartbeat";
 import storePlatforms, { type Platform } from "@/stores/platforms";
 import storeScanning from "@/stores/scanning";
+import { storeToRefs } from "pinia";
+import { computed, ref, watch } from "vue";
 import { useDisplay } from "vuetify";
 
 // Props
@@ -263,36 +263,33 @@ watch(metadataOptions, (newOptions) => {
   </div>
 
   <!-- Scan stats -->
-  <v-row class="pa-4 align-center" no-gutters v-if="!scanning">
-    <v-col>
-      <v-chip
-        v-if="scanningPlatforms.length > 0"
-        color="romm-accent-1"
-        text-color="white"
-        class="mr-2"
-      >
-        <v-icon left>mdi-information</v-icon>&nbsp; Platforms:
-        {{ scanStats.scanned_platforms }} scanned, with
-        {{ scanStats.added_platforms }} new and
-        {{ scanStats.metadata_platforms }} identified
-      </v-chip>
-      <v-chip
-        v-if="scanningPlatforms.length > 0"
-        color="romm-accent-1"
-        text-color="white"
-        class="mr-2"
-      >
-        <v-icon left>mdi-information</v-icon>&nbsp; Roms:
-        {{ scanStats.scanned_roms }} scanned, with
-        {{ scanStats.added_roms }} new and
-        {{ scanStats.metadata_roms }} identified
-      </v-chip>
-    </v-col>
-  </v-row>
+  <v-bottom-navigation :elevation="0" height="40" class="text-caption">
+    <v-chip
+      v-if="scanningPlatforms.length > 0"
+      color="romm-accent-1"
+      text-color="white"
+      class="mr-2 my-1"
+    >
+      <v-icon left>mdi-information</v-icon>&nbsp; Platforms:
+      {{ scanningPlatforms.length }} scanned, with
+      {{ scanStats.added_platforms }} new and
+      {{ scanStats.metadata_platforms }} identified
+    </v-chip>
+    <v-chip
+      v-if="scanningPlatforms.length > 0"
+      color="romm-accent-1"
+      text-color="white"
+      class="my-1"
+    >
+      <v-icon left>mdi-information</v-icon>&nbsp; Roms:
+      {{ scanStats.scanned_roms }} scanned, with {{ scanStats.added_roms }} new
+      and {{ scanStats.metadata_roms }} identified
+    </v-chip>
+  </v-bottom-navigation>
 </template>
 
 <style scoped>
 .scan-log {
-  max-height: calc(100vh - 245px);
+  max-height: calc(100vh - 200px);
 }
 </style>

From 1128ccba783bd7c237f1675006ad47e6487feb95 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 17:06:05 +0200
Subject: [PATCH 42/61] upload roms dialog responsive

---
 frontend/src/components/Dialog/Rom/UploadRom.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 419ec40b2..d0da4ef4c 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -141,7 +141,7 @@ function closeDialog() {
 
       <v-toolbar density="compact" class="bg-primary">
         <v-row class="align-center" no-gutters>
-          <v-col cols="9">
+          <v-col cols="7" sm="8" md="8" lg="9">
             <v-select
               label="Platform"
               item-title="name"
@@ -171,7 +171,7 @@ function closeDialog() {
               </template>
             </v-select>
           </v-col>
-          <v-col cols="3">
+          <v-col>
             <v-btn
               block
               icon=""

From e9264bac79d2711d013f4c0a35cc28dd2d1dfd8b Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Tue, 9 Apr 2024 17:43:10 +0200
Subject: [PATCH 43/61] new dialogs responsiveness improvement

---
 .../src/components/Dialog/Rom/SearchRom.vue   | 46 +++++++++++++++----
 .../src/components/Dialog/Rom/UploadRom.vue   |  5 +-
 2 files changed, 41 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/SearchRom.vue b/frontend/src/components/Dialog/Rom/SearchRom.vue
index eead57557..f908ee026 100644
--- a/frontend/src/components/Dialog/Rom/SearchRom.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRom.vue
@@ -133,7 +133,7 @@ onBeforeUnmount(() => {
 
       <v-toolbar density="compact" class="bg-primary">
         <v-row class="align-center" no-gutters>
-          <v-col cols="6" xs="6" sm="6" md="6" lg="7">
+          <v-col cols="12" sm="5" md="6" lg="7">
             <v-text-field
               autofocus
               id="search-text-field"
@@ -146,7 +146,39 @@ onBeforeUnmount(() => {
               clearable
             />
           </v-col>
-          <v-col cols="4" xs="4" sm="5" md="5" lg="4">
+          <template v-if="!xs">
+            <v-col sm="5" lg="4">
+              <v-select
+                @click:clear="clearFilter"
+                clearable
+                label="Platform"
+                class="bg-terciary"
+                hide-details
+                v-model="selectedPlatform"
+                @update:model-value="filterRoms"
+                :items="platforms"
+              >
+              </v-select>
+            </v-col>
+            <v-col sm="2" md="1">
+              <v-btn
+                type="submit"
+                @click="searchRoms"
+                class="bg-terciary"
+                rounded="0"
+                variant="text"
+                icon="mdi-magnify"
+                block
+                :disabled="searching"
+              />
+            </v-col>
+          </template>
+        </v-row>
+      </v-toolbar>
+
+      <v-toolbar v-if="xs" density="compact" class="bg-primary">
+        <v-row class="align-center" no-gutters>
+          <v-col cols="10">
             <v-select
               @click:clear="clearFilter"
               clearable
@@ -159,7 +191,7 @@ onBeforeUnmount(() => {
             >
             </v-select>
           </v-col>
-          <v-col cols="2" xs="2" sm="1" md="1" lg="1">
+          <v-col cols="2">
             <v-btn
               type="submit"
               @click="searchRoms"
@@ -200,10 +232,8 @@ onBeforeUnmount(() => {
           <v-col
             class="pa-1"
             cols="4"
-            sm="2"
+            sm="3"
             md="2"
-            lg="2"
-            xl="2"
             v-show="!searching"
             v-for="rom in filteredRoms"
           >
@@ -346,12 +376,12 @@ onBeforeUnmount(() => {
 
 .search-content-tablet {
   width: 75vw;
-  height: 640px;
+  height: 775px;
 }
 
 .search-content-mobile {
   width: 85vw;
-  height: 640px;
+  height: 775px;
 }
 .matched-rom {
   transition-property: all;
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index d0da4ef4c..cfe6d1235 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -141,7 +141,7 @@ function closeDialog() {
 
       <v-toolbar density="compact" class="bg-primary">
         <v-row class="align-center" no-gutters>
-          <v-col cols="7" sm="8" md="8" lg="9">
+          <v-col cols="10" sm="8" lg="9">
             <v-select
               label="Platform"
               item-title="name"
@@ -180,7 +180,8 @@ function closeDialog() {
               variant="text"
               @click="triggerFileInput"
             >
-              <v-icon class="mr-2">mdi-plus</v-icon>Add roms
+              <v-icon :class="{ 'mr-2': !xs }">mdi-plus</v-icon
+              ><span v-if="!xs">Add roms</span>
             </v-btn>
             <v-file-input
               class="file-input"

From c8db7681d300513f858d4d23e0fb36cdff12e21a Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Wed, 10 Apr 2024 22:45:59 +0200
Subject: [PATCH 44/61] added all supported platforms to upload rom dialog

---
 backend/endpoints/platform.py                 | 30 ++++++++++-
 backend/endpoints/responses/platform.py       |  4 +-
 .../__generated__/models/PlatformSchema.ts    |  2 +-
 .../src/components/Dialog/Rom/UploadRom.vue   | 51 +++++++++++++------
 frontend/src/services/api/platform.ts         |  5 ++
 frontend/src/views/Library/Scan/Base.vue      |  4 +-
 6 files changed, 75 insertions(+), 21 deletions(-)

diff --git a/backend/endpoints/platform.py b/backend/endpoints/platform.py
index 3b2635ce5..f425a776c 100644
--- a/backend/endpoints/platform.py
+++ b/backend/endpoints/platform.py
@@ -3,7 +3,8 @@
 from endpoints.responses.platform import PlatformSchema
 from exceptions.fs_exceptions import PlatformAlreadyExistsException
 from fastapi import APIRouter, HTTPException, Request, status
-from handler import db_platform_handler, igdb_handler, fs_platform_handler
+from handler import db_platform_handler, fs_platform_handler
+from handler.metadata_handler.igdb_handler import IGDB_PLATFORM_LIST
 from logger.logger import log
 
 router = APIRouter()
@@ -47,6 +48,33 @@ def get_platforms(request: Request) -> list[PlatformSchema]:
     return db_platform_handler.get_platforms()
 
 
+@protected_route(router.get, "/platforms/supported", ["platforms.read"])
+def get_supported_platforms(request: Request) -> list[PlatformSchema]:
+    """Get list of supported platforms endpoint
+
+    Args:
+        request (Request): Fastapi Request object
+
+    Returns:
+        list[PlatformSchema]: List of supported platforms
+    """
+
+    supported_platforms = []
+    db_platforms: list = db_platform_handler.get_platforms()
+    # This double loop probably can be done better
+    for platform in IGDB_PLATFORM_LIST:
+        platform["id"] = -1
+        for p in db_platforms:
+            if p.name == platform["name"]:
+                platform["id"] = p.id
+        platform["fs_slug"] = platform["slug"]
+        platform["logo_path"] = ""
+        platform["roms"] = []
+        platform["rom_count"] = 0
+        supported_platforms.append(PlatformSchema.model_validate(platform).model_dump())
+    return supported_platforms
+
+
 @protected_route(router.get, "/platforms/{id}", ["platforms.read"])
 def get_platform(request: Request, id: int) -> PlatformSchema:
     """Get platforms endpoint
diff --git a/backend/endpoints/responses/platform.py b/backend/endpoints/responses/platform.py
index 1cab5492e..e6f1b8ebf 100644
--- a/backend/endpoints/responses/platform.py
+++ b/backend/endpoints/responses/platform.py
@@ -10,8 +10,8 @@ class PlatformSchema(BaseModel):
     igdb_id: Optional[int] = None
     sgdb_id: Optional[int] = None
     moby_id: Optional[int] = None
-    name: Optional[str]
-    logo_path: str
+    name: str
+    logo_path: Optional[str] = ""
     rom_count: int
 
     class Config:
diff --git a/frontend/src/__generated__/models/PlatformSchema.ts b/frontend/src/__generated__/models/PlatformSchema.ts
index b952cc95f..efe93f9ca 100644
--- a/frontend/src/__generated__/models/PlatformSchema.ts
+++ b/frontend/src/__generated__/models/PlatformSchema.ts
@@ -10,7 +10,7 @@ export type PlatformSchema = {
     igdb_id?: (number | null);
     sgdb_id?: (number | null);
     moby_id?: (number | null);
-    name: (string | null);
+    name: string;
     logo_path: string;
     rom_count: number;
 };
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index cfe6d1235..79658786e 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -2,38 +2,39 @@
 import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
 import romApi from "@/services/api/rom";
 import socket from "@/services/socket";
-import storePlatforms, { type Platform } from "@/stores/platforms";
+import { type Platform } from "@/stores/platforms";
 import storeScanning from "@/stores/scanning";
 import type { Events } from "@/types/emitter";
 import { formatBytes } from "@/utils";
 import type { Emitter } from "mitt";
-import { inject, ref } from "vue";
+import { inject, ref, onMounted } from "vue";
 import { useDisplay } from "vuetify";
+import platformApi from "@/services/api/platform";
 
 // Props
 const { xs, mdAndDown, lgAndUp } = useDisplay();
 const show = ref(false);
 const romsToUpload = ref<File[]>([]);
 const scanningStore = storeScanning();
-const platform = ref<Platform | null>(null);
-const platforms = storePlatforms();
+const selectedPlatform = ref<Platform | null>(null);
+const supportedPlatforms = ref<Platform[]>();
 
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
   if (platformWhereUpload) {
-    platform.value = platformWhereUpload;
+    selectedPlatform.value = platformWhereUpload;
   }
   show.value = true;
 });
 
 // Functions
 async function uploadRoms() {
-  if (!platform.value) return;
+  if (!selectedPlatform.value) return;
   show.value = false;
   scanningStore.set(true);
-  const platformId = platform.value.id;
+  const platformId = selectedPlatform.value.id;
   emitter?.emit("snackbarShow", {
-    msg: `Uploading ${romsToUpload.value.length} roms to ${platform.value.name}...`,
+    msg: `Uploading ${romsToUpload.value.length} roms to ${selectedPlatform.value.name}...`,
     icon: "mdi-loading mdi-spin",
     color: "romm-accent-1",
   });
@@ -81,7 +82,7 @@ async function uploadRoms() {
       });
     });
   romsToUpload.value = [];
-  platform.value = null;
+  selectedPlatform.value = null;
 }
 
 function triggerFileInput() {
@@ -96,8 +97,28 @@ function removeRomFromList(romName: string) {
 function closeDialog() {
   show.value = false;
   romsToUpload.value = [];
-  platform.value = null;
+  selectedPlatform.value = null;
 }
+
+onMounted(() => {
+  platformApi
+    .getSupportedPlatforms()
+    .then(({ data }) => {
+      supportedPlatforms.value = data.sort((a, b) => {
+        return a.name.localeCompare(b.name);
+      });
+    })
+    .catch(({ response, message }) => {
+      emitter?.emit("snackbarShow", {
+        msg: `Unable to upload roms: ${
+          response?.data?.detail || response?.statusText || message
+        }`,
+        icon: "mdi-close-circle",
+        color: "red",
+        timeout: 4000,
+      });
+    });
+});
 </script>
 
 <template>
@@ -142,11 +163,11 @@ function closeDialog() {
       <v-toolbar density="compact" class="bg-primary">
         <v-row class="align-center" no-gutters>
           <v-col cols="10" sm="8" lg="9">
-            <v-select
+            <v-autocomplete
               label="Platform"
               item-title="name"
-              v-model="platform"
-              :items="platforms.value"
+              v-model="selectedPlatform"
+              :items="supportedPlatforms"
               prepend-inner-icon="mdi-controller"
               prepend-icon=""
               return-object
@@ -169,7 +190,7 @@ function closeDialog() {
                   </template>
                 </v-list-item>
               </template>
-            </v-select>
+            </v-autocomplete>
           </v-col>
           <v-col>
             <v-btn
@@ -229,7 +250,7 @@ function closeDialog() {
           <v-btn
             @click="uploadRoms()"
             class="text-romm-green ml-5 bg-terciary"
-            :disabled="romsToUpload.length == 0 || platform == null"
+            :disabled="romsToUpload.length == 0 || selectedPlatform == null"
           >
             Upload
           </v-btn>
diff --git a/frontend/src/services/api/platform.ts b/frontend/src/services/api/platform.ts
index d1e7af6e3..0ab6a041c 100644
--- a/frontend/src/services/api/platform.ts
+++ b/frontend/src/services/api/platform.ts
@@ -21,6 +21,10 @@ async function getPlatform(
   return api.get(`/platforms/${id}`);
 }
 
+async function getSupportedPlatforms(): Promise<{ data: PlatformSchema[] }> {
+  return api.get("/platforms/supported");
+}
+
 async function updatePlatform({
   platform,
 }: {
@@ -41,5 +45,6 @@ export default {
   uploadPlatform,
   getPlatforms,
   getPlatform,
+  getSupportedPlatforms,
   deletePlatform,
 };
diff --git a/frontend/src/views/Library/Scan/Base.vue b/frontend/src/views/Library/Scan/Base.vue
index 2b8dfd355..6cc82f718 100644
--- a/frontend/src/views/Library/Scan/Base.vue
+++ b/frontend/src/views/Library/Scan/Base.vue
@@ -93,7 +93,7 @@ watch(metadataOptions, (newOptions) => {
   <!-- Platform selector -->
   <v-row class="px-4 pt-4 align-center" no-gutters>
     <v-col cols="12" xs="12" sm="12" md="6" xl="6" class="pr-1">
-      <v-select
+      <v-autocomplete
         label="Platforms"
         item-title="name"
         v-model="platformsToScan"
@@ -116,7 +116,7 @@ watch(metadataOptions, (newOptions) => {
             </template>
           </v-list-item>
         </template>
-      </v-select>
+      </v-autocomplete>
     </v-col>
     <v-col
       cols="12"

From 34ac7de0baa925ac7ccf4bf3b5044ea74cd83951 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 00:02:51 +0200
Subject: [PATCH 45/61] create platform when uploading roms if needed

---
 .../src/components/Dialog/Rom/UploadRom.vue   | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 79658786e..db7ad9d76 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -32,6 +32,42 @@ async function uploadRoms() {
   if (!selectedPlatform.value) return;
   show.value = false;
   scanningStore.set(true);
+
+  if (selectedPlatform.value.id == -1) {
+    await platformApi
+      .uploadPlatform({ fsSlug: selectedPlatform.value.fs_slug })
+      .then(() => {
+        emitter?.emit("snackbarShow", {
+          msg: `Platform ${selectedPlatform.value?.name} created successfully!`,
+          icon: "mdi-check-bold",
+          color: "green",
+          timeout: 2000,
+        });
+
+        if (!socket.connected) socket.connect();
+        setTimeout(() => {
+          socket.emit("scan", {
+            platforms: [],
+            type: "new_platforms",
+          });
+        }, 2000);
+      })
+      .catch((error) => {
+        console.log(error);
+        emitter?.emit("snackbarShow", {
+          msg: error.response.data.detail,
+          icon: "mdi-close-circle",
+          color: "red",
+        });
+        return;
+      })
+      .finally(() => {
+        emitter?.emit("showLoadingDialog", { loading: false, scrim: false });
+      });
+  }
+
+  // TODO: wait for platform to be created to get the id
+
   const platformId = selectedPlatform.value.id;
   emitter?.emit("snackbarShow", {
     msg: `Uploading ${romsToUpload.value.length} roms to ${selectedPlatform.value.name}...`,

From d3864ff02b1cb08ce04b3ee9fc7dc54c31a40ae6 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 01:39:58 +0200
Subject: [PATCH 46/61] create platform if not exists when adding roms fixed

---
 backend/endpoints/platform.py                 |  16 +--
 backend/exceptions/fs_exceptions.py           |   2 +-
 .../__generated__/models/PlatformSchema.ts    |   2 +-
 .../Dialog/Platform/AddPlatform.vue           | 118 ------------------
 .../src/components/Dialog/Rom/UploadRom.vue   |  72 ++++++-----
 frontend/src/components/Drawer/Base.vue       |  13 --
 .../src/components/Gallery/AppBar/ScanBtn.vue |  19 +++
 .../src/components/Gallery/FabMenu/Base.vue   |  27 +++-
 frontend/src/services/api/platform.ts         |   2 +-
 frontend/src/views/Home.vue                   |   2 -
 10 files changed, 91 insertions(+), 182 deletions(-)
 delete mode 100644 frontend/src/components/Dialog/Platform/AddPlatform.vue

diff --git a/backend/endpoints/platform.py b/backend/endpoints/platform.py
index f425a776c..fc92178ab 100644
--- a/backend/endpoints/platform.py
+++ b/backend/endpoints/platform.py
@@ -5,32 +5,32 @@
 from fastapi import APIRouter, HTTPException, Request, status
 from handler import db_platform_handler, fs_platform_handler
 from handler.metadata_handler.igdb_handler import IGDB_PLATFORM_LIST
+from handler.scan_handler import scan_platform
 from logger.logger import log
 
 router = APIRouter()
 
 
 @protected_route(router.post, "/platforms", ["platforms.write"])
-async def add_platforms(request: Request) -> MessageResponse:
+async def add_platforms(request: Request) -> PlatformSchema:
     """Create platform endpoint
 
     Args:
         request (Request): Fastapi Request object
 
     Returns:
-        MessageResponse: Standard message response
+        PlatformSchema: Just created platform
     """
 
     data = await request.json()
     fs_slug = data["fs_slug"]
     try:
         fs_platform_handler.add_platforms(fs_slug=fs_slug)
-    except PlatformAlreadyExistsException as e:
-        log.error(str(e))
-        raise HTTPException(
-            status_code=status.HTTP_500_INTERNAL_SERVER_ERROR, detail=str(e)
-        )
-    return {"msg": f"Platform created successfully!"}
+    except PlatformAlreadyExistsException:
+        log.info(f"Detected platform: {fs_slug}")
+    scanned_platform = scan_platform(fs_slug, [fs_slug])
+    platform = db_platform_handler.add_platform(scanned_platform)
+    return platform
 
 
 @protected_route(router.get, "/platforms", ["platforms.read"])
diff --git a/backend/exceptions/fs_exceptions.py b/backend/exceptions/fs_exceptions.py
index f66697886..3b0f636b3 100644
--- a/backend/exceptions/fs_exceptions.py
+++ b/backend/exceptions/fs_exceptions.py
@@ -21,7 +21,7 @@ def __repr__(self):
 
 class PlatformAlreadyExistsException(Exception):
     def __init__(self, fs_slug: str):
-        self.message = f"Can't create platform {fs_slug}: already exists"
+        self.message = f"Platform {fs_slug} already exists"
         super().__init__(self.message)
 
     def __repr__(self):
diff --git a/frontend/src/__generated__/models/PlatformSchema.ts b/frontend/src/__generated__/models/PlatformSchema.ts
index efe93f9ca..9847878be 100644
--- a/frontend/src/__generated__/models/PlatformSchema.ts
+++ b/frontend/src/__generated__/models/PlatformSchema.ts
@@ -11,7 +11,7 @@ export type PlatformSchema = {
     sgdb_id?: (number | null);
     moby_id?: (number | null);
     name: string;
-    logo_path: string;
+    logo_path?: (string | null);
     rom_count: number;
 };
 
diff --git a/frontend/src/components/Dialog/Platform/AddPlatform.vue b/frontend/src/components/Dialog/Platform/AddPlatform.vue
deleted file mode 100644
index 2877ac95b..000000000
--- a/frontend/src/components/Dialog/Platform/AddPlatform.vue
+++ /dev/null
@@ -1,118 +0,0 @@
-<script setup lang="ts">
-import platformApi from "@/services/api/platform";
-import socket from "@/services/socket";
-import type { Events } from "@/types/emitter";
-import type { Emitter } from "mitt";
-import { inject, onBeforeUnmount, ref } from "vue";
-
-// Props
-const show = ref(false);
-const fsSlugToCreate = ref<string>("");
-const slugToCreate = ref();
-const emitter = inject<Emitter<Events>>("emitter");
-emitter?.on("showAddPlatformDialog", () => {
-  show.value = true;
-});
-
-// Functions
-function addPlatform() {
-  platformApi
-    .uploadPlatform({ fsSlug: fsSlugToCreate.value })
-    .then(() => {
-      emitter?.emit("snackbarShow", {
-        msg: `Platform ${fsSlugToCreate.value} created successfully! Starting scan...`,
-        icon: "mdi-check-bold",
-        color: "green",
-        timeout: 2000,
-      });
-
-      if (!socket.connected) socket.connect();
-      setTimeout(() => {
-        socket.emit("scan", {
-          platforms: [],
-          type: "new_platforms",
-        });
-      }, 2000);
-      closeDialog();
-    })
-    .catch((error) => {
-      console.log(error);
-      emitter?.emit("snackbarShow", {
-        msg: error.response.data.detail,
-        icon: "mdi-close-circle",
-        color: "red",
-      });
-    })
-    .finally(() => {
-      emitter?.emit("showLoadingDialog", { loading: false, scrim: false });
-    });
-}
-
-function closeDialog() {
-  show.value = false;
-  fsSlugToCreate.value = "";
-}
-
-onBeforeUnmount(() => {
-  emitter?.off("showAddPlatformDialog");
-});
-</script>
-
-<template>
-  <v-dialog
-    :modelValue="show"
-    max-width="500px"
-    scroll-strategy="none"
-    :scrim="true"
-    @click:outside="closeDialog"
-    @keydown.esc="closeDialog"
-    no-click-animation
-    persistent
-  >
-    <v-card>
-      <v-toolbar density="compact" class="bg-terciary">
-        <v-row class="align-center" no-gutters>
-          <v-col cols="10">
-            <v-icon icon="mdi-controller" class="ml-5 mr-2" />
-          </v-col>
-          <v-col>
-            <v-btn
-              @click="closeDialog"
-              class="bg-terciary"
-              rounded="0"
-              variant="text"
-              icon="mdi-close"
-              block
-            />
-          </v-col>
-        </v-row>
-      </v-toolbar>
-      <v-divider class="border-opacity-25" :thickness="1" />
-
-      <v-card-text>
-        <v-row class="pa-2 align-center" no-gutters>
-          <v-text-field
-            @keyup.enter=""
-            v-model="fsSlugToCreate"
-            label="Platform name (folder name)"
-            variant="outlined"
-            required
-            hide-details
-          />
-        </v-row>
-        <v-row class="justify-center pa-2" no-gutters>
-          <v-btn @click="closeDialog" class="bg-terciary">Cancel</v-btn>
-          <v-btn
-            @click="addPlatform()"
-            class="text-romm-green bg-terciary ml-5"
-            :disabled="fsSlugToCreate == ''"
-          >
-            Confirm
-          </v-btn>
-        </v-row>
-      </v-card-text>
-    </v-card>
-  </v-dialog>
-</template>
-
-<style scoped></style>
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index db7ad9d76..ff14001ed 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -1,15 +1,16 @@
 <script setup lang="ts">
 import PlatformIcon from "@/components/Platform/PlatformIcon.vue";
+import platformApi from "@/services/api/platform";
 import romApi from "@/services/api/rom";
 import socket from "@/services/socket";
+import storeHeartbeat from "@/stores/heartbeat";
 import { type Platform } from "@/stores/platforms";
 import storeScanning from "@/stores/scanning";
 import type { Events } from "@/types/emitter";
 import { formatBytes } from "@/utils";
 import type { Emitter } from "mitt";
-import { inject, ref, onMounted } from "vue";
+import { computed, inject, ref } from "vue";
 import { useDisplay } from "vuetify";
-import platformApi from "@/services/api/platform";
 
 // Props
 const { xs, mdAndDown, lgAndUp } = useDisplay();
@@ -18,6 +19,22 @@ const romsToUpload = ref<File[]>([]);
 const scanningStore = storeScanning();
 const selectedPlatform = ref<Platform | null>(null);
 const supportedPlatforms = ref<Platform[]>();
+const heartbeat = storeHeartbeat();
+// Use a computed property to reactively update metadataOptions based on heartbeat
+const metadataOptions = computed(() => [
+  {
+    name: "IGDB",
+    value: "igdb",
+    disabled: !heartbeat.value.METADATA_SOURCES?.IGDB_API_ENABLED,
+  },
+  {
+    name: "MobyGames",
+    value: "moby",
+    disabled: !heartbeat.value.METADATA_SOURCES?.MOBY_API_ENABLED,
+  },
+]);
+// Use the computed metadataOptions to filter out disabled sources
+const metadataSources = ref(metadataOptions.value.filter((s) => !s.disabled));
 
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
@@ -25,6 +42,23 @@ emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
     selectedPlatform.value = platformWhereUpload;
   }
   show.value = true;
+  platformApi
+    .getSupportedPlatforms()
+    .then(({ data }) => {
+      supportedPlatforms.value = data.sort((a, b) => {
+        return a.name.localeCompare(b.name);
+      });
+    })
+    .catch(({ response, message }) => {
+      emitter?.emit("snackbarShow", {
+        msg: `Unable to upload roms: ${
+          response?.data?.detail || response?.statusText || message
+        }`,
+        icon: "mdi-close-circle",
+        color: "red",
+        timeout: 4000,
+      });
+    });
 });
 
 // Functions
@@ -36,21 +70,14 @@ async function uploadRoms() {
   if (selectedPlatform.value.id == -1) {
     await platformApi
       .uploadPlatform({ fsSlug: selectedPlatform.value.fs_slug })
-      .then(() => {
+      .then(({ data }) => {
         emitter?.emit("snackbarShow", {
           msg: `Platform ${selectedPlatform.value?.name} created successfully!`,
           icon: "mdi-check-bold",
           color: "green",
           timeout: 2000,
         });
-
-        if (!socket.connected) socket.connect();
-        setTimeout(() => {
-          socket.emit("scan", {
-            platforms: [],
-            type: "new_platforms",
-          });
-        }, 2000);
+        selectedPlatform.value = data;
       })
       .catch((error) => {
         console.log(error);
@@ -66,8 +93,6 @@ async function uploadRoms() {
       });
   }
 
-  // TODO: wait for platform to be created to get the id
-
   const platformId = selectedPlatform.value.id;
   emitter?.emit("snackbarShow", {
     msg: `Uploading ${romsToUpload.value.length} roms to ${selectedPlatform.value.name}...`,
@@ -104,6 +129,7 @@ async function uploadRoms() {
         socket.emit("scan", {
           platforms: [platformId],
           type: "quick",
+          apis: metadataSources.value.map((s) => s.value),
         });
       }, 2000);
     })
@@ -135,26 +161,6 @@ function closeDialog() {
   romsToUpload.value = [];
   selectedPlatform.value = null;
 }
-
-onMounted(() => {
-  platformApi
-    .getSupportedPlatforms()
-    .then(({ data }) => {
-      supportedPlatforms.value = data.sort((a, b) => {
-        return a.name.localeCompare(b.name);
-      });
-    })
-    .catch(({ response, message }) => {
-      emitter?.emit("snackbarShow", {
-        msg: `Unable to upload roms: ${
-          response?.data?.detail || response?.statusText || message
-        }`,
-        icon: "mdi-close-circle",
-        color: "red",
-        timeout: 4000,
-      });
-    });
-});
 </script>
 
 <template>
diff --git a/frontend/src/components/Drawer/Base.vue b/frontend/src/components/Drawer/Base.vue
index 550a2a05e..ad2a17233 100644
--- a/frontend/src/components/Drawer/Base.vue
+++ b/frontend/src/components/Drawer/Base.vue
@@ -102,19 +102,6 @@ emitter?.on("toggleDrawerRail", () => {
             >
           </template>
         </v-list-item>
-        <v-list-item
-          class="bg-terciary"
-          @click="emitter?.emit('showAddPlatformDialog', null)"
-        >
-          <span v-if="!rail" class="text-body-2 text-truncate"
-            >Add platform</span
-          >
-          <template v-slot:prepend>
-            <v-avatar :rounded="0" size="40"
-              ><v-icon>mdi-plus</v-icon></v-avatar
-            >
-          </template>
-        </v-list-item>
         <v-list-item
           class="bg-terciary"
           @click="emitter?.emit('showUploadRomDialog', null)"
diff --git a/frontend/src/components/Gallery/AppBar/ScanBtn.vue b/frontend/src/components/Gallery/AppBar/ScanBtn.vue
index c74ab0c2e..dc807c39e 100644
--- a/frontend/src/components/Gallery/AppBar/ScanBtn.vue
+++ b/frontend/src/components/Gallery/AppBar/ScanBtn.vue
@@ -1,11 +1,29 @@
 <script setup lang="ts">
 import socket from "@/services/socket";
+import storeHeartbeat from "@/stores/heartbeat";
 import storeRoms from "@/stores/roms";
 import storeScanning from "@/stores/scanning";
+import { computed, ref } from "vue";
 
 // Props
 const scanningStore = storeScanning();
 const romsStore = storeRoms();
+const heartbeat = storeHeartbeat();
+// Use a computed property to reactively update metadataOptions based on heartbeat
+const metadataOptions = computed(() => [
+  {
+    name: "IGDB",
+    value: "igdb",
+    disabled: !heartbeat.value.METADATA_SOURCES?.IGDB_API_ENABLED,
+  },
+  {
+    name: "MobyGames",
+    value: "moby",
+    disabled: !heartbeat.value.METADATA_SOURCES?.MOBY_API_ENABLED,
+  },
+]);
+// Use the computed metadataOptions to filter out disabled sources
+const metadataSources = ref(metadataOptions.value.filter((s) => !s.disabled));
 
 async function scan() {
   scanningStore.set(true);
@@ -15,6 +33,7 @@ async function scan() {
   socket.emit("scan", {
     platforms: [romsStore.platform.id],
     type: "quick",
+    apis: metadataSources.value.map((s) => s.value),
   });
 }
 </script>
diff --git a/frontend/src/components/Gallery/FabMenu/Base.vue b/frontend/src/components/Gallery/FabMenu/Base.vue
index d5dae7ef1..ce34be48f 100644
--- a/frontend/src/components/Gallery/FabMenu/Base.vue
+++ b/frontend/src/components/Gallery/FabMenu/Base.vue
@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import type { Events } from "@/types/emitter";
-import type { Emitter } from "mitt";
-import { inject } from "vue";
-import { useRoute } from "vue-router";
-
 import romApi from "@/services/api/rom";
 import socket from "@/services/socket";
 import storeAuth from "@/stores/auth";
+import storeHeartbeat from "@/stores/heartbeat";
 import storeRoms from "@/stores/roms";
 import storeScanning from "@/stores/scanning";
+import type { Events } from "@/types/emitter";
+import type { Emitter } from "mitt";
+import { computed, inject, ref } from "vue";
+import { useRoute } from "vue-router";
 
 // Event listeners bus
 const emitter = inject<Emitter<Events>>("emitter");
@@ -18,6 +18,22 @@ const auth = storeAuth();
 const romsStore = storeRoms();
 const scanningStore = storeScanning();
 const route = useRoute();
+const heartbeat = storeHeartbeat();
+// Use a computed property to reactively update metadataOptions based on heartbeat
+const metadataOptions = computed(() => [
+  {
+    name: "IGDB",
+    value: "igdb",
+    disabled: !heartbeat.value.METADATA_SOURCES?.IGDB_API_ENABLED,
+  },
+  {
+    name: "MobyGames",
+    value: "moby",
+    disabled: !heartbeat.value.METADATA_SOURCES?.MOBY_API_ENABLED,
+  },
+]);
+// Use the computed metadataOptions to filter out disabled sources
+const metadataSources = ref(metadataOptions.value.filter((s) => !s.disabled));
 
 // Functions
 async function onScan() {
@@ -33,6 +49,7 @@ async function onScan() {
     platforms: [route.params.platform],
     roms: romsStore.selectedRoms,
     type: "partial",
+    apis: metadataSources.value.map((s) => s.value),
   });
 }
 
diff --git a/frontend/src/services/api/platform.ts b/frontend/src/services/api/platform.ts
index 0ab6a041c..dbe90775a 100644
--- a/frontend/src/services/api/platform.ts
+++ b/frontend/src/services/api/platform.ts
@@ -7,7 +7,7 @@ async function uploadPlatform({
   fsSlug,
 }: {
   fsSlug: string;
-}): Promise<{ data: MessageResponse[] }> {
+}): Promise<{ data: PlatformSchema }> {
   return api.post("/platforms", { fs_slug: fsSlug });
 }
 
diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue
index d749f3382..7f821acc6 100644
--- a/frontend/src/views/Home.vue
+++ b/frontend/src/views/Home.vue
@@ -7,7 +7,6 @@ import CreatePlatformVersionDialog from "@/components/Dialog/Config/CreatePlatfo
 import DeletePlatformBindingDialog from "@/components/Dialog/Config/DeletePlatformBinding.vue";
 import DeletePlatformVersionDialog from "@/components/Dialog/Config/DeletePlatformVersion.vue";
 import LoadingDialog from "@/components/Dialog/Loading.vue";
-import AddPlatformDialog from "@/components/Dialog/Platform/AddPlatform.vue";
 import DeletePlatformDialog from "@/components/Dialog/Platform/DeletePlatform.vue";
 import DeleteRomDialog from "@/components/Dialog/Rom/DeleteRom.vue";
 import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
@@ -80,7 +79,6 @@ onMounted(() => {
   <app-bar v-if="mdAndDown" />
   <router-view :key="refreshView" />
 
-  <add-platform-dialog />
   <delete-platform-dialog />
   <search-rom-dialog />
   <match-rom-dialog />

From 13014db5e48fb57667786f83f177e2a1183f0302 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 01:53:50 +0200
Subject: [PATCH 47/61] improved scan logs

---
 frontend/src/App.vue | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 15e7a24cb..721130646 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,18 +1,17 @@
 <script setup lang="ts">
 import Notification from "@/components/Notification.vue";
 import api from "@/services/api/index";
-import storeConfig from "@/stores/config";
-import storeHeartbeat from "@/stores/heartbeat";
 import socket from "@/services/socket";
-import { onBeforeMount } from "vue";
+import storeConfig from "@/stores/config";
 import storeGalleryFilter from "@/stores/galleryFilter";
+import storeHeartbeat from "@/stores/heartbeat";
 import storeRoms, { type Rom } from "@/stores/roms";
 import storeScanning from "@/stores/scanning";
 import type { Events } from "@/types/emitter";
 import { normalizeString } from "@/utils";
 import type { Emitter } from "mitt";
 import { storeToRefs } from "pinia";
-import { inject, onBeforeUnmount } from "vue";
+import { inject, onBeforeMount, onBeforeUnmount } from "vue";
 
 // Props
 const scanningStore = storeScanning();
@@ -30,6 +29,9 @@ socket.on(
   "scan:scanning_platform",
   ({ name, slug, id }: { name: string; slug: string; id: number }) => {
     scanningStore.set(true);
+    scanningPlatforms.value = scanningPlatforms.value.filter(
+      (platform) => platform.name !== name
+    );
     scanningPlatforms.value.push({ name, slug, id, roms: [] });
   }
 );

From f9d4c18d6a7f5a78b10986368407e4319faa001f Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 02:28:36 +0200
Subject: [PATCH 48/61] unified metadataOptions into hearthbeat store

---
 .../src/components/Dialog/Rom/UploadRom.vue    | 17 +----------------
 .../src/components/Gallery/AppBar/ScanBtn.vue  | 17 +----------------
 .../src/components/Gallery/FabMenu/Base.vue    | 17 +----------------
 frontend/src/stores/heartbeat.ts               | 18 ++++++++++++++++--
 4 files changed, 19 insertions(+), 50 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index ff14001ed..0ad68bc76 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -20,21 +20,6 @@ const scanningStore = storeScanning();
 const selectedPlatform = ref<Platform | null>(null);
 const supportedPlatforms = ref<Platform[]>();
 const heartbeat = storeHeartbeat();
-// Use a computed property to reactively update metadataOptions based on heartbeat
-const metadataOptions = computed(() => [
-  {
-    name: "IGDB",
-    value: "igdb",
-    disabled: !heartbeat.value.METADATA_SOURCES?.IGDB_API_ENABLED,
-  },
-  {
-    name: "MobyGames",
-    value: "moby",
-    disabled: !heartbeat.value.METADATA_SOURCES?.MOBY_API_ENABLED,
-  },
-]);
-// Use the computed metadataOptions to filter out disabled sources
-const metadataSources = ref(metadataOptions.value.filter((s) => !s.disabled));
 
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showUploadRomDialog", (platformWhereUpload) => {
@@ -129,7 +114,7 @@ async function uploadRoms() {
         socket.emit("scan", {
           platforms: [platformId],
           type: "quick",
-          apis: metadataSources.value.map((s) => s.value),
+          apis: heartbeat.getMetadataOptions().map((s) => s.value),
         });
       }, 2000);
     })
diff --git a/frontend/src/components/Gallery/AppBar/ScanBtn.vue b/frontend/src/components/Gallery/AppBar/ScanBtn.vue
index dc807c39e..7ef2555e8 100644
--- a/frontend/src/components/Gallery/AppBar/ScanBtn.vue
+++ b/frontend/src/components/Gallery/AppBar/ScanBtn.vue
@@ -9,21 +9,6 @@ import { computed, ref } from "vue";
 const scanningStore = storeScanning();
 const romsStore = storeRoms();
 const heartbeat = storeHeartbeat();
-// Use a computed property to reactively update metadataOptions based on heartbeat
-const metadataOptions = computed(() => [
-  {
-    name: "IGDB",
-    value: "igdb",
-    disabled: !heartbeat.value.METADATA_SOURCES?.IGDB_API_ENABLED,
-  },
-  {
-    name: "MobyGames",
-    value: "moby",
-    disabled: !heartbeat.value.METADATA_SOURCES?.MOBY_API_ENABLED,
-  },
-]);
-// Use the computed metadataOptions to filter out disabled sources
-const metadataSources = ref(metadataOptions.value.filter((s) => !s.disabled));
 
 async function scan() {
   scanningStore.set(true);
@@ -33,7 +18,7 @@ async function scan() {
   socket.emit("scan", {
     platforms: [romsStore.platform.id],
     type: "quick",
-    apis: metadataSources.value.map((s) => s.value),
+    apis: heartbeat.getMetadataOptions().map((s) => s.value),
   });
 }
 </script>
diff --git a/frontend/src/components/Gallery/FabMenu/Base.vue b/frontend/src/components/Gallery/FabMenu/Base.vue
index ce34be48f..414c63973 100644
--- a/frontend/src/components/Gallery/FabMenu/Base.vue
+++ b/frontend/src/components/Gallery/FabMenu/Base.vue
@@ -19,21 +19,6 @@ const romsStore = storeRoms();
 const scanningStore = storeScanning();
 const route = useRoute();
 const heartbeat = storeHeartbeat();
-// Use a computed property to reactively update metadataOptions based on heartbeat
-const metadataOptions = computed(() => [
-  {
-    name: "IGDB",
-    value: "igdb",
-    disabled: !heartbeat.value.METADATA_SOURCES?.IGDB_API_ENABLED,
-  },
-  {
-    name: "MobyGames",
-    value: "moby",
-    disabled: !heartbeat.value.METADATA_SOURCES?.MOBY_API_ENABLED,
-  },
-]);
-// Use the computed metadataOptions to filter out disabled sources
-const metadataSources = ref(metadataOptions.value.filter((s) => !s.disabled));
 
 // Functions
 async function onScan() {
@@ -49,7 +34,7 @@ async function onScan() {
     platforms: [route.params.platform],
     roms: romsStore.selectedRoms,
     type: "partial",
-    apis: metadataSources.value.map((s) => s.value),
+    apis: heartbeat.getMetadataOptions().map((s) => s.value),
   });
 }
 
diff --git a/frontend/src/stores/heartbeat.ts b/frontend/src/stores/heartbeat.ts
index 916cfa7f3..fdae3a2a3 100644
--- a/frontend/src/stores/heartbeat.ts
+++ b/frontend/src/stores/heartbeat.ts
@@ -1,6 +1,6 @@
-import { defineStore } from "pinia";
-
 import type { HeartbeatResponse } from "@/__generated__";
+import { defineStore } from "pinia";
+import { computed } from "vue";
 
 export default defineStore("heartbeat", {
   state: () => {
@@ -11,5 +11,19 @@ export default defineStore("heartbeat", {
     set(data: HeartbeatResponse) {
       this.value = data;
     },
+    getMetadataOptions() {
+      return computed(() => [
+        {
+          name: "IGDB",
+          value: "igdb",
+          disabled: !this.value.METADATA_SOURCES?.IGDB_API_ENABLED,
+        },
+        {
+          name: "MobyGames",
+          value: "moby",
+          disabled: !this.value.METADATA_SOURCES?.MOBY_API_ENABLED,
+        },
+      ]).value.filter((s) => !s.disabled);
+    },
   },
 });

From 0cdab8679f694646ad805c5db94ef341b499549f Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 11:05:25 +0200
Subject: [PATCH 49/61] fixed mobygames cover update

---
 backend/endpoints/rom.py | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index 27701e8d7..e272bd29c 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -274,8 +274,8 @@ async def update_rom(
     platform_fs_slug = db_platform_handler.get_platforms(db_rom.platform_id).fs_slug
 
     cleaned_data = {}
-    cleaned_data["igdb_id"] = data.get("igdb_id", db_rom.igdb_id) or None
-    cleaned_data["moby_id"] = data.get("moby_id", db_rom.moby_id) or None
+    cleaned_data["igdb_id"] = data.get("igdb_id", None)
+    cleaned_data["moby_id"] = data.get("moby_id", None)
 
     if cleaned_data["moby_id"]:
         moby_rom = moby_handler.get_rom_by_id(cleaned_data["moby_id"])
@@ -325,6 +325,7 @@ async def update_rom(
                 rom_name=cleaned_data["name"], platform_fs_slug=platform_fs_slug
             )
         )
+        cleaned_data.update({"url_cover": ""})
     else:
         cleaned_data.update(
             fs_resource_handler.get_rom_cover(

From 5108b224ebc25ce46de4dc082ce5037d3c92e2a5 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 11:38:44 +0200
Subject: [PATCH 50/61] fixed sources metadata management

---
 backend/endpoints/rom.py                  | 4 ++++
 frontend/src/components/Details/Title.vue | 7 +++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index e272bd29c..da245ee98 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -280,10 +280,14 @@ async def update_rom(
     if cleaned_data["moby_id"]:
         moby_rom = moby_handler.get_rom_by_id(cleaned_data["moby_id"])
         cleaned_data.update(moby_rom)
+    else:
+        cleaned_data.update({"moby_metadata": {}})
 
     if cleaned_data["igdb_id"]:
         igdb_rom = igdb_handler.get_rom_by_id(cleaned_data["igdb_id"])
         cleaned_data.update(igdb_rom)
+    else:
+        cleaned_data.update({"igdb_metadata": {}})
 
     cleaned_data["name"] = data.get("name", db_rom.name)
     cleaned_data["summary"] = data.get("summary", db_rom.summary)
diff --git a/frontend/src/components/Details/Title.vue b/frontend/src/components/Details/Title.vue
index 37b4c444a..efadf52c6 100644
--- a/frontend/src/components/Details/Title.vue
+++ b/frontend/src/components/Details/Title.vue
@@ -42,7 +42,10 @@ const { smAndDown } = useDisplay();
     no-gutters
   >
     <v-col cols="12">
-      <v-chip class="mr-1" :to="{ name: 'platform', params: { platform: platform.id } }">
+      <v-chip
+        class="mr-1"
+        :to="{ name: 'platform', params: { platform: platform.id } }"
+      >
         {{ platform.name }}
         <v-avatar :rounded="0" size="40" class="ml-1 py-1">
           <platform-icon :key="platform.slug" :slug="platform.slug" />
@@ -99,7 +102,7 @@ const { smAndDown } = useDisplay();
         style="text-decoration: none; color: inherit"
         :href="`https://www.mobygames.com/game/${rom.moby_id}`"
         target="_blank"
-        class="ml-2"
+        :class="{ 'ml-2': rom.igdb_id }"
       >
         <v-chip size="x-small" @click="">
           <span>Mobygames</span>

From d58d6514d5a5226a5ec2ae7703b1305b510322c0 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 16:21:49 +0200
Subject: [PATCH 51/61] improved cover selection from multi-source

---
 backend/endpoints/responses/search.py         |   3 +-
 backend/endpoints/rom.py                      |   3 +-
 backend/endpoints/search.py                   |   9 +-
 .../__generated__/models/SearchRomSchema.ts   |   3 +-
 .../src/components/Details/Info/FileInfo.vue  |  10 +-
 .../src/components/Details/Info/GameInfo.vue  |   2 +-
 .../Dialog/Rom/{ => MatchRom}/MatchRom.vue    |  45 ++++-
 .../Dialog/Rom/MatchRom/SelectSource.vue      | 158 ++++++++++++++++++
 frontend/src/services/api/rom.ts              |   1 +
 frontend/src/types/emitter.d.ts               |   3 +-
 frontend/src/views/Home.vue                   |   2 +-
 11 files changed, 220 insertions(+), 19 deletions(-)
 rename frontend/src/components/Dialog/Rom/{ => MatchRom}/MatchRom.vue (88%)
 create mode 100644 frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue

diff --git a/backend/endpoints/responses/search.py b/backend/endpoints/responses/search.py
index 4cbb9a2d7..e18d4280a 100644
--- a/backend/endpoints/responses/search.py
+++ b/backend/endpoints/responses/search.py
@@ -6,5 +6,6 @@ class SearchRomSchema(BaseModel):
     slug: str
     name: str
     summary: str
-    url_cover: str
+    igdb_url_cover: str = ""
+    moby_url_cover: str = ""
     url_screenshots: list[str]
diff --git a/backend/endpoints/rom.py b/backend/endpoints/rom.py
index da245ee98..6c660c761 100644
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -259,7 +259,7 @@ async def update_rom(
         request (Request): Fastapi Request object
         id (Rom): Rom internal id
         rename_as_igdb (bool, optional): Flag to rename rom file as matched IGDB game. Defaults to False.
-        artwork (Optional[UploadFile], optional): Custom artork to set as cover. Defaults to File(None).
+        artwork (UploadFile, optional): Custom artork to set as cover. Defaults to File(None).
 
     Raises:
         HTTPException: If a rom already have that name when enabling the rename_as_igdb flag
@@ -331,6 +331,7 @@ async def update_rom(
         )
         cleaned_data.update({"url_cover": ""})
     else:
+        cleaned_data["url_cover"] = data.get("url_cover", db_rom.url_cover)
         cleaned_data.update(
             fs_resource_handler.get_rom_cover(
                 overwrite=True,
diff --git a/backend/endpoints/search.py b/backend/endpoints/search.py
index c103d214b..3f9e88011 100644
--- a/backend/endpoints/search.py
+++ b/backend/endpoints/search.py
@@ -73,10 +73,14 @@ async def search_rom(
             search_term, rom.platform.moby_id
         )
 
-    merged_dict = {item["name"]: item for item in igdb_matched_roms}
+    merged_dict = {
+        item["name"]: {**item, "igdb_url_cover": item.pop("url_cover", "")}
+        for item in igdb_matched_roms
+    }
     for item in moby_matched_roms:
         merged_dict[item["name"]] = {
             **item,
+            "moby_url_cover": item.pop("url_cover", ""),
             **merged_dict.get(item.get("name", ""), {}),
         }
 
@@ -86,7 +90,8 @@ async def search_rom(
                 "slug": "",
                 "name": "",
                 "summary": "",
-                "url_cover": "",
+                "igdb_url_cover": "",
+                "moby_url_cover": "",
                 "url_screenshots": [],
             },
             **item,
diff --git a/frontend/src/__generated__/models/SearchRomSchema.ts b/frontend/src/__generated__/models/SearchRomSchema.ts
index 354de245d..035818997 100644
--- a/frontend/src/__generated__/models/SearchRomSchema.ts
+++ b/frontend/src/__generated__/models/SearchRomSchema.ts
@@ -9,7 +9,8 @@ export type SearchRomSchema = {
     slug: string;
     name: string;
     summary: string;
-    url_cover: string;
+    igdb_url_cover?: string;
+    moby_url_cover?: string;
     url_screenshots: Array<string>;
 };
 
diff --git a/frontend/src/components/Details/Info/FileInfo.vue b/frontend/src/components/Details/Info/FileInfo.vue
index b639e7936..4991f2482 100644
--- a/frontend/src/components/Details/Info/FileInfo.vue
+++ b/frontend/src/components/Details/Info/FileInfo.vue
@@ -14,7 +14,7 @@ const downloadStore = storeDownload();
     class="align-center my-3"
     no-gutters
   >
-    <v-col cols="3" sm="3" md="2" xl="1">
+    <v-col cols="3" xl="2">
       <span>Ver.</span>
     </v-col>
     <v-col>
@@ -22,7 +22,7 @@ const downloadStore = storeDownload();
     </v-col>
   </v-row>
   <v-row v-if="!rom.multi" class="align-center my-3" no-gutters>
-    <v-col cols="3" sm="3" md="2" xl="1">
+    <v-col cols="3" xl="2">
       <span>File</span>
     </v-col>
     <v-col class="text-body-1">
@@ -30,7 +30,7 @@ const downloadStore = storeDownload();
     </v-col>
   </v-row>
   <v-row v-if="rom.multi" class="align-center my-3" no-gutters>
-    <v-col cols="3" sm="3" md="2" xl="1">
+    <v-col cols="3" xl="2">
       <span>Files</span>
     </v-col>
     <v-col>
@@ -51,7 +51,7 @@ const downloadStore = storeDownload();
     </v-col>
   </v-row>
   <v-row class="align-center my-3" no-gutters>
-    <v-col cols="3" sm="3" md="2" xl="1">
+    <v-col cols="3" xl="2">
       <span>Size</span>
     </v-col>
     <v-col>
@@ -59,7 +59,7 @@ const downloadStore = storeDownload();
     </v-col>
   </v-row>
   <v-row v-if="rom.tags.length > 0" class="align-center my-3" no-gutters>
-    <v-col cols="3" sm="3" md="2" xl="1">
+    <v-col cols="3" xl="2">
       <span>Tags</span>
     </v-col>
     <v-col>
diff --git a/frontend/src/components/Details/Info/GameInfo.vue b/frontend/src/components/Details/Info/GameInfo.vue
index 83862fd53..2b4832a84 100644
--- a/frontend/src/components/Details/Info/GameInfo.vue
+++ b/frontend/src/components/Details/Info/GameInfo.vue
@@ -11,7 +11,7 @@ const galleryFilter = storeGalleryFilter();
   <v-divider class="mx-2 my-4" />
   <template v-for="filter in galleryFilter.filters">
     <v-row v-if="rom[filter].length > 0" class="align-center my-3" no-gutters>
-      <v-col cols="3" sm="3" md="2" xl="1" class="text-capitalize">
+      <v-col cols="3" xl="2" class="text-capitalize">
         <span>{{ filter }}</span>
       </v-col>
       <v-col>
diff --git a/frontend/src/components/Dialog/Rom/MatchRom.vue b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
similarity index 88%
rename from frontend/src/components/Dialog/Rom/MatchRom.vue
rename to frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
index e5b6f3746..2f077aafd 100644
--- a/frontend/src/components/Dialog/Rom/MatchRom.vue
+++ b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
@@ -2,6 +2,7 @@
 import type { SearchRomSchema } from "@/__generated__";
 import romApi from "@/services/api/rom";
 import storeRoms, { type Rom } from "@/stores/roms";
+import SelectSourceDialog from "@/components/Dialog/Rom/MatchRom/SelectSource.vue";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, onBeforeUnmount, ref } from "vue";
@@ -63,6 +64,24 @@ async function searchRom() {
   }
 }
 
+async function selectMatched(matchedRom: SearchRomSchema) {
+  if (!rom.value) return;
+
+  if (matchedRom.igdb_id && matchedRom.moby_id) {
+    emitter?.emit("showSelectSourceDialog", matchedRom);
+  } else {
+    if (matchedRom.igdb_id) {
+      updateRom(
+        Object.assign(matchedRom, { url_cover: matchedRom.igdb_url_cover })
+      );
+    } else if (matchedRom.moby_id) {
+      updateRom(
+        Object.assign(matchedRom, { url_cover: matchedRom.moby_url_cover })
+      );
+    }
+  }
+}
+
 async function updateRom(matchedRom: SearchRomSchema) {
   if (!rom.value) return;
 
@@ -236,7 +255,7 @@ onBeforeUnmount(() => {
           >
             <v-hover v-slot="{ isHovering, props }">
               <v-card
-                @click="updateRom(matchedRom)"
+                @click="selectMatched(matchedRom)"
                 v-bind="props"
                 class="matched-rom"
                 :class="{ 'on-hover': isHovering }"
@@ -246,14 +265,18 @@ onBeforeUnmount(() => {
                   <v-img
                     v-bind="props"
                     :src="
-                      !matchedRom.url_cover
+                      !matchedRom.igdb_url_cover && !matchedRom.moby_url_cover
                         ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
-                        : matchedRom.url_cover
+                        : matchedRom.igdb_url_cover
+                        ? matchedRom.igdb_url_cover
+                        : matchedRom.moby_url_cover
                     "
                     :lazy-src="
-                      !matchedRom.url_cover
+                      !matchedRom.igdb_url_cover && !matchedRom.moby_url_cover
                         ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
-                        : matchedRom.url_cover
+                        : matchedRom.igdb_url_cover
+                        ? matchedRom.igdb_url_cover
+                        : matchedRom.moby_url_cover
                     "
                     :aspect-ratio="3 / 4"
                   >
@@ -270,7 +293,11 @@ onBeforeUnmount(() => {
                     </template>
                     <v-expand-transition>
                       <div
-                        v-if="isHovering || !matchedRom.url_cover"
+                        v-if="
+                          isHovering ||
+                          (!matchedRom.igdb_url_cover &&
+                            !matchedRom.moby_url_cover)
+                        "
                         class="translucent text-caption"
                       >
                         <v-list-item>{{ matchedRom.name }}</v-list-item>
@@ -342,9 +369,15 @@ onBeforeUnmount(() => {
       </v-toolbar>
     </v-card>
   </v-dialog>
+
+  <select-source-dialog id="select-source-dialog" @update-rom="updateRom" />
 </template>
 
 <style scoped>
+#select-source-dialog {
+  z-index: 9999 !important;
+}
+
 .scroll {
   overflow-y: scroll;
 }
diff --git a/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue b/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue
new file mode 100644
index 000000000..6a029ea48
--- /dev/null
+++ b/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue
@@ -0,0 +1,158 @@
+<script setup lang="ts">
+import type { SearchRomSchema } from "@/__generated__";
+import type { Events } from "@/types/emitter";
+import type { Emitter } from "mitt";
+import { inject, ref } from "vue";
+import { useTheme } from "vuetify";
+
+const show = ref(false);
+const sources = ref<any>([]);
+const theme = useTheme();
+const emit = defineEmits(["updateRom"]);
+
+const emitter = inject<Emitter<Events>>("emitter");
+emitter?.on("showSelectSourceDialog", (matchedRom: SearchRomSchema) => {
+  sources.value.push({
+    url_cover: matchedRom.igdb_url_cover,
+    name: "igdb",
+    rom: matchedRom,
+  });
+  sources.value.push({
+    url_cover: matchedRom.moby_url_cover,
+    name: "moby",
+    rom: matchedRom,
+  });
+  show.value = true;
+});
+
+function selectSource(matchedRom: SearchRomSchema, source: string) {
+  if (source == "igdb") {
+    emit(
+      "updateRom",
+      Object.assign(matchedRom, { url_cover: matchedRom.igdb_url_cover })
+    );
+  } else if (source == "moby") {
+    emit(
+      "updateRom",
+      Object.assign(matchedRom, { url_cover: matchedRom.moby_url_cover })
+    );
+  }
+  closeDialog();
+}
+
+function closeDialog() {
+  show.value = false;
+  sources.value = [];
+}
+</script>
+
+<template>
+  <v-dialog
+    @update:model-value="closeDialog()"
+    :modelValue="show"
+    scrim="true"
+    scroll-strategy="none"
+    width="auto"
+  >
+    <v-row no-gutters>
+      <v-col class="pa-2 cover" v-for="source in sources">
+        <v-hover v-slot="{ isHovering, props }">
+          <v-card
+            @click="selectSource(source.rom, source.name)"
+            v-bind="props"
+            class="matched-rom"
+            :class="{ 'on-hover': isHovering }"
+            :elevation="isHovering ? 20 : 3"
+          >
+            <v-img
+              :src="
+                !source.url_cover
+                  ? `/assets/default/cover/big_${theme.global.name.value}_missing_cover.png`
+                  : source.url_cover
+              "
+              :lazy-src="
+                !source.url_cover
+                  ? `/assets/default/cover/small_${theme.global.name.value}_missing_cover.png`
+                  : source.url_cover
+              "
+              :aspect-ratio="3 / 4"
+            >
+              <template v-slot:placeholder>
+                <div class="d-flex align-center justify-center fill-height">
+                  <v-progress-circular
+                    color="romm-accent-1"
+                    :width="2"
+                    indeterminate
+                  />
+                </div>
+              </template>
+              <v-row no-gutters class="text-white pa-1">
+                <v-tooltip
+                  location="top"
+                  class="tooltip"
+                  transition="fade-transition"
+                  text="IGDB matched"
+                  open-delay="500"
+                  ><template v-slot:activator="{ props }">
+                    <v-avatar
+                      v-bind="props"
+                      v-if="source.name == 'igdb'"
+                      class="mr-1"
+                      size="30"
+                      rounded="1"
+                    >
+                      <v-img
+                        src="/assets/scrappers/igdb.png"
+                      /> </v-avatar></template
+                ></v-tooltip>
+                <v-tooltip
+                  location="top"
+                  class="tooltip"
+                  transition="fade-transition"
+                  text="Mobygames matched"
+                  open-delay="500"
+                  ><template v-slot:activator="{ props }">
+                    <v-avatar
+                      v-bind="props"
+                      v-if="source.name == 'moby'"
+                      class="mr-1"
+                      size="30"
+                      rounded="1"
+                    >
+                      <v-img
+                        src="/assets/scrappers/moby.png"
+                      /> </v-avatar></template
+                ></v-tooltip>
+              </v-row>
+            </v-img>
+          </v-card>
+        </v-hover>
+      </v-col>
+    </v-row>
+  </v-dialog>
+</template>
+<style scoped>
+.cover {
+  min-width: 270px;
+  min-height: 360px;
+  max-width: 270px;
+  max-height: 360px;
+}
+.matched-rom {
+  transition-property: all;
+  transition-duration: 0.1s;
+}
+.matched-rom.on-hover {
+  z-index: 1 !important;
+  transform: scale(1.05);
+}
+.translucent {
+  background: rgba(0, 0, 0, 0.35);
+  backdrop-filter: blur(10px);
+  text-shadow: 1px 1px 1px #000000, 0 0 1px #000000;
+}
+.tooltip :deep(.v-overlay__content) {
+  background: rgba(201, 201, 201, 0.98) !important;
+  color: rgb(41, 41, 41) !important;
+}
+</style>
diff --git a/frontend/src/services/api/rom.ts b/frontend/src/services/api/rom.ts
index daf34fc7a..7729ab7c4 100644
--- a/frontend/src/services/api/rom.ts
+++ b/frontend/src/services/api/rom.ts
@@ -156,6 +156,7 @@ async function updateRom({
   formData.append("name", rom.name || "");
   formData.append("file_name", rom.file_name);
   formData.append("summary", rom.summary || "");
+  formData.append("url_cover", rom.url_cover || "");
   if (rom.artwork) formData.append("artwork", rom.artwork[0]);
 
   return api.put(`/roms/${rom.id}`, formData, {
diff --git a/frontend/src/types/emitter.d.ts b/frontend/src/types/emitter.d.ts
index 429c83dc2..dfb0a5b4f 100644
--- a/frontend/src/types/emitter.d.ts
+++ b/frontend/src/types/emitter.d.ts
@@ -1,4 +1,4 @@
-import type { SaveSchema, StateSchema } from "@/__generated__";
+import type { SaveSchema, SearchRomSchema, StateSchema } from "@/__generated__";
 import type { Platform } from "@/stores/platforms";
 import type { Rom } from "@/stores/roms";
 import type { User } from "@/stores/users";
@@ -18,6 +18,7 @@ export type SnackbarStatus = {
 export type Events = {
   showDeletePlatformDialog: Platform;
   showMatchRomDialog: Rom;
+  showSelectSourceDialog: SearchRomSchema;
   showSearchRomDialog: null;
   showEditRomDialog: Rom;
   showDeleteRomDialog: Rom[];
diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue
index 7f821acc6..957a74b18 100644
--- a/frontend/src/views/Home.vue
+++ b/frontend/src/views/Home.vue
@@ -10,7 +10,7 @@ import LoadingDialog from "@/components/Dialog/Loading.vue";
 import DeletePlatformDialog from "@/components/Dialog/Platform/DeletePlatform.vue";
 import DeleteRomDialog from "@/components/Dialog/Rom/DeleteRom.vue";
 import EditRomDialog from "@/components/Dialog/Rom/EditRom.vue";
-import MatchRomDialog from "@/components/Dialog/Rom/MatchRom.vue";
+import MatchRomDialog from "@/components/Dialog/Rom/MatchRom/MatchRom.vue";
 import SearchRomDialog from "@/components/Dialog/Rom/SearchRom.vue";
 import UploadRomDialog from "@/components/Dialog/Rom/UploadRom.vue";
 import CreateUserDialog from "@/components/Dialog/User/CreateUser.vue";

From 6729a21b3f67a6d968e8ba511a3b51b2a5c0865e Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 18:48:46 +0200
Subject: [PATCH 52/61] source filter to match rom dialog added

---
 .../Dialog/Rom/MatchRom/MatchRom.vue          | 63 +++++++++++++++++--
 1 file changed, 59 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
index 2f077aafd..861f9d942 100644
--- a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
+++ b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import type { SearchRomSchema } from "@/__generated__";
+import SelectSourceDialog from "@/components/Dialog/Rom/MatchRom/SelectSource.vue";
 import romApi from "@/services/api/rom";
 import storeRoms, { type Rom } from "@/stores/roms";
-import SelectSourceDialog from "@/components/Dialog/Rom/MatchRom/SelectSource.vue";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, onBeforeUnmount, ref } from "vue";
@@ -20,6 +20,8 @@ const searchExtended = ref(false);
 const matchedRoms = ref<SearchRomSchema[]>([]);
 const theme = useTheme();
 const emitter = inject<Emitter<Events>>("emitter");
+const isIGDBFiltered = ref(true);
+const isMobyFiltered = ref(true);
 emitter?.on("showMatchRomDialog", (romToSearch) => {
   rom.value = romToSearch;
   searchTerm.value = romToSearch.name || romToSearch.file_name_no_tags || "";
@@ -28,6 +30,14 @@ emitter?.on("showMatchRomDialog", (romToSearch) => {
 });
 
 // Functions
+function toggleSourceFilter(source: string) {
+  if (source == "igdb") {
+    isIGDBFiltered.value = !isIGDBFiltered.value;
+  } else if (source == "moby") {
+    isMobyFiltered.value = !isMobyFiltered.value;
+  }
+}
+
 function toggleExtended() {
   searchExtended.value = !searchExtended.value;
 }
@@ -147,6 +157,45 @@ onBeforeUnmount(() => {
         <v-row class="align-center" no-gutters>
           <v-col cols="9" xs="9" sm="10" md="10" lg="11">
             <v-icon icon="mdi-search-web" class="ml-5" />
+            <span class="ml-4">Filter:</span>
+
+            <v-tooltip
+              location="top"
+              class="tooltip"
+              transition="fade-transition"
+              text="Filter IGDB matches"
+              open-delay="500"
+              ><template v-slot:activator="{ props }">
+                <v-avatar
+                  @click="toggleSourceFilter('igdb')"
+                  v-bind="props"
+                  class="ml-3 source-filter"
+                  :class="{ filtered: isIGDBFiltered }"
+                  size="30"
+                  rounded="1"
+                >
+                  <v-img src="/assets/scrappers/igdb.png" />
+                </v-avatar> </template
+            ></v-tooltip>
+
+            <v-tooltip
+              location="top"
+              class="tooltip"
+              transition="fade-transition"
+              text="Filter Mobygames matches"
+              open-delay="500"
+              ><template v-slot:activator="{ props }">
+                <v-avatar
+                  @click="toggleSourceFilter('moby')"
+                  v-bind="props"
+                  class="ml-3 source-filter"
+                  :class="{ filtered: isMobyFiltered }"
+                  size="30"
+                  rounded="1"
+                >
+                  <v-img src="/assets/scrappers/moby.png" />
+                </v-avatar> </template
+            ></v-tooltip>
           </v-col>
           <v-col>
             <v-btn
@@ -314,7 +363,6 @@ onBeforeUnmount(() => {
                           <v-avatar
                             v-bind="props"
                             v-if="matchedRom.igdb_id"
-                            class="mr-1"
                             size="30"
                             rounded="1"
                           >
@@ -332,7 +380,7 @@ onBeforeUnmount(() => {
                           <v-avatar
                             v-bind="props"
                             v-if="matchedRom.moby_id"
-                            class="mr-1"
+                            class="ml-1"
                             size="30"
                             rounded="1"
                           >
@@ -383,7 +431,7 @@ onBeforeUnmount(() => {
 }
 
 .search-content {
-  width: 60vw;
+  width: 65vw;
   height: 80vh;
 }
 
@@ -413,4 +461,11 @@ onBeforeUnmount(() => {
   background: rgba(201, 201, 201, 0.98) !important;
   color: rgb(41, 41, 41) !important;
 }
+.source-filter {
+  cursor: pointer;
+  opacity: 0.4;
+}
+.source-filter.filtered {
+  opacity: 1;
+}
 </style>

From ba1b6fd41427385b31a497e480603cd35af8aa63 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 19:15:38 +0200
Subject: [PATCH 53/61] fixed source filter in rom match

---
 .../Dialog/Rom/MatchRom/MatchRom.vue          | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
index 861f9d942..e20ce9fc1 100644
--- a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
+++ b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
@@ -18,6 +18,7 @@ const searchTerm = ref("");
 const searchBy = ref("Name");
 const searchExtended = ref(false);
 const matchedRoms = ref<SearchRomSchema[]>([]);
+const filteredMatchedRoms = ref<SearchRomSchema[]>();
 const theme = useTheme();
 const emitter = inject<Emitter<Events>>("emitter");
 const isIGDBFiltered = ref(true);
@@ -36,6 +37,14 @@ function toggleSourceFilter(source: string) {
   } else if (source == "moby") {
     isMobyFiltered.value = !isMobyFiltered.value;
   }
+  filteredMatchedRoms.value = matchedRoms.value.filter((rom) => {
+    if (
+      (rom.igdb_id && isIGDBFiltered.value) ||
+      (rom.moby_id && isMobyFiltered.value)
+    ) {
+      return true;
+    }
+  });
 }
 
 function toggleExtended() {
@@ -60,6 +69,14 @@ async function searchRom() {
       })
       .then((response) => {
         matchedRoms.value = response.data;
+        filteredMatchedRoms.value = matchedRoms.value.filter((rom) => {
+          if (
+            (rom.igdb_id && isIGDBFiltered.value) ||
+            (rom.moby_id && isMobyFiltered.value)
+          ) {
+            return true;
+          }
+        });
       })
       .catch((error) => {
         emitter?.emit("snackbarShow", {
@@ -300,7 +317,7 @@ onBeforeUnmount(() => {
             md="3"
             lg="2"
             v-show="!searching"
-            v-for="matchedRom in matchedRoms"
+            v-for="matchedRom in filteredMatchedRoms"
           >
             <v-hover v-slot="{ isHovering, props }">
               <v-card

From 10cc41fa01781f4351b84f73cc613a44357dd7f6 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Thu, 11 Apr 2024 23:59:35 +0200
Subject: [PATCH 54/61] show source filters only of enabled

---
 frontend/src/App.vue                           | 10 +++++-----
 .../Dialog/Rom/MatchRom/MatchRom.vue           |  4 ++++
 .../Dialog/Rom/MatchRom/SelectSource.vue       | 18 +++++++++++++-----
 .../src/components/Dialog/Rom/UploadRom.vue    |  2 +-
 4 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 721130646..0241405af 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -22,7 +22,7 @@ const isFiltered = normalizeString(galleryFilter.filterSearch).trim() != "";
 const emitter = inject<Emitter<Events>>("emitter");
 
 // Props
-const heartbeatStore = storeHeartbeat();
+const heartbeat = storeHeartbeat();
 const configStore = storeConfig();
 
 socket.on(
@@ -96,11 +96,11 @@ onBeforeUnmount(() => {
 });
 
 onBeforeMount(() => {
-  api.get("/heartbeat").then(({ data: heartBeatData }) => {
-    heartbeatStore.set(heartBeatData);
+  api.get("/heartbeat").then(({ data: data }) => {
+    heartbeat.set(data);
   });
-  api.get("/config").then(({ data: configData }) => {
-    configStore.set(configData);
+  api.get("/config").then(({ data: data }) => {
+    configStore.set(data);
   });
 });
 </script>
diff --git a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
index e20ce9fc1..6bf51de43 100644
--- a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
+++ b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
@@ -2,6 +2,7 @@
 import type { SearchRomSchema } from "@/__generated__";
 import SelectSourceDialog from "@/components/Dialog/Rom/MatchRom/SelectSource.vue";
 import romApi from "@/services/api/rom";
+import storeHeartbeat from "@/stores/heartbeat";
 import storeRoms, { type Rom } from "@/stores/roms";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
@@ -21,6 +22,7 @@ const matchedRoms = ref<SearchRomSchema[]>([]);
 const filteredMatchedRoms = ref<SearchRomSchema[]>();
 const theme = useTheme();
 const emitter = inject<Emitter<Events>>("emitter");
+const heartbeat = storeHeartbeat();
 const isIGDBFiltered = ref(true);
 const isMobyFiltered = ref(true);
 emitter?.on("showMatchRomDialog", (romToSearch) => {
@@ -184,6 +186,7 @@ onBeforeUnmount(() => {
               open-delay="500"
               ><template v-slot:activator="{ props }">
                 <v-avatar
+                  v-if="heartbeat.value.METADATA_SOURCES.IGDB_API_ENABLED"
                   @click="toggleSourceFilter('igdb')"
                   v-bind="props"
                   class="ml-3 source-filter"
@@ -203,6 +206,7 @@ onBeforeUnmount(() => {
               open-delay="500"
               ><template v-slot:activator="{ props }">
                 <v-avatar
+                  v-if="heartbeat.value.METADATA_SOURCES.MOBY_API_ENABLED"
                   @click="toggleSourceFilter('moby')"
                   v-bind="props"
                   class="ml-3 source-filter"
diff --git a/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue b/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue
index 6a029ea48..dc3fc3915 100644
--- a/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue
+++ b/frontend/src/components/Dialog/Rom/MatchRom/SelectSource.vue
@@ -1,14 +1,16 @@
 <script setup lang="ts">
+
 import type { SearchRomSchema } from "@/__generated__";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
-import { useTheme } from "vuetify";
+import { useTheme, useDisplay } from "vuetify";
 
 const show = ref(false);
 const sources = ref<any>([]);
 const theme = useTheme();
 const emit = defineEmits(["updateRom"]);
+const { xs } = useDisplay();
 
 const emitter = inject<Emitter<Events>>("emitter");
 emitter?.on("showSelectSourceDialog", (matchedRom: SearchRomSchema) => {
@@ -54,8 +56,12 @@ function closeDialog() {
     scroll-strategy="none"
     width="auto"
   >
-    <v-row no-gutters>
-      <v-col class="pa-2 cover" v-for="source in sources">
+    <v-row class="justify-center" no-gutters>
+      <v-col
+        class="pa-2"
+        :class="{'cover':!xs, 'cover-xs': xs}"
+        v-for="source in sources"
+      >
         <v-hover v-slot="{ isHovering, props }">
           <v-card
             @click="selectSource(source.rom, source.name)"
@@ -134,9 +140,11 @@ function closeDialog() {
 <style scoped>
 .cover {
   min-width: 270px;
-  min-height: 360px;
   max-width: 270px;
-  max-height: 360px;
+}
+.cover-xs {
+  min-width: 180px;
+  max-width: 180px;
 }
 .matched-rom {
   transition-property: all;
diff --git a/frontend/src/components/Dialog/Rom/UploadRom.vue b/frontend/src/components/Dialog/Rom/UploadRom.vue
index 0ad68bc76..e9dc6a22a 100644
--- a/frontend/src/components/Dialog/Rom/UploadRom.vue
+++ b/frontend/src/components/Dialog/Rom/UploadRom.vue
@@ -9,7 +9,7 @@ import storeScanning from "@/stores/scanning";
 import type { Events } from "@/types/emitter";
 import { formatBytes } from "@/utils";
 import type { Emitter } from "mitt";
-import { computed, inject, ref } from "vue";
+import { inject, ref } from "vue";
 import { useDisplay } from "vuetify";
 
 // Props

From 8207d70d20b8c147a49f1f797d010cdeb6875380 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Fri, 12 Apr 2024 00:09:21 +0200
Subject: [PATCH 55/61] match rom dialog UX improved

---
 .../Dialog/Rom/MatchRom/MatchRom.vue          | 37 +++++++++++++++----
 1 file changed, 29 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
index 6bf51de43..38b8a8366 100644
--- a/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
+++ b/frontend/src/components/Dialog/Rom/MatchRom/MatchRom.vue
@@ -34,9 +34,12 @@ emitter?.on("showMatchRomDialog", (romToSearch) => {
 
 // Functions
 function toggleSourceFilter(source: string) {
-  if (source == "igdb") {
+  if (source == "igdb" && heartbeat.value.METADATA_SOURCES.IGDB_API_ENABLED) {
     isIGDBFiltered.value = !isIGDBFiltered.value;
-  } else if (source == "moby") {
+  } else if (
+    source == "moby" &&
+    heartbeat.value.METADATA_SOURCES.MOBY_API_ENABLED
+  ) {
     isMobyFiltered.value = !isMobyFiltered.value;
   }
   filteredMatchedRoms.value = matchedRoms.value.filter((rom) => {
@@ -182,15 +185,22 @@ onBeforeUnmount(() => {
               location="top"
               class="tooltip"
               transition="fade-transition"
-              text="Filter IGDB matches"
+              :text="
+                heartbeat.value.METADATA_SOURCES.IGDB_API_ENABLED
+                  ? 'Filter IGDB matches'
+                  : 'IGDB source is not enabled'
+              "
               open-delay="500"
               ><template v-slot:activator="{ props }">
                 <v-avatar
-                  v-if="heartbeat.value.METADATA_SOURCES.IGDB_API_ENABLED"
                   @click="toggleSourceFilter('igdb')"
                   v-bind="props"
                   class="ml-3 source-filter"
-                  :class="{ filtered: isIGDBFiltered }"
+                  :class="{
+                    filtered: isIGDBFiltered,
+                    'source-disabled':
+                      !heartbeat.value.METADATA_SOURCES.IGDB_API_ENABLED,
+                  }"
                   size="30"
                   rounded="1"
                 >
@@ -202,15 +212,22 @@ onBeforeUnmount(() => {
               location="top"
               class="tooltip"
               transition="fade-transition"
-              text="Filter Mobygames matches"
+              :text="
+                heartbeat.value.METADATA_SOURCES.MOBY_API_ENABLED
+                  ? 'Filter Mobygames matches'
+                  : 'Mobygames source is not enabled'
+              "
               open-delay="500"
               ><template v-slot:activator="{ props }">
                 <v-avatar
-                  v-if="heartbeat.value.METADATA_SOURCES.MOBY_API_ENABLED"
                   @click="toggleSourceFilter('moby')"
                   v-bind="props"
                   class="ml-3 source-filter"
-                  :class="{ filtered: isMobyFiltered }"
+                  :class="{
+                    filtered: isMobyFiltered,
+                    'source-disabled':
+                      !heartbeat.value.METADATA_SOURCES.MOBY_API_ENABLED,
+                  }"
                   size="30"
                   rounded="1"
                 >
@@ -489,4 +506,8 @@ onBeforeUnmount(() => {
 .source-filter.filtered {
   opacity: 1;
 }
+.source-disabled {
+  cursor: not-allowed !important;
+  opacity: 0.4 !important;
+}
 </style>

From 53ef1866514b2378fce41155dc2f4b0f5d499a75 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Fri, 12 Apr 2024 00:21:24 +0200
Subject: [PATCH 56/61] fixed manual search button

---
 frontend/src/components/Game/AdminMenu/Base.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Game/AdminMenu/Base.vue b/frontend/src/components/Game/AdminMenu/Base.vue
index 0f7c44ffe..86758ba3e 100644
--- a/frontend/src/components/Game/AdminMenu/Base.vue
+++ b/frontend/src/components/Game/AdminMenu/Base.vue
@@ -14,13 +14,16 @@ const heartbeat = storeHeartbeat();
   <v-list rounded="0" class="pa-0">
     <v-list-item
       :disabled="!heartbeat.value.ANY_SOURCE_ENABLED"
-      :title="!heartbeat.value.ANY_SOURCE_ENABLED ? 'No metadata source enabled' : ''"
       @click="emitter?.emit('showMatchRomDialog', rom)"
       class="py-4 pr-5"
     >
       <v-list-item-title class="d-flex"
-        ><v-icon icon="mdi-search-web" class="mr-2" />Manual search</v-list-item-title
+        ><v-icon icon="mdi-search-web" class="mr-2" />Manual
+        search</v-list-item-title
       >
+      <v-list-item-subtitle>{{
+        !heartbeat.value.ANY_SOURCE_ENABLED ? "No metadata source enabled" : ""
+      }}</v-list-item-subtitle>
     </v-list-item>
     <v-divider class="border-opacity-25" />
     <v-list-item

From ec70f29b165da418cae4d48824a2e5d6204c0969 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Fri, 12 Apr 2024 02:16:32 +0200
Subject: [PATCH 57/61] improved steam deck resolution dashboard view

---
 frontend/src/utils/index.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/utils/index.ts b/frontend/src/utils/index.ts
index 031c8b7d5..95f841a8a 100644
--- a/frontend/src/utils/index.ts
+++ b/frontend/src/utils/index.ts
@@ -17,9 +17,9 @@ export const views: Record<
     view: "small",
     icon: "mdi-view-comfy",
     "size-xl": 1,
-    "size-lg": 1,
+    "size-lg": 2,
     "size-md": 2,
-    "size-sm": 2,
+    "size-sm": 3,
     "size-xs": 3,
     "size-cols": 4,
   },
@@ -27,7 +27,7 @@ export const views: Record<
     view: "big",
     icon: "mdi-view-module",
     "size-xl": 2,
-    "size-lg": 2,
+    "size-lg": 3,
     "size-md": 3,
     "size-sm": 3,
     "size-xs": 6,

From 412845079d413a3f089c09085e5130cbba8d4196 Mon Sep 17 00:00:00 2001
From: zurdi <zurdizurdo25@gmail.com>
Date: Fri, 12 Apr 2024 09:41:40 +0200
Subject: [PATCH 58/61] added copy download link button to details view

---
 frontend/src/components/Details/ActionBar.vue | 31 +++++++++-
 frontend/src/components/Details/Saves.vue     | 16 ++---
 .../src/components/Game/Card/ActionBar.vue    | 59 +++++++++----------
 frontend/src/services/api/rom.ts              | 37 ++++++------
 4 files changed, 87 insertions(+), 56 deletions(-)

diff --git a/frontend/src/components/Details/ActionBar.vue b/frontend/src/components/Details/ActionBar.vue
index d0624adf9..118277474 100644
--- a/frontend/src/components/Details/ActionBar.vue
+++ b/frontend/src/components/Details/ActionBar.vue
@@ -15,13 +15,37 @@ const emitter = inject<Emitter<Events>>("emitter");
 const auth = storeAuth();
 const emulation = ref(false);
 const playInfoIcon = ref("mdi-play");
-const emulationSupported = props.rom.platform_slug.toLowerCase() in platformSlugEJSCoreMap;
+const emulationSupported =
+  props.rom.platform_slug.toLowerCase() in platformSlugEJSCoreMap;
 
 function toggleEmulation() {
   emulation.value = !emulation.value;
   playInfoIcon.value = emulation.value ? "mdi-information" : "mdi-play";
   emitter?.emit("showEmulation", null);
 }
+
+async function copyDownloadLink(rom: Rom) {
+  const downloadLink = await romApi.downloadRom({
+    rom,
+    files: downloadStore.filesToDownloadMultiFileRom,
+    shareLink: true,
+  });
+  if (downloadLink) {
+    emitter?.emit("snackbarShow", {
+      msg: "Download link copied to clipboard!",
+      icon: "mdi-check-bold",
+      color: "green",
+      timeout: 2000,
+    });
+  } else {
+    emitter?.emit("snackbarShow", {
+      msg: `Unable to copy download link: ${downloadLink}`,
+      icon: "mdi-close-circle",
+      color: "red",
+      timeout: 4000,
+    });
+  }
+}
 </script>
 
 <template>
@@ -42,6 +66,11 @@ function toggleEmulation() {
         <v-icon icon="mdi-download" size="large" />
       </v-btn>
     </v-col>
+    <v-col>
+      <v-btn @click="copyDownloadLink(rom)" rounded="0" color="primary" block
+        ><v-icon icon="mdi-share-variant" size="large"
+      /></v-btn>
+    </v-col>
     <v-col>
       <v-tooltip
         class="tooltip"
diff --git a/frontend/src/components/Details/Saves.vue b/frontend/src/components/Details/Saves.vue
index 4515dd3d1..b1ff35a8d 100644
--- a/frontend/src/components/Details/Saves.vue
+++ b/frontend/src/components/Details/Saves.vue
@@ -1,13 +1,11 @@
 <script setup lang="ts">
-import { ref, inject } from "vue";
-import type { Emitter } from "mitt";
-
-import type { Events } from "@/types/emitter";
-import { formatBytes } from "@/utils";
+import type { SaveSchema } from "@/__generated__";
 import saveApi from "@/services/api/save";
 import storeRoms, { type Rom } from "@/stores/roms";
-
-import type { SaveSchema } from "@/__generated__";
+import type { Events } from "@/types/emitter";
+import { formatBytes } from "@/utils";
+import type { Emitter } from "mitt";
+import { inject, ref } from "vue";
 
 const props = defineProps<{ rom: Rom }>();
 const savesToUpload = ref<File[]>([]);
@@ -104,7 +102,9 @@ async function uploadSaves() {
       v-for="save in rom.user_saves"
       :key="save.id"
       :title="save.file_name"
-      :subtitle="`${save.emulator || 'unknown'} - ${formatBytes(save.file_size_bytes)}`"
+      :subtitle="`${save.emulator || 'unknown'} - ${formatBytes(
+        save.file_size_bytes
+      )}`"
     >
       <template v-slot:prepend>
         <v-checkbox
diff --git a/frontend/src/components/Game/Card/ActionBar.vue b/frontend/src/components/Game/Card/ActionBar.vue
index 038009abc..1b42a3a16 100644
--- a/frontend/src/components/Game/Card/ActionBar.vue
+++ b/frontend/src/components/Game/Card/ActionBar.vue
@@ -13,42 +13,41 @@ const downloadStore = storeDownload();
 </script>
 
 <template>
-    <v-row no-gutters>
-      <v-col class="pa-0">
+  <v-row no-gutters>
+    <v-col class="pa-0">
+      <v-btn
+        class="action-bar-btn"
+        @click="romApi.downloadRom({ rom })"
+        :disabled="downloadStore.value.includes(rom.id)"
+        icon="mdi-download"
+        size="x-small"
+        rounded="0"
+        variant="text"
+      />
+      <v-btn
+        class="action-bar-btn"
+        :href="`/play/${rom.id}`"
+        icon="mdi-play"
+        size="x-small"
+        rounded="0"
+        variant="text"
+      />
+    </v-col>
+    <v-menu location="bottom">
+      <template v-slot:activator="{ props }">
         <v-btn
           class="action-bar-btn"
-          @click="romApi.downloadRom({ rom })"
-          :disabled="downloadStore.value.includes(rom.id)"
-          icon="mdi-download"
+          :disabled="!auth.scopes.includes('roms.write')"
+          v-bind="props"
+          icon="mdi-dots-vertical"
           size="x-small"
           rounded="0"
           variant="text"
         />
-        <v-btn
-          v-if="rom.platform_slug.toLowerCase() in platformSlugEJSCoreMap"
-          class="action-bar-btn"
-          :href="`/play/${rom.id}`"
-          icon="mdi-play"
-          size="x-small"
-          rounded="0"
-          variant="text"
-        />
-      </v-col>
-      <v-menu location="bottom">
-        <template v-slot:activator="{ props }">
-          <v-btn
-            class="action-bar-btn"
-            :disabled="!auth.scopes.includes('roms.write')"
-            v-bind="props"
-            icon="mdi-dots-vertical"
-            size="x-small"
-            rounded="0"
-            variant="text"
-          />
-        </template>
-        <admin-menu :rom="rom" />
-      </v-menu>
-    </v-row>
+      </template>
+      <admin-menu :rom="rom" />
+    </v-menu>
+  </v-row>
 </template>
 
 <style scoped>
diff --git a/frontend/src/services/api/rom.ts b/frontend/src/services/api/rom.ts
index 09f55f79b..3edea620c 100644
--- a/frontend/src/services/api/rom.ts
+++ b/frontend/src/services/api/rom.ts
@@ -63,11 +63,7 @@ async function getRecentRoms(): Promise<{ data: CursorPage_RomSchema_ }> {
   });
 }
 
-async function getRom({
-  romId,
-}: {
-  romId: number;
-}): Promise<{ data: Rom }> {
+async function getRom({ romId }: { romId: number }): Promise<{ data: Rom }> {
   return api.get(`/roms/${romId}`);
 }
 
@@ -107,9 +103,11 @@ socket.on("download:complete", clearRomFromDownloads);
 async function downloadRom({
   rom,
   files = [],
+  shareLink = false,
 }: {
   rom: Rom;
   files?: string[];
+  shareLink?: boolean;
 }) {
   // Force download of all multirom-parts when no part is selected
   if (files.length == 0) {
@@ -123,17 +121,22 @@ async function downloadRom({
 
   const a = document.createElement("a");
   a.href = `/api/roms/${rom.id}/content/${rom.file_name}?${files_params}`;
-  a.click();
-
-  // Only connect socket if multi-file download
-  if (rom.multi && files.length > 1) {
-    if (!socket.connected) socket.connect();
-    storeDownload().add(rom.id);
-
-    // Clear download state after 60 seconds in case error/timeout
-    setTimeout(() => {
-      clearRomFromDownloads(rom);
-    }, 60 * 1000);
+  if (shareLink) {
+    navigator.clipboard.writeText(encodeURI(a.href));
+    return encodeURI(a.href);
+  } else {
+    a.click();
+
+    // Only connect socket if multi-file download
+    if (rom.multi && files.length > 1) {
+      if (!socket.connected) socket.connect();
+      storeDownload().add(rom.id);
+
+      // Clear download state after 60 seconds in case error/timeout
+      setTimeout(() => {
+        clearRomFromDownloads(rom);
+      }, 60 * 1000);
+    }
   }
 }
 
@@ -144,7 +147,7 @@ export type UpdateRom = Rom & {
 async function updateRom({
   rom,
   renameAsIGDB = false,
-  removeCover = false
+  removeCover = false,
 }: {
   rom: UpdateRom;
   renameAsIGDB?: boolean;

From 98f60fb00183df3d2b5be780bdd6d9af7d4437cc Mon Sep 17 00:00:00 2001
From: HellLord <ratul.debnath.year@gmail.com>
Date: Sat, 13 Apr 2024 11:37:41 +0600
Subject: [PATCH 59/61] adds more configuration for external redis

add env vars: REDIS_USERNAME, REDIS_DB

Co-Authored-By: Zurdi <34356590+zurdi15@users.noreply.github.com>
Co-Authored-By: Georges-Antoine Assi <3247106+gantoine@users.noreply.github.com>
---
 backend/config/__init__.py       | 2 ++
 backend/handler/redis_handler.py | 9 +++++----
 unraid_template/romm.xml         | 4 +++-
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/backend/config/__init__.py b/backend/config/__init__.py
index 1ec54d3ed..a4e7296f3 100644
--- a/backend/config/__init__.py
+++ b/backend/config/__init__.py
@@ -29,6 +29,8 @@
 REDIS_HOST: Final = os.environ.get("REDIS_HOST", "127.0.0.1")
 REDIS_PORT: Final = os.environ.get("REDIS_PORT", 6379)
 REDIS_PASSWORD: Final = os.environ.get("REDIS_PASSWORD")
+REDIS_USERNAME: Final = os.environ.get("REDIS_USERNAME", "")
+REDIS_DB: Final = int(os.environ.get("REDIS_DB", 0))
 
 # IGDB
 IGDB_CLIENT_ID: Final = os.environ.get(
diff --git a/backend/handler/redis_handler.py b/backend/handler/redis_handler.py
index 65fd58106..88bab8321 100644
--- a/backend/handler/redis_handler.py
+++ b/backend/handler/redis_handler.py
@@ -1,7 +1,7 @@
 import sys
 from enum import Enum
 
-from config import REDIS_HOST, REDIS_PORT, REDIS_PASSWORD
+from config import REDIS_HOST, REDIS_PORT, REDIS_PASSWORD, REDIS_USERNAME, REDIS_DB
 from logger.logger import log
 from redis import Redis
 from fakeredis import FakeStrictRedis
@@ -14,8 +14,8 @@ class QueuePrio(Enum):
     LOW = "low"
 
 
-redis_client = Redis(host=REDIS_HOST, port=REDIS_PORT, password=REDIS_PASSWORD, db=0)
-redis_url = f"redis://:{REDIS_PASSWORD}@{REDIS_HOST}:{REDIS_PORT}" if REDIS_PASSWORD else f"redis://{REDIS_HOST}:{REDIS_PORT}"
+redis_client = Redis(host=REDIS_HOST, port=REDIS_PORT, password=REDIS_PASSWORD, username=REDIS_USERNAME, db=REDIS_DB)
+redis_url = f"redis://{REDIS_USERNAME}:{REDIS_PASSWORD}@{REDIS_HOST}:{REDIS_PORT}/{REDIS_DB}" if REDIS_PASSWORD else f"redis://{REDIS_HOST}:{REDIS_PORT}/{REDIS_DB}"
 
 high_prio_queue = Queue(name=QueuePrio.HIGH.value, connection=redis_client)
 default_queue = Queue(name=QueuePrio.DEFAULT.value, connection=redis_client)
@@ -30,7 +30,8 @@ class QueuePrio(Enum):
         host=REDIS_HOST,
         port=REDIS_PORT,
         password=REDIS_PASSWORD,
-        db=0,
+        username=REDIS_USERNAME,
+        db=REDIS_DB,
         decode_responses=True,
     )
     log.info(f"Redis connection established in {sys.argv[0]}!")
diff --git a/unraid_template/romm.xml b/unraid_template/romm.xml
index c687a2cb5..09427bba2 100644
--- a/unraid_template/romm.xml
+++ b/unraid_template/romm.xml
@@ -39,7 +39,9 @@
    <Config Name="DB_PASSWD" Target="DB_PASSWD" Default="" Mode="" Description="Database password for DB_USER" Type="Variable" Display="advanced" Required="true" Mask="true"/>
    <Config Name="REDIS_HOST" Target="REDIS_HOST" Default="127.0.0.1" Mode="" Description="Redis host" Type="Variable" Display="advanced" Required="false" Mask="false"/>
    <Config Name="REDIS_PORT" Target="REDIS_PORT" Default="6379" Mode="" Description="Redis port" Type="Variable" Display="advanced" Required="false" Mask="false"/>
-   <Config Name="REDIS_PASSWORD" Target="REDIS_PASSWORD" Default="" Mode="" Description="Redis password" Type="Variable" Display="advanced" Required="false" Mask="false"/>
+   <Config Name="REDIS_PASSWORD" Target="REDIS_PASSWORD" Default="" Mode="" Description="Redis password" Type="Variable" Display="advanced" Required="false" Mask="true"/>
+   <Config Name="REDIS_USERNAME" Target="REDIS_USERNAME" Default="" Mode="" Description="Redis username" Type="Variable" Display="advanced" Required="false" Mask="false"/>
+   <Config Name="REDIS_DB" Target="REDIS_DB" Default="0" Mode="" Description="Redis database" Type="Variable" Display="advanced" Required="false" Mask="false"/>
    <Config Name="ROMM_AUTH_USERNAME" Target="ROMM_AUTH_USERNAME" Default="admin" Mode="" Description="Default admin username" Type="Variable" Display="advanced" Required="false" Mask="false"/>
    <Config Name="ROMM_AUTH_PASSWORD" Target="ROMM_AUTH_PASSWORD" Default="" Mode="" Description="Default admin password" Type="Variable" Display="advanced" Required="false" Mask="true"/>
    <Config Name="ROMM_AUTH_SECRET_KEY" Target="ROMM_AUTH_SECRET_KEY" Default="" Mode="" Description="Generate a key with `openssl rand -hex 32`" Type="Variable" Display="advanced" Required="false" Mask="true"/>

From b726bb5f5b6e006426f13ec37e27c2075442a26d Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Tue, 16 Apr 2024 23:47:39 +0200
Subject: [PATCH 60/61] extracted build download link to utils

---
 frontend/src/components/Details/ActionBar.vue | 39 ++++++++---------
 frontend/src/services/api/rom.ts              | 42 ++++++-------------
 frontend/src/utils/index.ts                   | 20 +++++++++
 3 files changed, 50 insertions(+), 51 deletions(-)

diff --git a/frontend/src/components/Details/ActionBar.vue b/frontend/src/components/Details/ActionBar.vue
index 118277474..e1e18d0c8 100644
--- a/frontend/src/components/Details/ActionBar.vue
+++ b/frontend/src/components/Details/ActionBar.vue
@@ -5,7 +5,7 @@ import storeAuth from "@/stores/auth";
 import storeDownload from "@/stores/download";
 import type { Rom } from "@/stores/roms";
 import type { Events } from "@/types/emitter";
-import { platformSlugEJSCoreMap } from "@/utils";
+import { getDownloadLink, platformSlugEJSCoreMap } from "@/utils";
 import type { Emitter } from "mitt";
 import { inject, ref } from "vue";
 
@@ -24,27 +24,22 @@ function toggleEmulation() {
   emitter?.emit("showEmulation", null);
 }
 
-async function copyDownloadLink(rom: Rom) {
-  const downloadLink = await romApi.downloadRom({
-    rom,
-    files: downloadStore.filesToDownloadMultiFileRom,
-    shareLink: true,
+function copyDownloadLink(rom: Rom) {
+  navigator.clipboard.writeText(
+    location.host +
+      encodeURI(
+        getDownloadLink({
+          rom,
+          files: downloadStore.filesToDownloadMultiFileRom,
+        })
+      )
+  );
+  emitter?.emit("snackbarShow", {
+    msg: "Download link copied to clipboard!",
+    icon: "mdi-check-bold",
+    color: "green",
+    timeout: 2000,
   });
-  if (downloadLink) {
-    emitter?.emit("snackbarShow", {
-      msg: "Download link copied to clipboard!",
-      icon: "mdi-check-bold",
-      color: "green",
-      timeout: 2000,
-    });
-  } else {
-    emitter?.emit("snackbarShow", {
-      msg: `Unable to copy download link: ${downloadLink}`,
-      icon: "mdi-close-circle",
-      color: "red",
-      timeout: 4000,
-    });
-  }
 }
 </script>
 
@@ -68,7 +63,7 @@ async function copyDownloadLink(rom: Rom) {
     </v-col>
     <v-col>
       <v-btn @click="copyDownloadLink(rom)" rounded="0" color="primary" block
-        ><v-icon icon="mdi-share-variant" size="large"
+        ><v-icon icon="mdi-content-copy" size="large"
       /></v-btn>
     </v-col>
     <v-col>
diff --git a/frontend/src/services/api/rom.ts b/frontend/src/services/api/rom.ts
index 3edea620c..03f78b7e5 100644
--- a/frontend/src/services/api/rom.ts
+++ b/frontend/src/services/api/rom.ts
@@ -9,6 +9,7 @@ import api from "@/services/api/index";
 import socket from "@/services/socket";
 import storeDownload from "@/stores/download";
 import type { Rom } from "@/stores/roms";
+import { getDownloadLink } from "@/utils";
 
 export const romApi = api;
 
@@ -103,40 +104,23 @@ socket.on("download:complete", clearRomFromDownloads);
 async function downloadRom({
   rom,
   files = [],
-  shareLink = false,
 }: {
   rom: Rom;
   files?: string[];
-  shareLink?: boolean;
 }) {
-  // Force download of all multirom-parts when no part is selected
-  if (files.length == 0) {
-    files = rom.files;
-  }
-
-  var files_params = "";
-  files.forEach((file) => {
-    files_params += `files=${file}&`;
-  });
-
   const a = document.createElement("a");
-  a.href = `/api/roms/${rom.id}/content/${rom.file_name}?${files_params}`;
-  if (shareLink) {
-    navigator.clipboard.writeText(encodeURI(a.href));
-    return encodeURI(a.href);
-  } else {
-    a.click();
-
-    // Only connect socket if multi-file download
-    if (rom.multi && files.length > 1) {
-      if (!socket.connected) socket.connect();
-      storeDownload().add(rom.id);
-
-      // Clear download state after 60 seconds in case error/timeout
-      setTimeout(() => {
-        clearRomFromDownloads(rom);
-      }, 60 * 1000);
-    }
+  a.href = getDownloadLink({ rom, files });
+  a.click();
+
+  // Only connect socket if multi-file download
+  if (rom.multi && files.length > 1) {
+    if (!socket.connected) socket.connect();
+    storeDownload().add(rom.id);
+
+    // Clear download state after 60 seconds in case error/timeout
+    setTimeout(() => {
+      clearRomFromDownloads(rom);
+    }, 60 * 1000);
   }
 }
 
diff --git a/frontend/src/utils/index.ts b/frontend/src/utils/index.ts
index 031c8b7d5..05b3522aa 100644
--- a/frontend/src/utils/index.ts
+++ b/frontend/src/utils/index.ts
@@ -1,4 +1,5 @@
 import cronstrue from "cronstrue";
+import type { Rom } from "@/stores/roms";
 
 export const views: Record<
   number,
@@ -70,6 +71,25 @@ export function convertCronExperssion(expression: string) {
   return convertedExpression;
 }
 
+export function getDownloadLink({
+  rom,
+  files = [],
+}: {
+  rom: Rom;
+  files?: string[];
+}) {
+  // Force download of all multirom-parts when no part is selected
+  if (files.length == 0) {
+    files = rom.files;
+  }
+
+  var filesParams = "";
+  files.forEach((file) => {
+    filesParams += `files=${file}&`;
+  });
+  return `/api/roms/${rom.id}/content/${rom.file_name}?${filesParams}`;
+}
+
 /**
  * Format bytes as human-readable text.
  *

From 3c5bff39fe9bad1b59a3ef1f8770125023d54345 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Wed, 17 Apr 2024 02:51:23 +0000
Subject: [PATCH 61/61] Bump gunicorn from 21.2.0 to 22.0.0

Bumps [gunicorn](https://github.com/benoitc/gunicorn) from 21.2.0 to 22.0.0.
- [Release notes](https://github.com/benoitc/gunicorn/releases)
- [Commits](https://github.com/benoitc/gunicorn/compare/21.2.0...22.0.0)

---
updated-dependencies:
- dependency-name: gunicorn
  dependency-type: direct:production
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 poetry.lock    | 13 +++++++------
 pyproject.toml |  2 +-
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/poetry.lock b/poetry.lock
index ee4c99aea..f9238a92e 100644
--- a/poetry.lock
+++ b/poetry.lock
@@ -629,22 +629,23 @@ test = ["objgraph", "psutil"]
 
 [[package]]
 name = "gunicorn"
-version = "21.2.0"
+version = "22.0.0"
 description = "WSGI HTTP Server for UNIX"
 optional = false
-python-versions = ">=3.5"
+python-versions = ">=3.7"
 files = [
-    {file = "gunicorn-21.2.0-py3-none-any.whl", hash = "sha256:3213aa5e8c24949e792bcacfc176fef362e7aac80b76c56f6b5122bf350722f0"},
-    {file = "gunicorn-21.2.0.tar.gz", hash = "sha256:88ec8bff1d634f98e61b9f65bc4bf3cd918a90806c6f5c48bc5603849ec81033"},
+    {file = "gunicorn-22.0.0-py3-none-any.whl", hash = "sha256:350679f91b24062c86e386e198a15438d53a7a8207235a78ba1b53df4c4378d9"},
+    {file = "gunicorn-22.0.0.tar.gz", hash = "sha256:4a0b436239ff76fb33f11c07a16482c521a7e09c1ce3cc293c2330afe01bec63"},
 ]
 
 [package.dependencies]
 packaging = "*"
 
 [package.extras]
-eventlet = ["eventlet (>=0.24.1)"]
+eventlet = ["eventlet (>=0.24.1,!=0.36.0)"]
 gevent = ["gevent (>=1.4.0)"]
 setproctitle = ["setproctitle"]
+testing = ["coverage", "eventlet", "gevent", "pytest", "pytest-cov"]
 tornado = ["tornado (>=0.2)"]
 
 [[package]]
@@ -2605,4 +2606,4 @@ multidict = ">=4.0"
 [metadata]
 lock-version = "2.0"
 python-versions = "^3.11"
-content-hash = "b71aa08f298631199d19da43369c8e48a80bfab87b977b4b873adfcdc9c2bedf"
+content-hash = "bebaa2b63ce34b4ff16cb4b66a3dcd5d8fbfb8b04ffbb1059e861f4cfd3a6b0a"
diff --git a/pyproject.toml b/pyproject.toml
index 1cd19d50f..78a0b3221 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -15,7 +15,7 @@ python = "^3.11"
 requests = "2.31.0"
 fastapi = "0.110.0"
 uvicorn = "0.29.0"
-gunicorn = "21.2.0"
+gunicorn = "22.0.0"
 websockets = "12.0"
 python-socketio = "5.11.1"
 SQLAlchemy = {extras = ["mypy"], version = "^2.0.28"}