From 7fe7b8f9bcd700550a985cec0c47d7eef118b3ad Mon Sep 17 00:00:00 2001
From: tiny-craft <137850705+tiny-craft@users.noreply.github.com>
Date: Sat, 26 Aug 2023 00:49:44 +0800
Subject: [PATCH] perf: optimize language loading and switching timing.

---
 backend/storage/preferences.go                | 20 +++++++++++++++++++
 frontend/src/App.vue                          |  8 +++++++-
 .../components/dialogs/PreferencesDialog.vue  |  6 ------
 frontend/src/components/sidebar/NavMenu.vue   |  4 ++--
 frontend/src/langs/en.json                    |  2 +-
 frontend/src/langs/zh-cn.json                 |  2 +-
 frontend/src/stores/preferences.js            |  3 ++-
 7 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/backend/storage/preferences.go b/backend/storage/preferences.go
index d0672db..6726672 100644
--- a/backend/storage/preferences.go
+++ b/backend/storage/preferences.go
@@ -79,6 +79,26 @@ func (p *PreferencesStorage) GetPreferences() (ret map[string]any) {
 	return
 }
 
+func (p *PreferencesStorage) Value(keys ...string) any {
+	kv := p.getPreferences()
+	var ok bool
+	var a any
+	total := len(keys)
+	for i, key := range keys {
+		if a, ok = kv[key]; !ok {
+			return nil
+		}
+		if i == total-1 {
+			// last key, return value
+			return a
+		}
+		if kv, ok = a.(map[string]any); !ok {
+			return nil
+		}
+	}
+	return nil
+}
+
 func (p *PreferencesStorage) setPreferences(pf map[string]any, key string, value any) error {
 	keyPath := strings.Split(key, ".")
 	if len(keyPath) <= 0 {
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 9d5cc2d..ee5654e 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -30,7 +30,6 @@ const initializing = ref(false)
 onMounted(async () => {
     try {
         initializing.value = true
-        i18n.locale.value = prefStore.currentLanguage
         await connectionStore.initConnections()
         if (prefStore.autoCheckUpdate) {
             prefStore.checkForUpdate()
@@ -40,10 +39,17 @@ onMounted(async () => {
     }
 })
 
+// watch theme and dynamically switch
 watch(
     () => prefStore.isDark,
     (isDark) => (isDark ? WindowSetDarkTheme() : WindowSetLightTheme()),
 )
+
+// watch language and dynamically switch
+watch(
+    () => prefStore.general.language,
+    (lang) => (i18n.locale.value = prefStore.currentLanguage),
+)
 </script>
 
 <template>
diff --git a/frontend/src/components/dialogs/PreferencesDialog.vue b/frontend/src/components/dialogs/PreferencesDialog.vue
index 7e90b12..6bf5062 100644
--- a/frontend/src/components/dialogs/PreferencesDialog.vue
+++ b/frontend/src/components/dialogs/PreferencesDialog.vue
@@ -44,12 +44,6 @@ const onSavePreferences = async () => {
     }
 }
 
-// Watch language and dynamically switch
-watch(
-    () => prefStore.general.language,
-    (lang) => (i18n.locale.value = prefStore.currentLanguage),
-)
-
 const onClose = () => {
     // restore to old preferences
     prefStore.resetToLastPreferences()
diff --git a/frontend/src/components/sidebar/NavMenu.vue b/frontend/src/components/sidebar/NavMenu.vue
index 011e84e..1098410 100644
--- a/frontend/src/components/sidebar/NavMenu.vue
+++ b/frontend/src/components/sidebar/NavMenu.vue
@@ -32,7 +32,7 @@ const emit = defineEmits(['update:value'])
 
 const iconSize = computed(() => Math.floor(props.width * 0.4))
 const renderIcon = (icon) => {
-    return () => h(NIcon, null, { default: () => h(icon) })
+    return () => h(NIcon, null, { default: () => h(icon, { strokeWidth: 4 }) })
 }
 
 const connectionStore = useConnectionStore()
@@ -122,7 +122,7 @@ const openGithub = () => {
                 :render-label="renderContextLabel"
                 trigger="click"
                 @select="onSelectPreferenceMenu">
-                <icon-button :icon="Config" :size="iconSize" class="nav-menu-button" />
+                <icon-button :icon="Config" :size="iconSize" stroke-width="4" class="nav-menu-button" />
             </n-dropdown>
             <icon-button :icon="Github" :size="iconSize" class="nav-menu-button" @click="openGithub" />
         </div>
diff --git a/frontend/src/langs/en.json b/frontend/src/langs/en.json
index bf1cee2..aab36f3 100644
--- a/frontend/src/langs/en.json
+++ b/frontend/src/langs/en.json
@@ -1,5 +1,5 @@
 {
-  "lang_name": "English",
+  "name": "English",
   "system_lang": "Use System Language",
   "confirm": "Confirm",
   "cancel": "Cancel",
diff --git a/frontend/src/langs/zh-cn.json b/frontend/src/langs/zh-cn.json
index 834cae8..bbe75be 100644
--- a/frontend/src/langs/zh-cn.json
+++ b/frontend/src/langs/zh-cn.json
@@ -1,5 +1,5 @@
 {
-  "lang_name": "简体中文",
+  "name": "简体中文",
   "system_lang": "使用系统语言",
   "confirm": "确认",
   "cancel": "取消",
diff --git a/frontend/src/stores/preferences.js b/frontend/src/stores/preferences.js
index 820cce5..7706c11 100644
--- a/frontend/src/stores/preferences.js
+++ b/frontend/src/stores/preferences.js
@@ -75,7 +75,7 @@ const usePreferencesStore = defineStore('preferences', {
         langOption() {
             const options = Object.entries(lang).map(([key, value]) => ({
                 value: key,
-                label: value['lang_name'],
+                label: value['name'],
             }))
             options.splice(0, 0, {
                 value: 'auto',
@@ -162,6 +162,7 @@ const usePreferencesStore = defineStore('preferences', {
             if (success) {
                 this.lastPref = clone(data)
                 this._applyPreferences(data)
+                i18nGlobal.locale.value = this.currentLanguage
             }
         },