From 15757110cff780a72637b52037676f598e0a4072 Mon Sep 17 00:00:00 2001
From: Anton Kovalev <antonko@gmail.com>
Date: Mon, 28 Jul 2025 10:37:23 +0300
Subject: [PATCH] feat: default value option for select input fields (#21192)

Co-authored-by: crazywoola <427733928@qq.com>
Co-authored-by: GuanMu <ballmanjq@gmail.com>
---
 .../config-var/config-modal/index.tsx         | 28 +++++++++++++--
 .../base/chat/chat-with-history/hooks.tsx     |  2 +-
 .../chat-with-history/inputs-form/content.tsx |  2 +-
 .../base/chat/embedded-chatbot/hooks.tsx      |  2 +-
 .../embedded-chatbot/inputs-form/content.tsx  |  2 +-
 .../components/before-run-form/form-item.tsx  |  2 +-
 .../panel/debug-and-preview/chat-wrapper.tsx  | 35 +++++++++++++++++--
 web/i18n/de-DE/app-debug.ts                   |  3 ++
 web/i18n/en-US/app-debug.ts                   |  3 ++
 web/i18n/es-ES/app-debug.ts                   |  3 ++
 web/i18n/fr-FR/app-debug.ts                   |  3 ++
 web/i18n/hi-IN/app-debug.ts                   |  3 ++
 web/i18n/it-IT/app-debug.ts                   |  3 ++
 web/i18n/ja-JP/app-debug.ts                   |  3 ++
 web/i18n/ko-KR/app-debug.ts                   |  3 ++
 web/i18n/pl-PL/app-debug.ts                   |  3 ++
 web/i18n/pt-BR/app-debug.ts                   |  3 ++
 web/i18n/ro-RO/app-debug.ts                   |  3 ++
 web/i18n/ru-RU/app-debug.ts                   |  3 ++
 web/i18n/tr-TR/app-debug.ts                   |  3 ++
 web/i18n/uk-UA/app-debug.ts                   |  3 ++
 web/i18n/vi-VN/app-debug.ts                   |  3 ++
 web/i18n/zh-Hans/app-debug.ts                 |  3 ++
 web/i18n/zh-Hant/app-debug.ts                 |  3 ++
 24 files changed, 113 insertions(+), 11 deletions(-)

diff --git a/web/app/components/app/configuration/config-var/config-modal/index.tsx b/web/app/components/app/configuration/config-var/config-modal/index.tsx
index 8fcc0f4c0..72c66cf76 100644
--- a/web/app/components/app/configuration/config-var/config-modal/index.tsx
+++ b/web/app/components/app/configuration/config-var/config-modal/index.tsx
@@ -20,6 +20,7 @@ import FileUploadSetting from '@/app/components/workflow/nodes/_base/components/
 import Checkbox from '@/app/components/base/checkbox'
 import { DEFAULT_FILE_UPLOAD_SETTING } from '@/app/components/workflow/constants'
 import { DEFAULT_VALUE_MAX_LEN } from '@/config'
+import { SimpleSelect } from '@/app/components/base/select'
 
 const TEXT_MAX_LENGTH = 256
 
@@ -234,9 +235,30 @@ const ConfigModal: FC<IConfigModalProps> = ({
 
           )}
           {type === InputVarType.select && (
-            <Field title={t('appDebug.variableConfig.options')}>
-              <ConfigSelect options={options || []} onChange={handlePayloadChange('options')} />
-            </Field>
+            <>
+              <Field title={t('appDebug.variableConfig.options')}>
+                <ConfigSelect options={options || []} onChange={handlePayloadChange('options')} />
+              </Field>
+              {options && options.length > 0 && (
+                <Field title={t('appDebug.variableConfig.defaultValue')}>
+                  <SimpleSelect
+                    key={`default-select-${options.join('-')}`}
+                    className="w-full"
+                    items={[
+                      { value: '', name: t('appDebug.variableConfig.noDefaultValue') },
+                      ...options.filter(opt => opt.trim() !== '').map(option => ({
+                        value: option,
+                        name: option,
+                      })),
+                    ]}
+                    defaultValue={tempPayload.default || ''}
+                    onSelect={item => handlePayloadChange('default')(item.value === '' ? undefined : item.value)}
+                    placeholder={t('appDebug.variableConfig.selectDefaultValue')}
+                    allowSearch={false}
+                  />
+                </Field>
+              )}
+            </>
           )}
 
           {[InputVarType.singleFile, InputVarType.multiFiles].includes(type) && (
diff --git a/web/app/components/base/chat/chat-with-history/hooks.tsx b/web/app/components/base/chat/chat-with-history/hooks.tsx
index 76eb89164..382ded320 100644
--- a/web/app/components/base/chat/chat-with-history/hooks.tsx
+++ b/web/app/components/base/chat/chat-with-history/hooks.tsx
@@ -211,7 +211,7 @@ export const useChatWithHistory = (installedAppInfo?: InstalledApp) => {
         const isInputInOptions = item.select.options.includes(initInputs[item.select.variable])
         return {
           ...item.select,
-          default: (isInputInOptions ? initInputs[item.select.variable] : undefined) || item.default,
+          default: (isInputInOptions ? initInputs[item.select.variable] : undefined) || item.select.default,
           type: 'select',
         }
       }
diff --git a/web/app/components/base/chat/chat-with-history/inputs-form/content.tsx b/web/app/components/base/chat/chat-with-history/inputs-form/content.tsx
index 73a1f07b6..3304d50a5 100644
--- a/web/app/components/base/chat/chat-with-history/inputs-form/content.tsx
+++ b/web/app/components/base/chat/chat-with-history/inputs-form/content.tsx
@@ -73,7 +73,7 @@ const InputsFormContent = ({ showTip }: Props) => {
           {form.type === InputVarType.select && (
             <PortalSelect
               popupClassName='w-[200px]'
-              value={inputsFormValue?.[form.variable]}
+              value={inputsFormValue?.[form.variable] ?? form.default ?? ''}
               items={form.options.map((option: string) => ({ value: option, name: option }))}
               onSelect={item => handleFormChange(form.variable, item.value as string)}
               placeholder={form.label}
diff --git a/web/app/components/base/chat/embedded-chatbot/hooks.tsx b/web/app/components/base/chat/embedded-chatbot/hooks.tsx
index 8ae86bda8..4e86ad50e 100644
--- a/web/app/components/base/chat/embedded-chatbot/hooks.tsx
+++ b/web/app/components/base/chat/embedded-chatbot/hooks.tsx
@@ -199,7 +199,7 @@ export const useEmbeddedChatbot = () => {
         const isInputInOptions = item.select.options.includes(initInputs[item.select.variable])
         return {
           ...item.select,
-          default: (isInputInOptions ? initInputs[item.select.variable] : undefined) || item.default,
+          default: (isInputInOptions ? initInputs[item.select.variable] : undefined) || item.select.default,
           type: 'select',
         }
       }
diff --git a/web/app/components/base/chat/embedded-chatbot/inputs-form/content.tsx b/web/app/components/base/chat/embedded-chatbot/inputs-form/content.tsx
index c5f39718f..29fa5394e 100644
--- a/web/app/components/base/chat/embedded-chatbot/inputs-form/content.tsx
+++ b/web/app/components/base/chat/embedded-chatbot/inputs-form/content.tsx
@@ -73,7 +73,7 @@ const InputsFormContent = ({ showTip }: Props) => {
           {form.type === InputVarType.select && (
             <PortalSelect
               popupClassName='w-[200px]'
-              value={inputsFormValue?.[form.variable]}
+              value={inputsFormValue?.[form.variable] ?? form.default ?? ''}
               items={form.options.map((option: string) => ({ value: option, name: option }))}
               onSelect={item => handleFormChange(form.variable, item.value as string)}
               placeholder={form.label}
diff --git a/web/app/components/workflow/nodes/_base/components/before-run-form/form-item.tsx b/web/app/components/workflow/nodes/_base/components/before-run-form/form-item.tsx
index 269f5e0a9..430359b84 100644
--- a/web/app/components/workflow/nodes/_base/components/before-run-form/form-item.tsx
+++ b/web/app/components/workflow/nodes/_base/components/before-run-form/form-item.tsx
@@ -158,7 +158,7 @@ const FormItem: FC<Props> = ({
           type === InputVarType.select && (
             <Select
               className="w-full"
-              defaultValue={value || ''}
+              defaultValue={value || payload.default || ''}
               items={payload.options?.map(option => ({ name: option, value: option })) || []}
               onSelect={i => onChange(i.value)}
               allowSearch={false}
diff --git a/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx b/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
index 47d2c73a1..1a97357da 100644
--- a/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
+++ b/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
@@ -47,7 +47,22 @@ const ChatWrapper = (
   const startVariables = startNode?.data.variables
   const appDetail = useAppStore(s => s.appDetail)
   const workflowStore = useWorkflowStore()
-  const inputs = useStore(s => s.inputs)
+  const { inputs, setInputs } = useStore(s => ({
+    inputs: s.inputs,
+    setInputs: s.setInputs,
+  }))
+
+  const initialInputs = useMemo(() => {
+    const initInputs: Record<string, any> = {}
+    if (startVariables) {
+      startVariables.forEach((variable) => {
+        if (variable.default)
+          initInputs[variable.variable] = variable.default
+      })
+    }
+    return initInputs
+  }, [startVariables])
+
   const features = useFeatures(s => s.features)
   const config = useMemo(() => {
     return {
@@ -82,6 +97,11 @@ const ChatWrapper = (
     taskId => stopChatMessageResponding(appDetail!.id, taskId),
   )
 
+  const handleRestartChat = useCallback(() => {
+    handleRestart()
+    setInputs(initialInputs)
+  }, [handleRestart, setInputs, initialInputs])
+
   const doSend: OnSend = useCallback((message, files, isRegenerate = false, parentAnswer: ChatItem | null = null) => {
     handleSend(
       {
@@ -115,9 +135,18 @@ const ChatWrapper = (
 
   useImperativeHandle(ref, () => {
     return {
-      handleRestart,
+      handleRestart: handleRestartChat,
     }
-  }, [handleRestart])
+  }, [handleRestartChat])
+
+  useEffect(() => {
+    if (Object.keys(initialInputs).length > 0) {
+      setInputs({
+        ...initialInputs,
+        ...inputs,
+      })
+    }
+  }, [initialInputs])
 
   useEffect(() => {
     if (isResponding)
diff --git a/web/i18n/de-DE/app-debug.ts b/web/i18n/de-DE/app-debug.ts
index 1adaf6f05..5e752d00a 100644
--- a/web/i18n/de-DE/app-debug.ts
+++ b/web/i18n/de-DE/app-debug.ts
@@ -261,6 +261,9 @@ const translation = {
     options: 'Optionen',
     addOption: 'Option hinzufügen',
     apiBasedVar: 'API-basierte Variable',
+    defaultValue: 'Standardwert',
+    noDefaultValue: 'Kein Standardwert',
+    selectDefaultValue: 'Standardwert auswählen',
   },
   vision: {
     name: 'Vision',
diff --git a/web/i18n/en-US/app-debug.ts b/web/i18n/en-US/app-debug.ts
index 938cb27c1..589d91fb2 100644
--- a/web/i18n/en-US/app-debug.ts
+++ b/web/i18n/en-US/app-debug.ts
@@ -404,6 +404,9 @@ const translation = {
       atLeastOneOption: 'At least one option is required',
       optionRepeat: 'Has repeat options',
     },
+    'defaultValue': 'Default value',
+    'noDefaultValue': 'No default value',
+    'selectDefaultValue': 'Select default value',
   },
   vision: {
     name: 'Vision',
diff --git a/web/i18n/es-ES/app-debug.ts b/web/i18n/es-ES/app-debug.ts
index afdea6633..0447ea5d9 100644
--- a/web/i18n/es-ES/app-debug.ts
+++ b/web/i18n/es-ES/app-debug.ts
@@ -288,6 +288,9 @@ const translation = {
       atLeastOneOption: 'Se requiere al menos una opción',
       optionRepeat: 'Hay opciones repetidas',
     },
+    'defaultValue': 'Valor predeterminado',
+    'noDefaultValue': 'Sin valor predeterminado',
+    'selectDefaultValue': 'Seleccionar valor predeterminado',
   },
   vision: {
     name: 'Visión',
diff --git a/web/i18n/fr-FR/app-debug.ts b/web/i18n/fr-FR/app-debug.ts
index f3984c043..f71abb685 100644
--- a/web/i18n/fr-FR/app-debug.ts
+++ b/web/i18n/fr-FR/app-debug.ts
@@ -276,6 +276,9 @@ const translation = {
       atLeastOneOption: 'At least one option is required',
       optionRepeat: 'Has repeat options',
     },
+    'defaultValue': 'Valeur par défaut',
+    'noDefaultValue': 'Aucune valeur par défaut',
+    'selectDefaultValue': 'Sélectionner la valeur par défaut',
   },
   vision: {
     name: 'Vision',
diff --git a/web/i18n/hi-IN/app-debug.ts b/web/i18n/hi-IN/app-debug.ts
index ded2af413..69a40c28c 100644
--- a/web/i18n/hi-IN/app-debug.ts
+++ b/web/i18n/hi-IN/app-debug.ts
@@ -320,6 +320,9 @@ const translation = {
       atLeastOneOption: 'कम से कम एक विकल्प आवश्यक है',
       optionRepeat: 'विकल्प दोहराए गए हैं',
     },
+    'defaultValue': 'डिफ़ॉल्ट मान',
+    'noDefaultValue': 'कोई डिफ़ॉल्ट मान नहीं',
+    'selectDefaultValue': 'डिफ़ॉल्ट मान चुनें',
   },
   vision: {
     name: 'विजन',
diff --git a/web/i18n/it-IT/app-debug.ts b/web/i18n/it-IT/app-debug.ts
index bfa75b282..74f41e163 100644
--- a/web/i18n/it-IT/app-debug.ts
+++ b/web/i18n/it-IT/app-debug.ts
@@ -322,6 +322,9 @@ const translation = {
       atLeastOneOption: 'È richiesta almeno un\'opzione',
       optionRepeat: 'Ci sono opzioni ripetute',
     },
+    'defaultValue': 'Valore predefinito',
+    'noDefaultValue': 'Nessun valore predefinito',
+    'selectDefaultValue': 'Seleziona valore predefinito',
   },
   vision: {
     name: 'Visione',
diff --git a/web/i18n/ja-JP/app-debug.ts b/web/i18n/ja-JP/app-debug.ts
index decbe4863..411da76f7 100644
--- a/web/i18n/ja-JP/app-debug.ts
+++ b/web/i18n/ja-JP/app-debug.ts
@@ -392,6 +392,9 @@ const translation = {
       atLeastOneOption: '少なくとも 1 つのオプションが必要です',
       optionRepeat: '繰り返しオプションがあります',
     },
+    'defaultValue': 'デフォルト値',
+    'noDefaultValue': 'デフォルト値なし',
+    'selectDefaultValue': 'デフォルト値を選択',
   },
   vision: {
     name: 'ビジョン',
diff --git a/web/i18n/ko-KR/app-debug.ts b/web/i18n/ko-KR/app-debug.ts
index b84946841..2d28d85e9 100644
--- a/web/i18n/ko-KR/app-debug.ts
+++ b/web/i18n/ko-KR/app-debug.ts
@@ -287,6 +287,9 @@ const translation = {
       atLeastOneOption: '적어도 하나의 옵션이 필요합니다',
       optionRepeat: '옵션이 중복되어 있습니다',
     },
+    'defaultValue': '기본값',
+    'noDefaultValue': '기본값 없음',
+    'selectDefaultValue': '기본값 선택',
   },
   vision: {
     name: '비전',
diff --git a/web/i18n/pl-PL/app-debug.ts b/web/i18n/pl-PL/app-debug.ts
index dcd286d35..d6b7acd67 100644
--- a/web/i18n/pl-PL/app-debug.ts
+++ b/web/i18n/pl-PL/app-debug.ts
@@ -317,6 +317,9 @@ const translation = {
       atLeastOneOption: 'Wymagana jest co najmniej jedna opcja',
       optionRepeat: 'Powtarzają się opcje',
     },
+    'defaultValue': 'Wartość domyślna',
+    'noDefaultValue': 'Brak wartości domyślnej',
+    'selectDefaultValue': 'Wybierz wartość domyślną',
   },
   vision: {
     name: 'Wizja',
diff --git a/web/i18n/pt-BR/app-debug.ts b/web/i18n/pt-BR/app-debug.ts
index 96d78dc9a..0b031361a 100644
--- a/web/i18n/pt-BR/app-debug.ts
+++ b/web/i18n/pt-BR/app-debug.ts
@@ -293,6 +293,9 @@ const translation = {
       atLeastOneOption: 'Pelo menos uma opção é obrigatória',
       optionRepeat: 'Tem opções repetidas',
     },
+    'defaultValue': 'Valor padrão',
+    'noDefaultValue': 'Nenhum valor padrão',
+    'selectDefaultValue': 'Selecionar valor padrão',
   },
   vision: {
     name: 'Visão',
diff --git a/web/i18n/ro-RO/app-debug.ts b/web/i18n/ro-RO/app-debug.ts
index f7240055e..ad5975496 100644
--- a/web/i18n/ro-RO/app-debug.ts
+++ b/web/i18n/ro-RO/app-debug.ts
@@ -293,6 +293,9 @@ const translation = {
       atLeastOneOption: 'Este necesară cel puțin o opțiune',
       optionRepeat: 'Există opțiuni repetate',
     },
+    'defaultValue': 'Valoare implicită',
+    'noDefaultValue': 'Fără valoare implicită',
+    'selectDefaultValue': 'Selectați valoarea implicită',
   },
   vision: {
     name: 'Viziune',
diff --git a/web/i18n/ru-RU/app-debug.ts b/web/i18n/ru-RU/app-debug.ts
index 5d4dbb53d..cf0683994 100644
--- a/web/i18n/ru-RU/app-debug.ts
+++ b/web/i18n/ru-RU/app-debug.ts
@@ -329,6 +329,9 @@ const translation = {
       atLeastOneOption: 'Требуется хотя бы один вариант',
       optionRepeat: 'Есть повторяющиеся варианты',
     },
+    'defaultValue': 'Значение по умолчанию',
+    'noDefaultValue': 'Без значения по умолчанию',
+    'selectDefaultValue': 'Выберите значение по умолчанию',
   },
   vision: {
     name: 'Зрение',
diff --git a/web/i18n/tr-TR/app-debug.ts b/web/i18n/tr-TR/app-debug.ts
index 6ed0e0a5e..239bcffea 100644
--- a/web/i18n/tr-TR/app-debug.ts
+++ b/web/i18n/tr-TR/app-debug.ts
@@ -329,6 +329,9 @@ const translation = {
       atLeastOneOption: 'En az bir seçenek gereklidir',
       optionRepeat: 'Yinelenen seçenekler var',
     },
+    defaultValue: 'Varsayılan değer',
+    noDefaultValue: 'Varsayılan değer yok',
+    selectDefaultValue: 'Varsayılan değer seç',
   },
   vision: {
     name: 'Görüş',
diff --git a/web/i18n/uk-UA/app-debug.ts b/web/i18n/uk-UA/app-debug.ts
index 70bbebe37..f9614507b 100644
--- a/web/i18n/uk-UA/app-debug.ts
+++ b/web/i18n/uk-UA/app-debug.ts
@@ -287,6 +287,9 @@ const translation = {
       atLeastOneOption: 'Потрібно щонайменше одну опцію',
       optionRepeat: 'Є повторні опції',
     },
+    'defaultValue': 'Значення за замовчуванням',
+    'noDefaultValue': 'Без значення за замовчуванням',
+    'selectDefaultValue': 'Обрати значення за замовчуванням',
   },
   vision: {
     name: 'Зображення', // Vision
diff --git a/web/i18n/vi-VN/app-debug.ts b/web/i18n/vi-VN/app-debug.ts
index cd57f78e7..a63fcb183 100644
--- a/web/i18n/vi-VN/app-debug.ts
+++ b/web/i18n/vi-VN/app-debug.ts
@@ -287,6 +287,9 @@ const translation = {
       atLeastOneOption: 'Cần ít nhất một tùy chọn',
       optionRepeat: 'Có các tùy chọn trùng lặp',
     },
+    'defaultValue': 'Giá trị mặc định',
+    'noDefaultValue': 'Không có giá trị mặc định',
+    'selectDefaultValue': 'Chọn giá trị mặc định',
   },
   vision: {
     name: 'Thị giác',
diff --git a/web/i18n/zh-Hans/app-debug.ts b/web/i18n/zh-Hans/app-debug.ts
index 3728d86e5..816915661 100644
--- a/web/i18n/zh-Hans/app-debug.ts
+++ b/web/i18n/zh-Hans/app-debug.ts
@@ -394,6 +394,9 @@ const translation = {
       atLeastOneOption: '至少需要一个选项',
       optionRepeat: '选项不能重复',
     },
+    'defaultValue': '默认值',
+    'noDefaultValue': '无默认值',
+    'selectDefaultValue': '选择默认值',
   },
   vision: {
     name: '视觉',
diff --git a/web/i18n/zh-Hant/app-debug.ts b/web/i18n/zh-Hant/app-debug.ts
index b31b9a9d6..ccee536d5 100644
--- a/web/i18n/zh-Hant/app-debug.ts
+++ b/web/i18n/zh-Hant/app-debug.ts
@@ -272,6 +272,9 @@ const translation = {
       atLeastOneOption: '至少需要一個選項',
       optionRepeat: '選項不能重複',
     },
+    'defaultValue': '預設值',
+    'noDefaultValue': '無預設值',
+    'selectDefaultValue': '選擇預設值',
   },
   vision: {
     name: '視覺',