From f0b7d74555b1d46fc32c21bd33aeb410de32fc70 Mon Sep 17 00:00:00 2001
From: pa <maplenagisa@gmail.com>
Date: Thu, 22 Jan 2026 21:15:46 +0900
Subject: [PATCH] improve i18n and fix tooltip focus behavior

---
 src/components/InstanceActionBar.vue           |  1 -
 src/components/NavMenu.vue                     | 18 +++++++++++++++---
 .../dialogs/AvatarDialog/AvatarDialog.vue      |  7 +------
 .../dialogs/UserDialog/UserActionDropdown.vue  |  7 +------
 .../dialogs/WorldDialog/WorldDialog.vue        |  7 +------
 src/components/ui/tooltip/TooltipProvider.vue  | 18 +++++++++---------
 src/components/ui/tooltip/TooltipWrapper.vue   |  2 +-
 src/localization/en.json                       | 10 +++++++++-
 src/shared/constants/themes.js                 |  2 +-
 9 files changed, 38 insertions(+), 34 deletions(-)

diff --git a/src/components/InstanceActionBar.vue b/src/components/InstanceActionBar.vue
index 8a8b626b..93872a62 100644
--- a/src/components/InstanceActionBar.vue
+++ b/src/components/InstanceActionBar.vue
@@ -73,7 +73,6 @@
                             <Button
                                 class="mt-1"
                                 size="xs"
-                                variant="outline"
                                 :disabled="!!instance?.closedAt"
                                 @click="closeInstance(resolvedInstanceLocation)">
                                 {{ t('dialog.user.info.close_instance') }}
diff --git a/src/components/NavMenu.vue b/src/components/NavMenu.vue
index 8b4fc608..841669e7 100644
--- a/src/components/NavMenu.vue
+++ b/src/components/NavMenu.vue
@@ -217,7 +217,7 @@
                                                     <span
                                                         class="h-3 w-3 shrink-0 rounded-sm"
                                                         :style="{ backgroundColor: theme.swatch }" />
-                                                    <span class="truncate">{{ theme.label }}</span>
+                                                    <span class="truncate">{{ themeColorDisplayName(theme) }}</span>
                                                 </span>
                                             </DropdownMenuCheckboxItem>
                                         </DropdownMenuSubContent>
@@ -235,7 +235,7 @@
                                         indicator-position="right"
                                         @select="handleTableDensitySelect('standard')">
                                         <span>{{
-                                            t('view.settings.appearance.appearance.table_density_standard')
+                                            t('view.settings.appearance.appearance.table_density_comfortable')
                                         }}</span>
                                     </DropdownMenuCheckboxItem>
                                     <DropdownMenuCheckboxItem
@@ -243,7 +243,7 @@
                                         indicator-position="right"
                                         @select="handleTableDensitySelect('comfortable')">
                                         <span>{{
-                                            t('view.settings.appearance.appearance.table_density_comfortable')
+                                            t('view.settings.appearance.appearance.table_density_standard')
                                         }}</span>
                                     </DropdownMenuCheckboxItem>
                                     <DropdownMenuCheckboxItem
@@ -567,6 +567,18 @@
         return THEME_CONFIG[themeKey]?.name ?? themeKey;
     };
 
+    const themeColorDisplayName = (theme) => {
+        if (!theme) {
+            return '';
+        }
+        const i18nKey = `view.settings.appearance.theme_color.${theme.key}`;
+        const translated = t(i18nKey);
+        if (translated !== i18nKey) {
+            return translated;
+        }
+        return theme.label || theme.key;
+    };
+
     const handleSettingsClick = () => {
         router.push({ name: 'settings' });
     };
diff --git a/src/components/dialogs/AvatarDialog/AvatarDialog.vue b/src/components/dialogs/AvatarDialog/AvatarDialog.vue
index 716d755e..9e344653 100644
--- a/src/components/dialogs/AvatarDialog/AvatarDialog.vue
+++ b/src/components/dialogs/AvatarDialog/AvatarDialog.vue
@@ -197,17 +197,12 @@
                         <TooltipWrapper
                             v-if="avatarDialog.isFavorite"
                             side="top"
-                            :ignore-non-keyboard-focus="true"
                             :content="t('dialog.avatar.actions.favorite_tooltip')">
                             <Button class="rounded-full" size="icon-lg" @click="avatarDialogCommand('Add Favorite')"
                                 ><Star
                             /></Button>
                         </TooltipWrapper>
-                        <TooltipWrapper
-                            v-else
-                            side="top"
-                            :ignore-non-keyboard-focus="true"
-                            :content="t('dialog.avatar.actions.favorite_tooltip')">
+                        <TooltipWrapper v-else side="top" :content="t('dialog.avatar.actions.favorite_tooltip')">
                             <Button
                                 class="rounded-full"
                                 size="icon-lg"
diff --git a/src/components/dialogs/UserDialog/UserActionDropdown.vue b/src/components/dialogs/UserDialog/UserActionDropdown.vue
index 72cf1cdb..6011ede1 100644
--- a/src/components/dialogs/UserDialog/UserActionDropdown.vue
+++ b/src/components/dialogs/UserDialog/UserActionDropdown.vue
@@ -4,15 +4,10 @@
             <TooltipWrapper
                 v-if="userDialog.isFavorite"
                 side="top"
-                :ignore-non-keyboard-focus="true"
                 :content="t('dialog.user.actions.unfavorite_tooltip')">
                 <Button class="rounded-full" size="icon-lg" @click="userDialogCommand('Add Favorite')"><Star /></Button>
             </TooltipWrapper>
-            <TooltipWrapper
-                v-else
-                side="top"
-                :ignore-non-keyboard-focus="true"
-                :content="t('dialog.user.actions.favorite_tooltip')">
+            <TooltipWrapper v-else side="top" :content="t('dialog.user.actions.favorite_tooltip')">
                 <Button class="rounded-full" size="icon-lg" variant="outline" @click="userDialogCommand('Add Favorite')"
                     ><Star
                 /></Button>
diff --git a/src/components/dialogs/WorldDialog/WorldDialog.vue b/src/components/dialogs/WorldDialog/WorldDialog.vue
index cb17dde7..95f5add8 100644
--- a/src/components/dialogs/WorldDialog/WorldDialog.vue
+++ b/src/components/dialogs/WorldDialog/WorldDialog.vue
@@ -172,17 +172,12 @@
                         <TooltipWrapper
                             v-if="worldDialog.isFavorite"
                             side="top"
-                            :ignore-non-keyboard-focus="true"
                             :content="t('dialog.world.actions.favorites_tooltip')">
                             <Button class="rounded-full" size="icon-lg" @click="worldDialogCommand('Add Favorite')"
                                 ><Star
                             /></Button>
                         </TooltipWrapper>
-                        <TooltipWrapper
-                            v-else
-                            side="top"
-                            :ignore-non-keyboard-focus="true"
-                            :content="t('dialog.world.actions.favorites_tooltip')">
+                        <TooltipWrapper v-else side="top" :content="t('dialog.world.actions.favorites_tooltip')">
                             <Button
                                 class="rounded-full"
                                 size="icon-lg"
diff --git a/src/components/ui/tooltip/TooltipProvider.vue b/src/components/ui/tooltip/TooltipProvider.vue
index 6cedb1d9..297f18aa 100644
--- a/src/components/ui/tooltip/TooltipProvider.vue
+++ b/src/components/ui/tooltip/TooltipProvider.vue
@@ -1,14 +1,14 @@
 <script setup>
-import { TooltipProvider } from 'reka-ui';
+    import { TooltipProvider } from 'reka-ui';
 
-const props = defineProps({
-    delayDuration: { type: Number, required: false, default: 0 },
-    skipDelayDuration: { type: Number, required: false },
-    disableHoverableContent: { type: Boolean, required: false },
-    disableClosingTrigger: { type: Boolean, required: false },
-    disabled: { type: Boolean, required: false },
-    ignoreNonKeyboardFocus: { type: Boolean, required: false }
-});
+    const props = defineProps({
+        delayDuration: { type: Number, required: false, default: 0 },
+        skipDelayDuration: { type: Number, required: false },
+        disableHoverableContent: { type: Boolean, required: false },
+        disableClosingTrigger: { type: Boolean, required: false },
+        disabled: { type: Boolean, required: false },
+        ignoreNonKeyboardFocus: { type: Boolean, required: false, default: true }
+    });
 </script>
 
 <template>
diff --git a/src/components/ui/tooltip/TooltipWrapper.vue b/src/components/ui/tooltip/TooltipWrapper.vue
index 744b7717..87745f26 100644
--- a/src/components/ui/tooltip/TooltipWrapper.vue
+++ b/src/components/ui/tooltip/TooltipWrapper.vue
@@ -16,7 +16,7 @@
         sideOffset: { type: Number, required: false },
         delayDuration: { type: Number, required: false },
         disableHoverableContent: { type: Boolean, required: false },
-        ignoreNonKeyboardFocus: { type: Boolean, required: false },
+        ignoreNonKeyboardFocus: { type: Boolean, required: false, default: true },
         disabled: { type: Boolean, required: false },
         triggerAsChild: { type: Boolean, required: false, default: true },
         contentClass: { type: null, required: false }
diff --git a/src/localization/en.json b/src/localization/en.json
index 3f0ddf46..40735bee 100644
--- a/src/localization/en.json
+++ b/src/localization/en.json
@@ -614,7 +614,15 @@
                     "force_iso_date_format": "Force ISO Date Format"
                 },
                 "theme_color": {
-                    "header": "Theme Color"
+                    "header": "Theme Color",
+                    "default": "Zinc",
+                    "blue": "Blue",
+                    "green": "Green",
+                    "orange": "Orange",
+                    "red": "Red",
+                    "rose": "Rose",
+                    "violet": "Violet",
+                    "yellow": "Yellow"
                 },
                 "side_panel": {
                     "header": "Side Panel",
diff --git a/src/shared/constants/themes.js b/src/shared/constants/themes.js
index 4564fcfa..26face95 100644
--- a/src/shared/constants/themes.js
+++ b/src/shared/constants/themes.js
@@ -21,7 +21,7 @@ export const THEME_CONFIG = {
 export const THEME_COLORS = [
     {
         key: 'default',
-        label: 'Default',
+        label: 'Zinc',
         swatch: 'oklch(0.205 0 0)',
         file: null
     },