From 596bc8a08be5ecac8e58646bb7183d0a2bf1cbd8 Mon Sep 17 00:00:00 2001
From: Zurdi <zurdizurdo25@gmail.com>
Date: Sun, 11 Feb 2024 16:38:21 +0100
Subject: [PATCH] added limit of emojis to show

---
 .../components/Dialog/Rom/SearchRomGlobal.vue | 18 ++++++++-----
 frontend/src/components/Game/Card/Cover.vue   | 26 ++++++++++++++-----
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue b/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
index 58dc9fac0..0296aa83c 100644
--- a/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
+++ b/frontend/src/components/Dialog/Rom/SearchRomGlobal.vue
@@ -253,9 +253,12 @@ onBeforeUnmount(() => {
                         class="translucent mr-1 mt-1"
                         density="compact"
                       >
-                        <span class="px-0" v-for="region in rom.regions">
-                          {{ regionToEmoji(region) }}
-                        </span>
+                        <span
+                          class="px-1"
+                          v-for="region in rom.regions.slice(0, 3)"
+                        >
+                          {{ regionToEmoji(region) }} </span
+                        ><span v-if="rom.regions.length > 3">+</span>
                       </v-chip>
                       <v-chip
                         v-if="rom.languages.filter((i: string) => i).length > 0 && showLanguages"
@@ -263,9 +266,12 @@ onBeforeUnmount(() => {
                         class="translucent mr-1 mt-1"
                         density="compact"
                       >
-                        <span class="px-1" v-for="language in rom.languages">
-                          {{ languageToEmoji(language) }}
-                        </span>
+                        <span
+                          class="px-1"
+                          v-for="language in rom.languages.slice(0, 3)"
+                        >
+                          {{ languageToEmoji(language) }} </span
+                        ><span v-if="rom.languages.length > 3">+</span>
                       </v-chip>
                       <v-chip
                         v-if="
diff --git a/frontend/src/components/Game/Card/Cover.vue b/frontend/src/components/Game/Card/Cover.vue
index b4a67479e..1e5508671 100644
--- a/frontend/src/components/Game/Card/Cover.vue
+++ b/frontend/src/components/Game/Card/Cover.vue
@@ -2,6 +2,7 @@
 import storeDownload from "@/stores/download";
 import storeRoms, { type Rom } from "@/stores/roms";
 import { languageToEmoji, regionToEmoji } from "@/utils";
+import storeGalleryView from "@/stores/galleryView";
 import { ref } from "vue";
 import { useTheme } from "vuetify";
 
@@ -16,6 +17,7 @@ const downloadStore = storeDownload();
 const romsStore = storeRoms();
 const card = ref();
 const emit = defineEmits(["selectRom"]);
+const galleryViewStore = storeGalleryView();
 const showRegions = localStorage.getItem("settings.showRegions") === "true";
 const showLanguages = localStorage.getItem("settings.showLanguages") === "true";
 const showSiblings = localStorage.getItem("settings.showSiblings") === "true";
@@ -123,9 +125,15 @@ function onTouchEnd() {
             class="translucent mr-1 mt-1"
             density="compact"
           >
-            <span class="px-1" v-for="region in rom.regions">
-              {{ regionToEmoji(region) }}
-            </span>
+            <span
+              class="px-1"
+              v-for="region in rom.regions.slice(
+                0,
+                galleryViewStore.current == 0 ? 2 : 4
+              )"
+            >
+              {{ regionToEmoji(region) }} </span
+            ><span v-if="rom.regions.length > 3">+</span>
           </v-chip>
           <v-chip
             v-if="rom.languages.filter((i: string) => i).length > 0 && showLanguages"
@@ -133,9 +141,15 @@ function onTouchEnd() {
             class="translucent mr-1 mt-1"
             density="compact"
           >
-            <span class="px-1" v-for="language in rom.languages">
-              {{ languageToEmoji(language) }}
-            </span>
+            <span
+              class="px-1"
+              v-for="language in rom.languages.slice(
+                0,
+                galleryViewStore.current == 0 ? 2 : 4
+              )"
+            >
+              {{ languageToEmoji(language) }} </span
+            ><span v-if="rom.languages.length > 3">+</span>
           </v-chip>
           <v-chip
             v-if="rom.siblings && rom.siblings.length > 0 && showSiblings"