From 62fda3492f25b5139f99ad11f14a16ad30499ba6 Mon Sep 17 00:00:00 2001
From: Pandipipas <62224708+Pandipipas@users.noreply.github.com>
Date: Fri, 20 Feb 2026 22:29:15 +0100
Subject: [PATCH] Corrige persistencia del selector de skin en GraphicsView

---
 src/dashboard/scoreko-dev/views/Graphics.vue | 43 ++++++++++----------
 1 file changed, 22 insertions(+), 21 deletions(-)

diff --git a/src/dashboard/scoreko-dev/views/Graphics.vue b/src/dashboard/scoreko-dev/views/Graphics.vue
index 4cfc4de..efe9edb 100644
--- a/src/dashboard/scoreko-dev/views/Graphics.vue
+++ b/src/dashboard/scoreko-dev/views/Graphics.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useHead } from '@unhead/vue';
-import { computed, ref, watch, watchEffect } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { graphicsSettingsReplicant } from '../../../browser_shared/replicants';
 import { t } from '../i18n';
 
@@ -60,29 +60,30 @@ const commentaryGraphic = computed(() =>
 
 const selectedScoreboardSkin = ref<string>('');
 
-watchEffect(() => {
-  const availableSkins = scoreboardGraphics.value;
+watch(
+  [scoreboardGraphics, () => graphicsSettingsReplicant?.data?.scoreboardSkin],
+  ([availableSkins, replicatedSkin]) => {
+    if (availableSkins.length === 0) {
+      selectedScoreboardSkin.value = '';
+      return;
+    }
 
-  if (availableSkins.length === 0) {
-    selectedScoreboardSkin.value = '';
-    return;
-  }
+    const hasReplicatedSkin = availableSkins.some((graphic) => graphic.file === replicatedSkin);
+    if (hasReplicatedSkin) {
+      selectedScoreboardSkin.value = replicatedSkin ?? "";
+      return;
+    }
 
-  const replicatedSkin = graphicsSettingsReplicant?.data?.scoreboardSkin ?? '';
-  const hasReplicatedSkin = availableSkins.some((graphic) => graphic.file === replicatedSkin);
-  if (hasReplicatedSkin && selectedScoreboardSkin.value !== replicatedSkin) {
-    selectedScoreboardSkin.value = replicatedSkin;
-    return;
-  }
+    const hasCurrentSkin = availableSkins.some(
+      (graphic) => graphic.file === selectedScoreboardSkin.value,
+    );
 
-  const hasCurrentSkin = availableSkins.some(
-    (graphic) => graphic.file === selectedScoreboardSkin.value,
-  );
-
-  if (!hasCurrentSkin) {
-    selectedScoreboardSkin.value = availableSkins[0]!.file;
-  }
-});
+    if (!hasCurrentSkin) {
+      selectedScoreboardSkin.value = availableSkins[0]!.file;
+    }
+  },
+  { immediate: true },
+);
 
 watch(
   selectedScoreboardSkin,