From 6aa452d4e356468db4293d6dfa3a4f1ecd3d621b Mon Sep 17 00:00:00 2001
From: JzoNg <jzongcode@gmail.com>
Date: Thu, 22 Jan 2026 15:33:01 +0800
Subject: [PATCH] fix: add default value for form in HITL

---
 web/app/(humanInputLayout)/form/[token]/form.tsx       | 10 +++++-----
 .../chat/answer/human-input-content/content-item.tsx   | 10 ----------
 .../answer/human-input-content/human-input-form.tsx    |  9 +++++----
 .../base/chat/chat/answer/human-input-content/type.ts  |  1 -
 .../base/chat/chat/answer/human-input-content/utils.ts |  4 ++--
 .../nodes/human-input/components/single-run-form.tsx   |  3 +--
 web/eslint-suppressions.json                           |  2 +-
 7 files changed, 14 insertions(+), 25 deletions(-)

diff --git a/web/app/(humanInputLayout)/form/[token]/form.tsx b/web/app/(humanInputLayout)/form/[token]/form.tsx
index 033168e7a7..75cd3b6cb9 100644
--- a/web/app/(humanInputLayout)/form/[token]/form.tsx
+++ b/web/app/(humanInputLayout)/form/[token]/form.tsx
@@ -1,4 +1,5 @@
 'use client'
+import type { ButtonProps } from '@/app/components/base/button'
 import type { FormInputItem, UserAction } from '@/app/components/workflow/nodes/human-input/types'
 import type { HumanInputFormError } from '@/service/use-share'
 import {
@@ -66,10 +67,10 @@ const FormContent = () => {
       return
     const initialInputs: Record<string, string> = {}
     formData.inputs.forEach((item) => {
-      initialInputs[item.output_variable_name] = ''
+      initialInputs[item.output_variable_name] = item.placeholder.type === 'variable' ? formData.resolved_placeholder_values[item.output_variable_name] || '' : item.placeholder.value
     })
     setInputs(initialInputs)
-  }, [formData?.inputs])
+  }, [formData?.inputs, formData?.resolved_placeholder_values])
 
   // use immer
   const handleInputsChange = (name: string, value: string) => {
@@ -227,15 +228,14 @@ const FormContent = () => {
               formInputFields={formData.inputs}
               inputs={inputs}
               onInputChange={handleInputsChange}
-              resolvedPlaceholderValues={formData.resolved_placeholder_values}
             />
           ))}
           <div className="flex flex-wrap gap-1 py-1">
-            {formData.user_actions.map((action: any) => (
+            {formData.user_actions.map((action: UserAction) => (
               <Button
                 key={action.id}
                 disabled={isSubmitting}
-                variant={getButtonStyle(action.button_style) as any}
+                variant={getButtonStyle(action.button_style) as ButtonProps['variant']}
                 onClick={() => submit(action.id)}
               >
                 {action.title}
diff --git a/web/app/components/base/chat/chat/answer/human-input-content/content-item.tsx b/web/app/components/base/chat/chat/answer/human-input-content/content-item.tsx
index 6835a6d1a5..3ed777d41e 100644
--- a/web/app/components/base/chat/chat/answer/human-input-content/content-item.tsx
+++ b/web/app/components/base/chat/chat/answer/human-input-content/content-item.tsx
@@ -8,7 +8,6 @@ const ContentItem = ({
   content,
   formInputFields,
   inputs,
-  resolvedPlaceholderValues,
   onInputChange,
 }: ContentItemProps) => {
   const isInputField = (field: string) => {
@@ -30,14 +29,6 @@ const ContentItem = ({
     return formInputFields.find(field => field.output_variable_name === fieldName)
   }, [formInputFields, fieldName])
 
-  const placeholder = useMemo(() => {
-    if (!formInputField)
-      return ''
-    return formInputField.placeholder.type === 'variable'
-      ? resolvedPlaceholderValues?.[fieldName] || ''
-      : formInputField.placeholder.value
-  }, [formInputField, resolvedPlaceholderValues, fieldName])
-
   if (!isInputField(content)) {
     return (
       <Markdown content={content} />
@@ -52,7 +43,6 @@ const ContentItem = ({
       {formInputField.type === 'paragraph' && (
         <Textarea
           className="h-[104px] sm:text-xs"
-          placeholder={placeholder}
           value={inputs[fieldName]}
           onChange={(e) => { onInputChange(fieldName, e.target.value) }}
         />
diff --git a/web/app/components/base/chat/chat/answer/human-input-content/human-input-form.tsx b/web/app/components/base/chat/chat/answer/human-input-content/human-input-form.tsx
index 429143d38f..66f033a4cd 100644
--- a/web/app/components/base/chat/chat/answer/human-input-content/human-input-form.tsx
+++ b/web/app/components/base/chat/chat/answer/human-input-content/human-input-form.tsx
@@ -1,5 +1,7 @@
 'use client'
 import type { HumanInputFormProps } from './type'
+import type { ButtonProps } from '@/app/components/base/button'
+import type { UserAction } from '@/app/components/workflow/nodes/human-input/types'
 import * as React from 'react'
 import { useCallback, useState } from 'react'
 import Button from '@/app/components/base/button'
@@ -11,7 +13,7 @@ const HumanInputForm = ({
   onSubmit,
 }: HumanInputFormProps) => {
   const formToken = formData.form_token
-  const defaultInputs = initializeInputs(formData.inputs)
+  const defaultInputs = initializeInputs(formData.inputs, formData.resolved_placeholder_values || {})
   const contentList = splitByOutputVar(formData.form_content)
   const [inputs, setInputs] = useState(defaultInputs)
   const [isSubmitting, setIsSubmitting] = useState(false)
@@ -36,17 +38,16 @@ const HumanInputForm = ({
           key={index}
           content={content}
           formInputFields={formData.inputs}
-          resolvedPlaceholderValues={formData.resolved_placeholder_values || {}}
           inputs={inputs}
           onInputChange={handleInputsChange}
         />
       ))}
       <div className="flex flex-wrap gap-1 py-1">
-        {formData.actions.map((action: any) => (
+        {formData.actions.map((action: UserAction) => (
           <Button
             key={action.id}
             disabled={isSubmitting}
-            variant={getButtonStyle(action.button_style) as any}
+            variant={getButtonStyle(action.button_style) as ButtonProps['variant']}
             onClick={() => submit(formToken, action.id, inputs)}
           >
             {action.title}
diff --git a/web/app/components/base/chat/chat/answer/human-input-content/type.ts b/web/app/components/base/chat/chat/answer/human-input-content/type.ts
index a37b699e28..ce3589975c 100644
--- a/web/app/components/base/chat/chat/answer/human-input-content/type.ts
+++ b/web/app/components/base/chat/chat/answer/human-input-content/type.ts
@@ -29,6 +29,5 @@ export type ContentItemProps = {
   content: string
   formInputFields: FormInputItem[]
   inputs: Record<string, string>
-  resolvedPlaceholderValues?: Record<string, string>
   onInputChange: (name: string, value: any) => void
 }
diff --git a/web/app/components/base/chat/chat/answer/human-input-content/utils.ts b/web/app/components/base/chat/chat/answer/human-input-content/utils.ts
index d00633a940..f50e8c182e 100644
--- a/web/app/components/base/chat/chat/answer/human-input-content/utils.ts
+++ b/web/app/components/base/chat/chat/answer/human-input-content/utils.ts
@@ -28,11 +28,11 @@ export const splitByOutputVar = (content: string): string[] => {
   return parts.filter(part => part.length > 0)
 }
 
-export const initializeInputs = (formInputs: FormInputItem[]) => {
+export const initializeInputs = (formInputs: FormInputItem[], defaultValues: Record<string, string> = {}) => {
   const initialInputs: Record<string, any> = {}
   formInputs.forEach((item) => {
     if (item.type === 'text-input' || item.type === 'paragraph')
-      initialInputs[item.output_variable_name] = ''
+      initialInputs[item.output_variable_name] = item.placeholder.type === 'variable' ? defaultValues[item.output_variable_name] || '' : item.placeholder.value
     else
       initialInputs[item.output_variable_name] = undefined
   })
diff --git a/web/app/components/workflow/nodes/human-input/components/single-run-form.tsx b/web/app/components/workflow/nodes/human-input/components/single-run-form.tsx
index 36e427e750..3484eb6d8c 100644
--- a/web/app/components/workflow/nodes/human-input/components/single-run-form.tsx
+++ b/web/app/components/workflow/nodes/human-input/components/single-run-form.tsx
@@ -25,7 +25,7 @@ const FormContent = ({
   onSubmit,
 }: Props) => {
   const { t } = useTranslation()
-  const defaultInputs = initializeInputs(data.inputs)
+  const defaultInputs = initializeInputs(data.inputs, data.resolved_placeholder_values || {})
   const contentList = splitByOutputVar(data.form_content)
   const [inputs, setInputs] = useState(defaultInputs)
   const [isSubmitting, setIsSubmitting] = useState(false)
@@ -63,7 +63,6 @@ const FormContent = ({
             formInputFields={data.inputs}
             inputs={inputs}
             onInputChange={handleInputsChange}
-            resolvedPlaceholderValues={data.resolved_placeholder_values}
           />
         ))}
         <div className="flex flex-wrap gap-1 py-1">
diff --git a/web/eslint-suppressions.json b/web/eslint-suppressions.json
index 850b19980b..e4bca09a8f 100644
--- a/web/eslint-suppressions.json
+++ b/web/eslint-suppressions.json
@@ -796,7 +796,7 @@
   },
   "app/components/base/chat/chat/answer/human-input-content/human-input-form.tsx": {
     "ts/no-explicit-any": {
-      "count": 4
+      "count": 2
     }
   },
   "app/components/base/chat/chat/answer/human-input-content/type.ts": {