Fix error translating legacy setting options (#2648)

scripts/collect-i18n-general.ts

@@ -69,7 +69,12 @@ test('collect-i18n-general', async ({ comfyPage }) => {
         name: setting.name,
         tooltip: setting.tooltip,
         category: setting.category,
-        options: setting.options
+        options:
+          typeof setting.options === 'function'
+            ? // @ts-expect-error: Audit and deprecate usage of legacy options type:
+              // (value) => [string | {text: string, value: string}]
+              setting.options(setting.defaultValue ?? '')
+            : setting.options
       }))
   })
 

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

@@ -32,6 +32,12 @@ const props = defineProps<{
 
 const { t } = useI18n()
 function translateOptions(options: (SettingOption | string)[]) {
+  if (typeof options === 'function') {
+    // @ts-expect-error: Audit and deprecate usage of legacy options type:
+    // (value) => [string | {text: string, value: string}]
+    return translateOptions(options(props.setting.value ?? ''))
+  }
+
   return options.map((option) => {
     const optionLabel = typeof option === 'string' ? option : option.text
     const optionValue = typeof option === 'string' ? option : option.value

src/components/dialog/content/setting/__tests__/SettingItem.spec.ts

@@ -0,0 +1,47 @@
+// @ts-strict-ignore
+import { mount } from '@vue/test-utils'
+import { createPinia } from 'pinia'
+import PrimeVue from 'primevue/config'
+import { describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import SettingItem from '../SettingItem.vue'
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en'
+})
+
+vi.mock('@/utils/formatUtil', () => ({
+  normalizeI18nKey: vi.fn()
+}))
+
+describe('SettingItem', () => {
+  const mountComponent = (props: any, options = {}): any => {
+    return mount(SettingItem, {
+      global: {
+        plugins: [PrimeVue, i18n, createPinia()]
+      },
+      props,
+      ...options
+    })
+  }
+
+  it('translates options that use legacy type', () => {
+    const wrapper = mountComponent({
+      setting: {
+        id: 'Comfy.NodeInputConversionSubmenus',
+        name: 'Node Input Conversion Submenus',
+        type: 'combo',
+        value: 'Top',
+        options: (value: string) => ['Correctly Translated']
+      }
+    })
+
+    // Get the options property of the FormItem
+    const options = wrapper.vm.formItem.options
+    expect(options).toEqual([
+      { text: 'Correctly Translated', value: 'Correctly Translated' }
+    ])
+  })
+})