feat: support computer use config

web/app/components/workflow/nodes/llm/components/computer-use-config.tsx

@@ -0,0 +1,39 @@
+'use client'
+import type { FC } from 'react'
+import * as React from 'react'
+import { useTranslation } from 'react-i18next'
+import Switch from '@/app/components/base/switch'
+import Field from '@/app/components/workflow/nodes/_base/components/field'
+
+const i18nPrefix = 'nodes.llm.computerUse'
+
+type Props = {
+  readonly: boolean
+  enabled: boolean
+  onChange: (enabled: boolean) => void
+}
+
+const ComputerUseConfig: FC<Props> = ({
+  readonly,
+  enabled,
+  onChange,
+}) => {
+  const { t } = useTranslation()
+
+  return (
+    <Field
+      title={t(`${i18nPrefix}.title`, { ns: 'workflow' })}
+      tooltip={t(`${i18nPrefix}.tooltip`, { ns: 'workflow' })!}
+      operations={(
+        <Switch
+          size="md"
+          disabled={readonly}
+          defaultValue={enabled}
+          onChange={onChange}
+        />
+      )}
+    />
+  )
+}
+
+export default React.memo(ComputerUseConfig)

web/app/components/workflow/nodes/llm/default.ts

@@ -42,6 +42,7 @@ const nodeDefault: NodeDefault<LLMNodeType> = {
         temperature: 0.7,
       },
     },
+    computer_use: false,
     prompt_template: [{
       role: PromptRole.system,
       text: '',

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

@@ -20,6 +20,7 @@ import { fetchAndMergeValidCompletionParams } from '@/utils/completion-params'
 import ConfigVision from '../_base/components/config-vision'
 import MemoryConfig from '../_base/components/memory-config'
 import VarReferencePicker from '../_base/components/variable/var-reference-picker'
+import ComputerUseConfig from './components/computer-use-config'
 import ConfigPrompt from './components/config-prompt'
 import ReasoningFormatConfig from './components/reasoning-format-config'
 import StructureOutput from './components/structure-output'
@@ -68,6 +69,8 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
     handleStructureOutputChange,
     filterJinja2InputVar,
     handleReasoningFormatChange,
+    isSupportSandbox,
+    handleComputerUseChange,
   } = useConfig(id, data)
 
   const {
@@ -221,6 +224,16 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
           </>
         )}
 
+        {/* Sandbox Config */}
+        {isSupportSandbox && (
+          <>
+            <ComputerUseConfig
+              readonly={readOnly}
+              enabled={!!inputs.computer_use}
+              onChange={handleComputerUseChange}
+            />
+          </>
+        )}
         <Tools
           nodeId={id}
           tools={inputs.tools}

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

@@ -20,6 +20,7 @@ export type LLMNodeType = CommonNodeType & {
     jinja2_variables?: Variable[]
   }
   memory?: Memory
+  computer_use?: boolean
   context: {
     enabled: boolean
     variable_selector: ValueSelector

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

@@ -181,6 +181,13 @@ const useConfig = (id: string, payload: LLMNodeType) => {
     setInputs(newInputs)
   }, [setInputs])
 
+  const handleComputerUseChange = useCallback((enabled: boolean) => {
+    const newInputs = produce(inputRef.current, (draft) => {
+      draft.computer_use = enabled
+    })
+    setInputs(newInputs)
+  }, [setInputs])
+
   // change to vision model to set vision enabled, else disabled
   useEffect(() => {
     if (!modelChanged)
@@ -393,6 +400,8 @@ const useConfig = (id: string, payload: LLMNodeType) => {
     handleStructureOutputEnableChange,
     filterJinja2InputVar,
     handleReasoningFormatChange,
+    isSupportSandbox,
+    handleComputerUseChange,
   }
 }
 

web/i18n/en-US/workflow.json

@@ -642,6 +642,8 @@
   "nodes.llm.addContext": "Add Context",
   "nodes.llm.addMessage": "Add Message",
   "nodes.llm.advancedSettings": "Advanced Settings",
+  "nodes.llm.computerUse.title": "Computer Use",
+  "nodes.llm.computerUse.tooltip": "Allow the model to operate a sandboxed computer.",
   "nodes.llm.context": "context",
   "nodes.llm.contextBlock": "Context Block",
   "nodes.llm.contextTooltip": "You can import Knowledge as context",

web/i18n/zh-Hans/workflow.json

@@ -635,6 +635,8 @@
   "nodes.listFilter.selectVariableKeyPlaceholder": "选择子变量的 Key",
   "nodes.llm.addContext": "添加上下文",
   "nodes.llm.addMessage": "添加消息",
+  "nodes.llm.computerUse.title": "计算机使用",
+  "nodes.llm.computerUse.tooltip": "允许模型操作沙箱计算机。",
   "nodes.llm.context": "上下文",
   "nodes.llm.contextBlock": "上下文块",
   "nodes.llm.contextTooltip": "您可以导入知识库作为上下文",