[i18n] Translate setting options (#1858)

* Collect options

* Translate setting options

* Update locales [skip ci]

* Normalize key

* Revert change of logic

---------

Co-authored-by: github-actions <github-actions@github.com>

src/components/common/FormItem.vue

@@ -55,8 +55,11 @@ function getFormAttrs(item: FormItem) {
     case 'combo':
       attrs['options'] =
         typeof item.options === 'function'
-          ? item.options(formValue.value)
+          ? // @ts-expect-error: Audit and deprecate usage of legacy options type:
+            // (value) => [string | {text: string, value: string}]
+            item.options(formValue.value)
           : item.options
+
       if (typeof item.options[0] !== 'string') {
         attrs['optionLabel'] = 'text'
         attrs['optionValue'] = 'value'

src/components/dialog/content/setting/SettingItem.vue

@@ -20,22 +20,41 @@
 import Tag from 'primevue/tag'
 import FormItem from '@/components/common/FormItem.vue'
 import { useSettingStore } from '@/stores/settingStore'
-import { SettingParams } from '@/types/settingTypes'
+import type { SettingOption, SettingParams } from '@/types/settingTypes'
 import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
+import { normalizeI18nKey } from '@/utils/formatUtil'
 
 const props = defineProps<{
   setting: SettingParams
 }>()
 
 const { t } = useI18n()
+function translateOptions(options: (SettingOption | string)[]) {
+  return options.map((option) => {
+    const optionLabel = typeof option === 'string' ? option : option.text
+    const optionValue = typeof option === 'string' ? option : option.value
+
+    return {
+      text: t(
+        `settingsDialog.${normalizeI18nKey(props.setting.id)}.options.${normalizeI18nKey(optionLabel)}`,
+        optionLabel
+      ),
+      value: optionValue
+    }
+  })
+}
+
 const formItem = computed(() => {
-  const normalizedId = props.setting.id.replace(/\./g, '_')
+  const normalizedId = normalizeI18nKey(props.setting.id)
   return {
     ...props.setting,
     name: t(`settingsDialog.${normalizedId}.name`, props.setting.name),
     tooltip: props.setting.tooltip
       ? t(`settingsDialog.${normalizedId}.tooltip`, props.setting.tooltip)
+      : undefined,
+    options: props.setting.options
+      ? translateOptions(props.setting.options)
       : undefined
   }
 })