refactor: agent parameters

web/app/components/plugins/types.ts

@@ -392,6 +392,12 @@ export type StrategyParamItem = {
   required: boolean
   default: any
   options: any[]
+  template: {
+    enabled: boolean
+  },
+  auto_generate: {
+    type: string
+  }
 }
 
 export type StrategyDetail = {

web/app/components/workflow/nodes/_base/components/agent-strategy-selector.tsx

@@ -126,8 +126,6 @@ export const AgentStrategySelector = (props: AgentStrategySelectorProps) => {
                 agent_strategy_provider_name: tool!.provider_name,
                 agent_strategy_label: tool!.tool_label,
                 agent_output_schema: tool!.output_schema,
-                agent_configurations: {},
-                agent_parameters: {},
               })
               setOpen(false)
             }}

web/app/components/workflow/nodes/_base/components/agent-strategy.tsx

@@ -14,13 +14,12 @@ import MultipleToolSelector from '@/app/components/plugins/plugin-detail-panel/m
 import Field from './field'
 import type { ComponentProps } from 'react'
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
+import Editor from './prompt/editor'
 
 export type Strategy = {
   agent_strategy_provider_name: string
   agent_strategy_name: string
   agent_strategy_label: string
-  agent_configurations?: Record<string, any>
-  agent_parameters?: Record<string, ToolVarInputs>
   agent_output_schema: Record<string, any>
 }
 
@@ -36,80 +35,16 @@ type CustomSchema<Type, Field = {}> = Omit<CredentialFormSchema, 'type'> & { typ
 
 type ToolSelectorSchema = CustomSchema<'tool-selector'>
 type MultipleToolSelectorSchema = CustomSchema<'array[tools]'>
-
-type CustomField = ToolSelectorSchema | MultipleToolSelectorSchema
-
-const devMockForm = [{
-  name: 'instruction',
-  label: {
-    en_US: 'Instruction',
-    zh_Hans: '指令',
-    pt_BR: 'Instruction',
-    ja_JP: 'Instruction',
-  },
-  placeholder: null,
-  scope: null,
-  auto_generate: {
-    type: 'prompt_instruction',
-  },
+type StringSchema = CustomSchema<'string', {
   template: {
-    enabled: true,
+    enabled: boolean
   },
-  required: true,
-  default: null,
-  min: null,
-  max: null,
-  options: [],
-  type: 'string',
-},
-{
-  name: 'query',
-  label: {
-    en_US: 'Query',
-    zh_Hans: '查询',
-    pt_BR: 'Query',
-    ja_JP: 'Query',
-  },
-  placeholder: null,
-  scope: null,
-  auto_generate: null,
-  template: null,
-  required: true,
-  default: null,
-  min: null,
-  max: null,
-  options: [],
-  type: 'string',
-},
-{
-  name: 'max iterations',
-  label: {
-    en_US: 'Max Iterations',
-    zh_Hans: '最大迭代次数',
-    pt_BR: 'Max Iterations',
-    ja_JP: 'Max Iterations',
-  },
-  placeholder: null,
-  scope: null,
-  auto_generate: null,
-  template: null,
-  required: true,
-  default: '1',
-  min: 1,
-  max: 10,
-  type: FormTypeEnum.textNumber,
-  tooltip: {
-    en_US: 'The maximum number of iterations to run',
-    zh_Hans: '运行的最大迭代次数',
-    pt_BR: 'The maximum number of iterations to run',
-    ja_JP: 'The maximum number of iterations to run',
-  },
-}].map((item) => {
-  return {
-    ...item,
-    variable: item.name,
+  auto_generate: {
+    type: string
   }
-})
+}>
+
+type CustomField = ToolSelectorSchema | MultipleToolSelectorSchema | StringSchema
 
 export const AgentStrategy = (props: AgentStrategyProps) => {
   const { strategy, onStrategyChange, formSchema, formValue, onFormValueChange } = props
@@ -188,6 +123,18 @@ export const AgentStrategy = (props: AgentStrategyProps) => {
           />
         )
       }
+      case 'string': {
+        const value = props.value[schema.variable]
+        const onChange = (value: any) => {
+          props.onChange({ ...props.value, [schema.variable]: value })
+        }
+        return <Editor
+          value={value}
+          onChange={onChange}
+          title={schema.label[language]}
+          headerClassName='bg-transparent'
+        />
+      }
     }
   }
   return <div className='space-y-2'>
@@ -196,10 +143,7 @@ export const AgentStrategy = (props: AgentStrategyProps) => {
       strategy
         ? <div>
           <Form<CustomField>
-            formSchemas={[
-              ...formSchema,
-              ...devMockForm as any,
-            ]}
+            formSchemas={formSchema}
             value={formValue}
             onChange={onFormValueChange}
             validating={false}

web/app/components/workflow/nodes/agent/node.tsx

@@ -21,7 +21,7 @@ const AgentNode: FC<NodeProps<AgentNodeType>> = (props) => {
     const models = currentStrategy?.parameters
       .filter(param => param.type === FormTypeEnum.modelSelector)
       .reduce((acc, param) => {
-        const item = inputs.agent_configurations?.[param.name]
+        const item = inputs.agent_parameters?.[param.name]?.value
         if (!item) {
           if (param.required) {
             acc.push({ param: param.name })
@@ -40,7 +40,7 @@ const AgentNode: FC<NodeProps<AgentNodeType>> = (props) => {
     currentStrategy?.parameters.forEach((param) => {
       if (param.type === FormTypeEnum.toolSelector) {
         const field = param.name
-        const value = inputs.agent_configurations?.[field]
+        const value = inputs.agent_parameters?.[field]?.value
         if (value) {
           tools.push({
             providerName: value.provider_name as any,
@@ -49,7 +49,7 @@ const AgentNode: FC<NodeProps<AgentNodeType>> = (props) => {
       }
       if (param.type === FormTypeEnum.multiToolSelector) {
         const field = param.name
-        const value = inputs.agent_configurations?.[field]
+        const value = inputs.agent_parameters?.[field]?.value
         if (value) {
           (value as unknown as any[]).forEach((item) => {
             tools.push({
@@ -60,7 +60,7 @@ const AgentNode: FC<NodeProps<AgentNodeType>> = (props) => {
       }
     })
     return tools
-  }, [currentStrategy?.parameters, inputs.agent_configurations])
+  }, [currentStrategy?.parameters, inputs.agent_parameters])
   return <div className='mb-1 px-3 py-1 space-y-1'>
     {inputs.agent_strategy_name
       ? <SettingItem

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

@@ -20,7 +20,7 @@ function strategyParamToCredientialForm(param: StrategyParamItem): CredentialFor
 }
 
 const AgentPanel: FC<NodePanelProps<AgentNodeType>> = (props) => {
-  const { inputs, setInputs, currentStrategy } = useConfig(props.id, props.data)
+  const { inputs, setInputs, currentStrategy, formData, onFormChange } = useConfig(props.id, props.data)
   const { t } = useTranslation()
   return <div className='my-2'>
     <Field title={t('workflow.nodes.agent.strategy.label')} className='px-4' >
@@ -28,28 +28,21 @@ const AgentPanel: FC<NodePanelProps<AgentNodeType>> = (props) => {
         strategy={inputs.agent_strategy_name ? {
           agent_strategy_provider_name: inputs.agent_strategy_provider_name!,
           agent_strategy_name: inputs.agent_strategy_name!,
-          agent_configurations: inputs.agent_configurations,
           agent_strategy_label: inputs.agent_strategy_label!,
           agent_output_schema: inputs.output_schema,
-          agent_parameters: inputs.agent_parameters,
         } : undefined}
         onStrategyChange={(strategy) => {
           setInputs({
             ...inputs,
             agent_strategy_provider_name: strategy?.agent_strategy_provider_name,
             agent_strategy_name: strategy?.agent_strategy_name,
-            agent_configurations: strategy?.agent_configurations,
-            agent_parameters: strategy?.agent_parameters,
             agent_strategy_label: strategy?.agent_strategy_label,
             output_schema: strategy!.agent_output_schema,
           })
         }}
         formSchema={currentStrategy?.parameters?.map(strategyParamToCredientialForm) || []}
-        formValue={inputs.agent_configurations || {}}
-        onFormValueChange={value => setInputs({
-          ...inputs,
-          agent_configurations: value,
-        })}
+        formValue={formData}
+        onFormValueChange={onFormChange}
       />
     </Field>
     <div>

web/app/components/workflow/nodes/agent/types.ts

@@ -5,7 +5,6 @@ export type AgentNodeType = CommonNodeType & {
   agent_strategy_provider_name?: string
   agent_strategy_name?: string
   agent_strategy_label?: string
-  agent_parameters?: Record<string, ToolVarInputs>
-  agent_configurations?: Record<string, any>
+  agent_parameters?: ToolVarInputs
   output_schema: Record<string, any>
 }

web/app/components/workflow/nodes/agent/use-config.ts

@@ -5,6 +5,8 @@ import type { AgentNodeType } from './types'
 import {
   useNodesReadOnly,
 } from '@/app/components/workflow/hooks'
+import { useMemo } from 'react'
+import { type ToolVarInputs, VarType } from '../tool/types'
 
 const useConfig = (id: string, payload: AgentNodeType) => {
   const { nodesReadOnly: readOnly } = useNodesReadOnly()
@@ -20,6 +22,30 @@ const useConfig = (id: string, payload: AgentNodeType) => {
   const currentStrategy = strategies.data?.declaration.strategies.find(
     str => str.identity.name === inputs.agent_strategy_name,
   )
+  const formData = useMemo(() => {
+    return Object.fromEntries(
+      Object.entries(inputs.agent_parameters || {}).map(([key, value]) => {
+        return [key, value.value]
+      }),
+    )
+  }, [inputs.agent_parameters])
+  const onFormChange = (value: Record<string, any>) => {
+    const res: ToolVarInputs = {}
+    const params = currentStrategy!.parameters
+    Object.entries(value).forEach(([key, val]) => {
+      const param = params.find(p => p.name === key)
+      const isMixed = param?.type === 'string'
+      res[key] = {
+        type: isMixed ? VarType.mixed : VarType.constant,
+        value: val,
+      }
+    })
+    setInputs({
+      ...inputs,
+      agent_parameters: res,
+    })
+    console.log(res)
+  }
   return {
     readOnly,
     inputs,
@@ -27,6 +53,8 @@ const useConfig = (id: string, payload: AgentNodeType) => {
     handleVarListChange,
     handleAddVariable,
     currentStrategy,
+    formData,
+    onFormChange,
   }
 }