From c2e50814372e78fe132f8d7af2fbd10c60016a18 Mon Sep 17 00:00:00 2001
From: Harry <xh001x@hotmail.com>
Date: Thu, 8 Jan 2026 12:16:18 +0800
Subject: [PATCH] feat(llm-panel): collapse panel with advanced settings and
 max iterations

- Introduced a collapsible section for advanced settings in the LLM panel.
- Added Max Iterations component with conditional rendering based on the new hideMaxIterations prop.
- Updated context field and vision configuration to be part of the advanced settings.
- Added new translation key for advanced settings in the workflow localization file.
---
 .../nodes/llm/components/tools/index.tsx      | 12 ++-
 .../components/workflow/nodes/llm/panel.tsx   | 92 +++++++++++--------
 web/i18n/en-US/workflow.json                  |  1 +
 3 files changed, 64 insertions(+), 41 deletions(-)

diff --git a/web/app/components/workflow/nodes/llm/components/tools/index.tsx b/web/app/components/workflow/nodes/llm/components/tools/index.tsx
index 2eb4fd5869..285eab86a9 100644
--- a/web/app/components/workflow/nodes/llm/components/tools/index.tsx
+++ b/web/app/components/workflow/nodes/llm/components/tools/index.tsx
@@ -10,11 +10,13 @@ type ToolsProps = {
   nodeId: string
   tools?: ToolValue[]
   maxIterations?: number
+  hideMaxIterations?: boolean
 }
 const Tools = ({
   nodeId,
   tools = [],
   maxIterations = 10,
+  hideMaxIterations = false,
 }: ToolsProps) => {
   const { t } = useTranslation()
   const {
@@ -42,10 +44,12 @@ const Tools = ({
         onChange={handleToolsChange}
         supportCollapse
       />
-      <MaxIterations
-        value={maxIterations}
-        onChange={handleMaxIterationsChange}
-      />
+      {!hideMaxIterations && (
+        <MaxIterations
+          value={maxIterations}
+          onChange={handleMaxIterationsChange}
+        />
+      )}
     </BoxGroup>
   )
 }
diff --git a/web/app/components/workflow/nodes/llm/panel.tsx b/web/app/components/workflow/nodes/llm/panel.tsx
index 9d336d25b4..63c59d29dc 100644
--- a/web/app/components/workflow/nodes/llm/panel.tsx
+++ b/web/app/components/workflow/nodes/llm/panel.tsx
@@ -10,6 +10,7 @@ import Switch from '@/app/components/base/switch'
 import Toast from '@/app/components/base/toast'
 import Tooltip from '@/app/components/base/tooltip'
 import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal'
+import { FieldCollapse } from '@/app/components/workflow/nodes/_base/components/collapse'
 import Field from '@/app/components/workflow/nodes/_base/components/field'
 import OutputVars, { VarItem } from '@/app/components/workflow/nodes/_base/components/output-vars'
 import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor'
@@ -23,6 +24,8 @@ import ConfigPrompt from './components/config-prompt'
 import ReasoningFormatConfig from './components/reasoning-format-config'
 import StructureOutput from './components/structure-output'
 import Tools from './components/tools'
+import MaxIterations from './components/tools/max-iterations'
+import { useNodeTools } from './components/tools/use-node-tools'
 import useConfig from './use-config'
 
 const i18nPrefix = 'nodes.llm'
@@ -67,6 +70,10 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
     handleReasoningFormatChange,
   } = useConfig(id, data)
 
+  const {
+    handleMaxIterationsChange,
+  } = useNodeTools(id)
+
   const model = inputs.model
 
   const handleModelChange = useCallback((model: {
@@ -118,26 +125,6 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
           />
         </Field>
 
-        {/* knowledge */}
-        <Field
-          title={t(`${i18nPrefix}.context`, { ns: 'workflow' })}
-          tooltip={t(`${i18nPrefix}.contextTooltip`, { ns: 'workflow' })!}
-        >
-          <>
-            <VarReferencePicker
-              readonly={readOnly}
-              nodeId={id}
-              isShowNodeName
-              value={inputs.context?.variable_selector || []}
-              onChange={handleContextVarChange}
-              filterVar={filterVar}
-            />
-            {shouldShowContextTip && (
-              <div className="text-xs font-normal leading-[18px] text-[#DC6803]">{t(`${i18nPrefix}.notSetContextInPromptTip`, { ns: 'workflow' })}</div>
-            )}
-          </>
-        </Field>
-
         {/* Prompt */}
         {model.name && (
           <ConfigPrompt
@@ -238,26 +225,57 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
           nodeId={id}
           tools={inputs.tools}
           maxIterations={inputs.max_iterations}
+          hideMaxIterations
         />
 
-        {/* Vision: GPT4-vision and so on */}
-        <ConfigVision
-          nodeId={id}
-          readOnly={readOnly}
-          isVisionModel={isVisionModel}
-          enabled={inputs.vision?.enabled}
-          onEnabledChange={handleVisionResolutionEnabledChange}
-          config={inputs.vision?.configs}
-          onConfigChange={handleVisionResolutionChange}
-        />
+        {/* Advanced Settings - 折叠区 */}
+        <FieldCollapse title={t(`${i18nPrefix}.advancedSettings`, { ns: 'workflow' })}>
+          <div className="space-y-4">
+            {/* Context */}
+            <Field
+              title={t(`${i18nPrefix}.context`, { ns: 'workflow' })}
+              tooltip={t(`${i18nPrefix}.contextTooltip`, { ns: 'workflow' })!}
+            >
+              <>
+                <VarReferencePicker
+                  readonly={readOnly}
+                  nodeId={id}
+                  isShowNodeName
+                  value={inputs.context?.variable_selector || []}
+                  onChange={handleContextVarChange}
+                  filterVar={filterVar}
+                />
+                {shouldShowContextTip && (
+                  <div className="text-xs font-normal leading-[18px] text-[#DC6803]">{t(`${i18nPrefix}.notSetContextInPromptTip`, { ns: 'workflow' })}</div>
+                )}
+              </>
+            </Field>
 
-        {/* Reasoning Format */}
-        <ReasoningFormatConfig
-          // Default to tagged for backward compatibility
-          value={inputs.reasoning_format || 'tagged'}
-          onChange={handleReasoningFormatChange}
-          readonly={readOnly}
-        />
+            {/* Vision: GPT4-vision and so on */}
+            <ConfigVision
+              nodeId={id}
+              readOnly={readOnly}
+              isVisionModel={isVisionModel}
+              enabled={inputs.vision?.enabled}
+              onEnabledChange={handleVisionResolutionEnabledChange}
+              config={inputs.vision?.configs}
+              onConfigChange={handleVisionResolutionChange}
+            />
+
+            {/* Max Iterations */}
+            <MaxIterations
+              value={inputs.max_iterations}
+              onChange={handleMaxIterationsChange}
+            />
+
+            {/* Reasoning Format */}
+            <ReasoningFormatConfig
+              value={inputs.reasoning_format || 'tagged'}
+              onChange={handleReasoningFormatChange}
+              readonly={readOnly}
+            />
+          </div>
+        </FieldCollapse>
       </div>
       <Split />
       <OutputVars
diff --git a/web/i18n/en-US/workflow.json b/web/i18n/en-US/workflow.json
index 10299ddec3..407f82452a 100644
--- a/web/i18n/en-US/workflow.json
+++ b/web/i18n/en-US/workflow.json
@@ -634,6 +634,7 @@
   "nodes.listFilter.outputVars.result": "Filter result",
   "nodes.listFilter.selectVariableKeyPlaceholder": "Select sub variable key",
   "nodes.llm.addMessage": "Add Message",
+  "nodes.llm.advancedSettings": "Advanced Settings",
   "nodes.llm.context": "context",
   "nodes.llm.contextTooltip": "You can import Knowledge as context",
   "nodes.llm.files": "Files",