Add locale setting (#708)

Author: huchenlei

src/App.vue

@@ -33,6 +33,7 @@ import { StatusWsMessageStatus } from './types/apiTypes'
 import { useQueuePendingTaskCountStore } from './stores/queueStore'
 import type { ToastMessageOptions } from 'primevue/toast'
 import { useToast } from 'primevue/usetoast'
+import { i18n } from './i18n'
 
 const isLoading = computed<boolean>(() => useWorkspaceStore().spinner)
 const theme = computed<string>(() =>
@@ -68,6 +69,13 @@ watchEffect(() => {
   )
 })
 
+watchEffect(() => {
+  const locale = useSettingStore().get('Comfy.Locale')
+  if (locale) {
+    i18n.global.locale.value = locale
+  }
+})
+
 const { t } = useI18n()
 const init = () => {
   useSettingStore().addSettings(app.ui.settings)

src/stores/settingStore.ts

@@ -295,6 +295,14 @@ export const useSettingStore = defineStore('setting', {
           step: 1
         }
       })
+
+      app.ui.settings.addSetting({
+        id: 'Comfy.Locale',
+        name: 'Locale',
+        type: 'combo',
+        options: ['en', 'zh'],
+        defaultValue: navigator.language.split('-')[0] || 'en'
+      })
     },
 
     set<K extends keyof Settings>(key: K, value: Settings[K]) {