From 286ab0d4684f5dc9f7c7abc7d8d993795a560f55 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Tue, 26 Aug 2025 16:23:16 +0800
Subject: [PATCH] feat: insert the hitl config

---
 .../human-input/components/form-content.tsx    | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/web/app/components/workflow/nodes/human-input/components/form-content.tsx b/web/app/components/workflow/nodes/human-input/components/form-content.tsx
index facd0e5efe..120f980f36 100644
--- a/web/app/components/workflow/nodes/human-input/components/form-content.tsx
+++ b/web/app/components/workflow/nodes/human-input/components/form-content.tsx
@@ -1,7 +1,7 @@
 'use client'
 import PromptEditor from '@/app/components/base/prompt-editor'
 import type { FC } from 'react'
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import useAvailableVarList from '../../_base/hooks/use-available-var-list'
 import { BlockEnum } from '../../../types'
 import { useWorkflowVariableType } from '../../../hooks'
@@ -46,21 +46,33 @@ const FormContent: FC<Props> = ({
 
   const getVarType = useWorkflowVariableType()
 
+  const [needToAddFormInput, setNeedToAddFormInput] = useState(false)
+  const [newFormInputs, setNewFormInputs] = useState<FormInputItem[]>([])
   const handleInsertHITLNode = (onInsert: (command: LexicalCommand<unknown>, params: any) => void) => {
     return (payload: FormInputItem) => {
-      // todo insert into form inputs
+      const newFormInputs = [...(formInputs || []), payload]
       onInsert(INSERT_HITL_INPUT_BLOCK_COMMAND, {
         variableName: payload.output_variable_name,
         nodeId,
         nodeTitle,
-        formInputs,
+        formInputs: newFormInputs,
         onFormInputsChange,
         onFormInputItemRename,
         onFormInputItemRemove,
       })
+      setNewFormInputs(newFormInputs)
+      setNeedToAddFormInput(true)
     }
   }
 
+  // avoid update formInputs would overwrite the value just inserted
+  useEffect(() => {
+    if (needToAddFormInput) {
+      onFormInputsChange(newFormInputs)
+      setNeedToAddFormInput(false)
+    }
+  }, [value])
+
   return (
     <div>
       <PromptEditor