fix: open input field modal from var picker

web/app/components/workflow/nodes/_base/components/form-input-item.tsx

@@ -31,6 +31,8 @@ type Props = {
   inPanel?: boolean
   currentTool?: Tool
   currentProvider?: ToolWithProvider
+  showManageInputField?: boolean
+  onManageInputField?: () => void
 }
 
 const FormInputItem: FC<Props> = ({
@@ -42,6 +44,8 @@ const FormInputItem: FC<Props> = ({
   inPanel,
   currentTool,
   currentProvider,
+  showManageInputField,
+  onManageInputField,
 }) => {
   const language = useLanguage()
 
@@ -192,6 +196,8 @@ const FormInputItem: FC<Props> = ({
           onChange={handleValueChange}
           nodesOutputVars={availableVars}
           availableNodes={availableNodesWithParent}
+          showManageInputField={showManageInputField}
+          onManageInputField={onManageInputField}
         />
       )}
       {isNumber && isConstant && (

web/app/components/workflow/nodes/_base/components/prompt/editor.tsx

@@ -146,6 +146,8 @@ const Editor: FC<Props> = ({
   }
 
   const getVarType = useWorkflowVariableType()
+  const pipelineId = useStore(s => s.pipelineId)
+  const setShowInputFieldDialog = useStore(s => s.setShowInputFieldDialog)
 
   return (
     <Wrap className={cn(className, wrapClassName)} style={wrapStyle} isInNode isExpand={isExpand}>
@@ -270,6 +272,8 @@ const Editor: FC<Props> = ({
                         }
                         return acc
                       }, {} as any),
+                      showManageInputField: !!pipelineId,
+                      onManageInputField: () => setShowInputFieldDialog?.(true),
                     }}
                     onChange={onChange}
                     onBlur={setBlur}

web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/index.tsx

@@ -17,6 +17,8 @@ type MixedVariableTextInputProps = {
   availableNodes?: Node[]
   value?: string
   onChange?: (text: string) => void
+  showManageInputField?: boolean
+  onManageInputField?: () => void
 }
 const MixedVariableTextInput = ({
   readOnly = false,
@@ -24,6 +26,8 @@ const MixedVariableTextInput = ({
   availableNodes = [],
   value = '',
   onChange,
+  showManageInputField,
+  onManageInputField,
 }: MixedVariableTextInputProps) => {
   const { t } = useTranslation()
   return (
@@ -52,6 +56,8 @@ const MixedVariableTextInput = ({
           }
           return acc
         }, {} as any),
+        showManageInputField,
+        onManageInputField,
       }}
       placeholder={<Placeholder />}
       onChange={onChange}

web/app/components/workflow/nodes/tool/components/tool-form/index.tsx

@@ -16,6 +16,8 @@ type Props = {
   inPanel?: boolean
   currentTool?: Tool
   currentProvider?: ToolWithProvider
+  showManageInputField?: boolean
+  onManageInputField?: () => void
 }
 
 const ToolForm: FC<Props> = ({
@@ -27,6 +29,8 @@ const ToolForm: FC<Props> = ({
   inPanel,
   currentTool,
   currentProvider,
+  showManageInputField,
+  onManageInputField,
 }) => {
   return (
     <div className='space-y-1'>
@@ -42,6 +46,8 @@ const ToolForm: FC<Props> = ({
             inPanel={inPanel}
             currentTool={currentTool}
             currentProvider={currentProvider}
+            showManageInputField={showManageInputField}
+            onManageInputField={onManageInputField}
           />
         ))
       }

web/app/components/workflow/nodes/tool/components/tool-form/item.tsx

@@ -24,6 +24,8 @@ type Props = {
   inPanel?: boolean
   currentTool?: Tool
   currentProvider?: ToolWithProvider
+  showManageInputField?: boolean
+  onManageInputField?: () => void
 }
 
 const ToolFormItem: FC<Props> = ({
@@ -35,6 +37,8 @@ const ToolFormItem: FC<Props> = ({
   inPanel,
   currentTool,
   currentProvider,
+  showManageInputField,
+  onManageInputField,
 }) => {
   const language = useLanguage()
   const { name, label, type, required, tooltip, input_schema } = schema
@@ -89,6 +93,8 @@ const ToolFormItem: FC<Props> = ({
         inPanel={inPanel}
         currentTool={currentTool}
         currentProvider={currentProvider}
+        showManageInputField={showManageInputField}
+        onManageInputField={onManageInputField}
       />
 
       {isShowSchema && (

web/app/components/workflow/nodes/tool/panel.tsx

@@ -11,6 +11,7 @@ import Loading from '@/app/components/base/loading'
 import OutputVars, { VarItem } from '@/app/components/workflow/nodes/_base/components/output-vars'
 import StructureOutputItem from '@/app/components/workflow/nodes/_base/components/variable/object-child-tree-panel/show'
 import { Type } from '../llm/types'
+import { useStore } from '@/app/components/workflow/store'
 
 const i18nPrefix = 'workflow.nodes.tool'
 
@@ -37,6 +38,8 @@ const Panel: FC<NodePanelProps<ToolNodeType>> = ({
   } = useConfig(id, data)
 
   const [collapsed, setCollapsed] = React.useState(false)
+  const pipelineId = useStore(s => s.pipelineId)
+  const setShowInputFieldDialog = useStore(s => s.setShowInputFieldDialog)
 
   if (isLoading) {
     return <div className='flex h-[200px] items-center justify-center'>
@@ -61,6 +64,8 @@ const Panel: FC<NodePanelProps<ToolNodeType>> = ({
                 onChange={setInputVar}
                 currentProvider={currCollection}
                 currentTool={currTool}
+                showManageInputField={!!pipelineId}
+                onManageInputField={() => setShowInputFieldDialog?.(true)}
               />
             </Field>
           )}