Merge pull request #1138 from SaraVieira/feat/unmatch-rom

Allow user to unmatch rom
2026-02-18 23:42:07 +01:00 · 2024-08-30 16:41:01 -04:00
parent 79780453cb 885aeab705
commit 72fc6d86c0
19 changed files with 182 additions and 80 deletions
--- a/backend/endpoints/rom.py
+++ b/backend/endpoints/rom.py
@@ -290,6 +290,7 @@ async def update_rom(
    rename_as_source: bool = False,
    remove_cover: bool = False,
    artwork: UploadFile | None = None,
+    unmatch_metadata: bool = False,
 ) -> DetailedRomSchema:
    """Update rom endpoint

@@ -298,6 +299,7 @@ async def update_rom(
        id (Rom): Rom internal id
        rename_as_source (bool, optional): Flag to rename rom file as matched IGDB game. Defaults to False.
        artwork (UploadFile, optional): Custom artork to set as cover. Defaults to File(None).
+        unmatch_metadata: Remove the metadata matches for this game. Defaults to False.

    Raises:
        HTTPException: If a rom already have that name when enabling the rename_as_source flag
@@ -313,6 +315,31 @@ async def update_rom(
    if not rom:
        raise RomNotFoundInDatabaseException(id)

+    if unmatch_metadata:
+        db_rom_handler.update_rom(
+            id,
+            {
+                "igdb_id": None,
+                "sgdb_id": None,
+                "moby_id": None,
+                "name": rom.file_name,
+                "summary": "",
+                "url_screenshots": [],
+                "path_screenshots": [],
+                "path_cover_s": "",
+                "path_cover_l": "",
+                "url_cover": "",
+                "slug": "",
+                "igdb_metadata": {},
+                "moby_metadata": {},
+                "revision": "",
+            },
+        )
+
+        return DetailedRomSchema.from_orm_with_request(
+            db_rom_handler.get_rom(id), request
+        )
+
    cleaned_data = {
        "igdb_id": data.get("igdb_id", None),
        "moby_id": data.get("moby_id", None),
--- a/frontend/src/components/Details/Info/FileInfo.vue
+++ b/frontend/src/components/Details/Info/FileInfo.vue
@@ -23,7 +23,7 @@ const romUser = ref(
    note_raw_markdown: "",
    note_is_public: false,
    is_main_sibling: false,
-  }
+  },
 );

 // Functions
@@ -53,7 +53,7 @@ watch(
      note_is_public: false,
      is_main_sibling: false,
    };
-  }
+  },
 );
 </script>
 <template>
@@ -117,7 +117,7 @@ watch(
            v-model="downloadStore.filesToDownload"
            :label="rom.file_name"
            item-title="file_name"
-            :items="rom.files.map(f => f.filename)"
+            :items="rom.files.map((f) => f.filename)"
            rounded="0"
            density="compact"
            variant="outlined"
@@ -137,13 +137,28 @@ watch(
          <v-chip size="small" label class="mx-1 my-1">
            Size: {{ formatBytes(rom.file_size_bytes) }}
          </v-chip>
-          <v-chip v-if="!rom.multi && rom.sha1_hash" size="small" label class="mx-1 my-1">
+          <v-chip
+            v-if="!rom.multi && rom.sha1_hash"
+            size="small"
+            label
+            class="mx-1 my-1"
+          >
            SHA-1: {{ rom.sha1_hash }}
          </v-chip>
-          <v-chip v-if="!rom.multi && rom.md5_hash" size="small" label class="mx-1 my-1">
-            MD5: {{ rom.md5_hash  }}
+          <v-chip
+            v-if="!rom.multi && rom.md5_hash"
+            size="small"
+            label
+            class="mx-1 my-1"
+          >
+            MD5: {{ rom.md5_hash }}
          </v-chip>
-          <v-chip v-if="!rom.multi && rom.crc_hash" size="small" label class="mx-1 my-1">
+          <v-chip
+            v-if="!rom.multi && rom.crc_hash"
+            size="small"
+            label
+            class="mx-1 my-1"
+          >
            CRC: {{ rom.crc_hash }}
          </v-chip>
        </v-col>
@@ -180,7 +195,7 @@ watch(
        <v-col>
          <v-chip
            v-for="collection in collectionsWithoutFavourites(
-              rom.user_collections
+              rom.user_collections,
            )"
            :to="{ name: 'collection', params: { collection: collection.id } }"
            size="large"
--- a/frontend/src/components/Details/Title.vue
+++ b/frontend/src/components/Details/Title.vue
@@ -11,7 +11,7 @@ import { useDisplay } from "vuetify";
 const props = defineProps<{ rom: DetailedRom; platform: Platform }>();
 const { smAndDown } = useDisplay();
 const releaseDate = new Date(
-  Number(props.rom.first_release_date) * 1000
+  Number(props.rom.first_release_date) * 1000,
 ).toLocaleDateString("en-US", {
  day: "2-digit",
  month: "short",
--- a/frontend/src/components/Gallery/AppBar/Platform/Base.vue
+++ b/frontend/src/components/Gallery/AppBar/Platform/Base.vue
@@ -23,7 +23,13 @@ const auth = storeAuth();

 <template>
  <v-app-bar id="gallery-app-bar" elevation="0" density="compact">
-    <platform-icon v-if="currentPlatform" :slug="currentPlatform.slug" :name="currentPlatform.name":size="36" class="mx-2" />
+    <platform-icon
+      v-if="currentPlatform"
+      :slug="currentPlatform.slug"
+      :name="currentPlatform.name"
+      :size="36"
+      class="mx-2"
+    />
    <firmware-btn />
    <filter-btn />
    <filter-text-field v-if="!xs" />
--- a/frontend/src/components/Gallery/FabOverlay.vue
+++ b/frontend/src/components/Gallery/FabOverlay.vue
@@ -69,7 +69,7 @@ function resetSelection() {
 async function addToFavourites() {
  if (!favCollection.value) return;
  favCollection.value.roms = favCollection.value.roms.concat(
-    selectedRoms.value.map((r) => r.id)
+    selectedRoms.value.map((r) => r.id),
  );
  await collectionApi
    .updateCollection({ collection: favCollection.value as Collection })
@@ -98,7 +98,7 @@ async function addToFavourites() {
 async function removeFromFavourites() {
  if (!favCollection.value) return;
  favCollection.value.roms = favCollection.value.roms.filter(
-    (value) => !selectedRoms.value.map((r) => r.id).includes(value)
+    (value) => !selectedRoms.value.map((r) => r.id).includes(value),
  );
  if (romsStore.currentCollection?.name.toLowerCase() == "favourites") {
    romsStore.remove(selectedRoms.value);
@@ -210,7 +210,7 @@ function onDownload() {
            ? emitter?.emit('showAddToCollectionDialog', romsStore.selectedRoms)
            : emitter?.emit(
                'showRemoveFromCollectionDialog',
-                romsStore.selectedRoms
+                romsStore.selectedRoms,
              )
        "
      />
@@ -259,6 +259,6 @@ function onDownload() {
  pointer-events: none;
 }
 .sticky-bottom * {
-    pointer-events: auto; /* Re-enables pointer events for all child elements */
+  pointer-events: auto; /* Re-enables pointer events for all child elements */
 }
 </style>
--- a/frontend/src/components/Management/Dialog/CreatePlatformBinding.vue
+++ b/frontend/src/components/Management/Dialog/CreatePlatformBinding.vue
@@ -42,10 +42,10 @@ emitter?.on(
      });
    fsSlugToCreate.value = fsSlug;
    selectedPlatform.value = supportedPlatforms.value?.find(
-      (platform) => platform.slug == slug
+      (platform) => platform.slug == slug,
    );
    show.value = true;
-  }
+  },
 );

 // Functions
@@ -60,7 +60,7 @@ function addBindPlatform() {
      if (selectedPlatform.value) {
        configStore.addPlatformBinding(
          fsSlugToCreate.value,
-          selectedPlatform.value.slug
+          selectedPlatform.value.slug,
        );
      }
    })
--- a/frontend/src/components/Management/Dialog/CreatePlatformVersion.vue
+++ b/frontend/src/components/Management/Dialog/CreatePlatformVersion.vue
@@ -42,10 +42,10 @@ emitter?.on(
      });
    fsSlugToCreate.value = fsSlug;
    selectedPlatform.value = supportedPlatforms.value?.find(
-      (platform) => platform.slug == slug
+      (platform) => platform.slug == slug,
    );
    show.value = true;
-  }
+  },
 );

 // Functions
@@ -60,7 +60,7 @@ function addVersionPlatform() {
      if (selectedPlatform.value) {
        configStore.addPlatformBinding(
          fsSlugToCreate.value,
-          selectedPlatform.value.slug
+          selectedPlatform.value.slug,
        );
      }
    })
--- a/frontend/src/components/common/Game/Dialog/EditRom.vue
+++ b/frontend/src/components/common/Game/Dialog/EditRom.vue
@@ -6,7 +6,7 @@ import storeHeartbeat from "@/stores/heartbeat";
 import storeRoms, { type SimpleRom } from "@/stores/roms";
 import type { Events } from "@/types/emitter";
 import type { Emitter } from "mitt";
-import { inject, ref } from "vue";
+import { inject, ref, computed } from "vue";
 import { useRoute } from "vue-router";
 import { useDisplay, useTheme } from "vuetify";

@@ -55,26 +55,27 @@ async function removeArtwork() {
  removeCover.value = true;
 }

-async function updateRom() {
-  if (!rom.value) return;
-
-  if (!rom.value.file_name) {
-    emitter?.emit("snackbarShow", {
-      msg: "Cannot save: file name is required",
-      icon: "mdi-close-circle",
-      color: "red",
-    });
-    return;
-  }
+const noMetadataMatch = computed(() => {
+  return !rom.value?.igdb_id && !rom.value?.moby_id && !rom.value?.sgdb_id;
+});

+async function handleRomUpdate(
+  options: {
+    rom: UpdateRom;
+    renameAsSource?: boolean;
+    removeCover?: boolean;
+    unmatch?: boolean;
+  },
+  successMessage: string,
+) {
  show.value = false;
  emitter?.emit("showLoadingDialog", { loading: true, scrim: true });

  await romApi
-    .updateRom({ rom: rom.value, removeCover: removeCover.value })
+    .updateRom(options)
    .then(({ data }) => {
      emitter?.emit("snackbarShow", {
-        msg: "Rom updated successfully!",
+        msg: successMessage,
        icon: "mdi-check-bold",
        color: "green",
      });
@@ -97,6 +98,30 @@ async function updateRom() {
    });
 }

+async function unmatchRom() {
+  if (!rom.value) return;
+  await handleRomUpdate(
+    { rom: rom.value, unmatch: true },
+    "Rom unmatched successfully",
+  );
+}
+
+async function updateRom() {
+  if (!rom.value?.file_name) {
+    emitter?.emit("snackbarShow", {
+      msg: "Cannot save: file name is required",
+      icon: "mdi-close-circle",
+      color: "red",
+    });
+    return;
+  }
+
+  await handleRomUpdate(
+    { rom: rom.value, removeCover: removeCover.value },
+    "Rom updated successfully!",
+  );
+}
+
 function closeDialog() {
  show.value = false;
  imagePreviewUrl.value = "";
@@ -164,10 +189,30 @@ function closeDialog() {
                variant="outlined"
                required
                hide-details
-                @keyup.enter="updateRom()"
+                @keyup.enter="updateRom"
              />
            </v-col>
          </v-row>
+          <v-row class="justify-space-between mt-4 mb-2 mx-2" no-gutters>
+            <v-btn-group divided density="compact">
+              <v-btn
+                :disabled="noMetadataMatch"
+                :class="` ${
+                  noMetadataMatch ? '' : 'bg-terciary text-romm-red'
+                }`"
+                variant="flat"
+                @click="unmatchRom"
+              >
+                Unmatch Rom
+              </v-btn>
+            </v-btn-group>
+            <v-btn-group divided density="compact">
+              <v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
+              <v-btn class="text-romm-green bg-terciary" @click="updateRom">
+                Save
+              </v-btn>
+            </v-btn-group>
+          </v-row>
        </v-col>
        <v-col>
          <v-row class="pa-2 justify-center" no-gutters>
@@ -222,16 +267,6 @@ function closeDialog() {
        </v-col>
      </v-row>
    </template>
-    <template #append>
-      <v-row class="justify-center mt-4 mb-2" no-gutters>
-        <v-btn-group divided density="compact">
-          <v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
-          <v-btn class="text-romm-green bg-terciary" @click="updateRom">
-            Apply
-          </v-btn>
-        </v-btn-group>
-      </v-row>
-    </template>
  </r-dialog>
 </template>
 <style scoped>
--- a/frontend/src/components/common/Game/Dialog/SearchRom.vue
+++ b/frontend/src/components/common/Game/Dialog/SearchRom.vue
@@ -43,7 +43,7 @@ async function filterRoms() {
  } else {
    filteredRoms.value = searchedRoms.value.filter(
      (rom: { platform_name: string }) =>
-        rom.platform_name == selectedPlatform.value?.platform_name
+        rom.platform_name == selectedPlatform.value?.platform_name,
    ) as SimpleRom[];
  }
 }
@@ -73,7 +73,7 @@ async function searchRoms() {
            platform_name: rom.platform_name,
            platform_slug: rom.platform_slug,
          },
-        ])
+        ]),
      ).values(),
    ];
    filterRoms();
--- a/frontend/src/components/common/NewVersion.vue
+++ b/frontend/src/components/common/NewVersion.vue
@@ -18,7 +18,7 @@ function dismissVersionBanner() {
 }
 onMounted(async () => {
  const response = await fetch(
-    "https://api.github.com/repos/rommapp/romm/releases/latest"
+    "https://api.github.com/repos/rommapp/romm/releases/latest",
  );
  const json = await response.json();
  GITHUB_VERSION.value = json.tag_name;
@@ -72,6 +72,6 @@ onMounted(async () => {
  pointer-events: none;
 }
 .sticky-bottom * {
-    pointer-events: auto; /* Re-enables pointer events for all child elements */
+  pointer-events: auto; /* Re-enables pointer events for all child elements */
 }
 </style>
--- a/frontend/src/components/common/Platform/Dialog/DeletePlatform.vue
+++ b/frontend/src/components/common/Platform/Dialog/DeletePlatform.vue
@@ -79,13 +79,8 @@ function closeDialog() {
    <template #append>
      <v-row class="justify-center pa-2" no-gutters>
        <v-btn-group divided density="compact">
-          <v-btn class="bg-terciary" @click="closeDialog" >
-            Cancel
-          </v-btn>
-          <v-btn
-            class="bg-terciary text-romm-red"
-            @click="deletePlatform"
-          >
+          <v-btn class="bg-terciary" @click="closeDialog"> Cancel </v-btn>
+          <v-btn class="bg-terciary text-romm-red" @click="deletePlatform">
            Confirm
          </v-btn>
        </v-btn-group>
--- a/frontend/src/components/common/Platform/Icon.vue
+++ b/frontend/src/components/common/Platform/Icon.vue
@@ -9,7 +9,7 @@ const props = withDefaults(
    size?: number;
    rounded?: number;
  }>(),
-  { size: 40, rounded: 0 }
+  { size: 40, rounded: 0 },
 );
 const configStore = storeConfig();
 const { config } = storeToRefs(configStore);
--- a/frontend/src/components/common/Platform/ListItem.vue
+++ b/frontend/src/components/common/Platform/ListItem.vue
@@ -15,7 +15,11 @@ withDefaults(defineProps<{ platform: Platform; rail?: boolean }>(), {
    :value="platform.slug"
  >
    <template #prepend>
-      <platform-icon :key="platform.slug" :slug="platform.slug" :name="platform.name">
+      <platform-icon
+        :key="platform.slug"
+        :slug="platform.slug"
+        :name="platform.name"
+      >
        <v-tooltip
          location="bottom"
          class="tooltip"
--- a/frontend/src/services/api/rom.ts
+++ b/frontend/src/services/api/rom.ts
@@ -128,10 +128,12 @@ async function updateRom({
  rom,
  renameAsSource = false,
  removeCover = false,
+  unmatch = false,
 }: {
  rom: UpdateRom;
  renameAsSource?: boolean;
  removeCover?: boolean;
+  unmatch?: boolean;
 }): Promise<{ data: DetailedRom }> {
  const formData = new FormData();
  if (rom.igdb_id) formData.append("igdb_id", rom.igdb_id.toString());
@@ -143,7 +145,11 @@ async function updateRom({
  if (rom.artwork) formData.append("artwork", rom.artwork);

  return api.put(`/roms/${rom.id}`, formData, {
-    params: { rename_as_source: renameAsSource, remove_cover: removeCover },
+    params: {
+      rename_as_source: renameAsSource,
+      remove_cover: removeCover,
+      unmatch_metadata: unmatch,
+    },
  });
 }

--- a/frontend/src/views/EmulatorJS/Base.vue
+++ b/frontend/src/views/EmulatorJS/Base.vue
@@ -68,12 +68,12 @@ onMounted(async () => {
  } else if (rom.value.user_states) {
    // Otherwise auto select most recent state by last updated date
    stateRef.value = rom.value.user_states?.sort((a, b) =>
-      b.updated_at.localeCompare(a.updated_at)
+      b.updated_at.localeCompare(a.updated_at),
    )[0];
  }

  const storedBiosID = localStorage.getItem(
-    `player:${rom.value.platform_slug}:bios_id`
+    `player:${rom.value.platform_slug}:bios_id`,
  );
  if (storedBiosID) {
    biosRef.value =
@@ -82,7 +82,7 @@ onMounted(async () => {
  }

  const storedCore = localStorage.getItem(
-    `player:${rom.value.platform_slug}:core`
+    `player:${rom.value.platform_slug}:core`,
  );
  if (storedCore) {
    coreRef.value = storedCore;
--- a/frontend/src/views/Gallery/Collection.vue
+++ b/frontend/src/views/Gallery/Collection.vue
@@ -69,7 +69,7 @@ async function fetchRoms() {
        timeout: 4000,
      });
      console.error(
-        `Couldn't fetch roms for collection ID ${currentCollection.value?.id}: ${error}`
+        `Couldn't fetch roms for collection ID ${currentCollection.value?.id}: ${error}`,
      );
      noCollectionError.value = true;
    })
@@ -87,28 +87,28 @@ function setFilters() {
    ...new Set(
      romsStore.filteredRoms
        .flatMap((rom) => rom.genres.map((genre) => genre))
-        .sort()
+        .sort(),
    ),
  ]);
  galleryFilterStore.setFilterFranchises([
    ...new Set(
      romsStore.filteredRoms
        .flatMap((rom) => rom.franchises.map((franchise) => franchise))
-        .sort()
+        .sort(),
    ),
  ]);
  galleryFilterStore.setFilterCompanies([
    ...new Set(
      romsStore.filteredRoms
        .flatMap((rom) => rom.companies.map((company) => company))
-        .sort()
+        .sort(),
    ),
  ]);
  galleryFilterStore.setFilterCollections([
    ...new Set(
      romsStore.filteredRoms
        .flatMap((rom) => rom.collections.map((collection) => collection))
-        .sort()
+        .sort(),
    ),
  ]);
 }
@@ -135,7 +135,7 @@ function onGameClick(emitData: { rom: SimpleRom; event: MouseEvent }) {
    }
    if (emitData.event.shiftKey) {
      const [start, end] = [romsStore.lastSelectedIndex, index].sort(
-        (a, b) => a - b
+        (a, b) => a - b,
      );
      if (romsStore.selectedRoms.includes(emitData.rom)) {
        for (let i = start + 1; i < end; i++) {
@@ -147,7 +147,7 @@ function onGameClick(emitData: { rom: SimpleRom; event: MouseEvent }) {
        }
      }
      romsStore.updateLastSelected(
-        romsStore.selectedRoms.includes(emitData.rom) ? index : index - 1
+        romsStore.selectedRoms.includes(emitData.rom) ? index : index - 1,
      );
    } else {
      romsStore.updateLastSelected(index);
--- a/frontend/src/views/Login.vue
+++ b/frontend/src/views/Login.vue
@@ -42,7 +42,7 @@ async function login() {
      });

      console.error(
-        `[${response.status} ${response.statusText}] ${errorMessage}`
+        `[${response.status} ${response.statusText}] ${errorMessage}`,
      );
    })
    .finally(() => {
@@ -117,7 +117,9 @@ async function login() {
    </v-card>

    <div id="version" class="position-absolute">
-      <span class="text-white text-shadow">{{ heartbeatStore.value.VERSION }}</span>
+      <span class="text-white text-shadow">{{
+        heartbeatStore.value.VERSION
+      }}</span>
    </div>
  </v-container>
 </template>
--- a/frontend/src/views/Scan.vue
+++ b/frontend/src/views/Scan.vue
@@ -311,7 +311,11 @@ async function stopScan() {
            <v-list-item class="pa-0">
              <template #prepend>
                <v-avatar :rounded="0" size="40">
-                  <platform-icon :key="platform.slug" :slug="platform.slug" :name="platform.name" />
+                  <platform-icon
+                    :key="platform.slug"
+                    :slug="platform.slug"
+                    :name="platform.name"
+                  />
                </v-avatar>
              </template>
              {{ platform.name }}
--- a/frontend/src/views/Setup.vue
+++ b/frontend/src/views/Setup.vue
@@ -43,7 +43,7 @@ const step = ref(1);
 const filledAdminUser = computed(
  () =>
    defaultAdminUser.value.username != "" &&
-    defaultAdminUser.value.password != ""
+    defaultAdminUser.value.password != "",
 );
 const isFirstStep = computed(() => step.value == 1);
 const isLastStep = computed(() => step.value == 2);
@@ -189,14 +189,20 @@ async function finishWizard() {

          <v-stepper-actions :disabled="!filledAdminUser">
            <template #prev>
-              <v-btn class="text-white text-shadow" :ripple="false" :disabled="isFirstStep" @click="prev">{{
-                isFirstStep ? "" : "previous"
-              }}</v-btn>
+              <v-btn
+                class="text-white text-shadow"
+                :ripple="false"
+                :disabled="isFirstStep"
+                @click="prev"
+                >{{ isFirstStep ? "" : "previous" }}</v-btn
+              >
            </template>
            <template #next>
-              <v-btn class="text-white text-shadow" @click="!isLastStep ? next() : finishWizard()">{{
-                !isLastStep ? "Next" : "Finish"
-              }}</v-btn>
+              <v-btn
+                class="text-white text-shadow"
+                @click="!isLastStep ? next() : finishWizard()"
+                >{{ !isLastStep ? "Next" : "Finish" }}</v-btn
+              >
            </template>
          </v-stepper-actions>
        </template>
@@ -223,7 +229,9 @@ async function finishWizard() {
  max-width: 300px;
 }
 #version {
-  text-shadow: 1px 1px 1px #000000, 0 0 1px #000000;
+  text-shadow:
+    1px 1px 1px #000000,
+    0 0 1px #000000;
  bottom: 0.3rem;
  right: 0.5rem;
 }