diff --git a/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx b/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx index 1511754128..56a9c251bd 100644 --- a/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx +++ b/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx @@ -161,6 +161,19 @@ const ComponentPicker = ({ editor.dispatchCommand(KEY_ESCAPE_COMMAND, escapeEvent) }, [editor]) + const handleSelectAssembleVariables = useCallback(() => { + editor.update(() => { + const match = checkForTriggerMatch(triggerString, editor) + if (!match) + return + const needRemove = $splitNodeContainingQuery(match) + if (needRemove) + needRemove.remove() + }) + workflowVariableBlock?.onAssembleVariables?.() + handleClose() + }, [editor, checkForTriggerMatch, triggerString, workflowVariableBlock, handleClose]) + const handleSelectAgent = useCallback((agent: { id: string, title: string }) => { editor.update(() => { const needRemove = $splitNodeContainingQuery(checkForTriggerMatch(triggerString, editor)!) @@ -182,6 +195,7 @@ const ComponentPicker = ({ }, [editor, checkForTriggerMatch, triggerString, agentBlock, handleClose]) const isAgentTrigger = triggerString === '@' && agentBlock?.show + const showAssembleVariables = triggerString === '/' && workflowVariableBlock?.showAssembleVariables const agentNodes = agentBlock?.agentNodes || [] const renderMenu = useCallback>(( @@ -246,6 +260,8 @@ const ComponentPicker = ({ onBlur={handleClose} showManageInputField={workflowVariableBlock.showManageInputField} onManageInputField={workflowVariableBlock.onManageInputField} + showAssembleVariables={showAssembleVariables} + onAssembleVariables={showAssembleVariables ? handleSelectAssembleVariables : undefined} autoFocus={false} isInCodeGeneratorInstructionEditor={currentBlock?.generatorType === GeneratorType.code} /> @@ -289,7 +305,7 @@ const ComponentPicker = ({ } ) - }, [isAgentTrigger, agentNodes, allFlattenOptions.length, workflowVariableBlock?.show, floatingStyles, isPositioned, refs, handleSelectAgent, handleClose, workflowVariableOptions, isSupportFileVar, currentBlock?.generatorType, handleSelectWorkflowVariable, queryString, workflowVariableBlock?.showManageInputField, workflowVariableBlock?.onManageInputField]) + }, [isAgentTrigger, agentNodes, allFlattenOptions.length, workflowVariableBlock?.show, floatingStyles, isPositioned, refs, handleSelectAgent, handleClose, workflowVariableOptions, isSupportFileVar, currentBlock?.generatorType, handleSelectWorkflowVariable, queryString, workflowVariableBlock?.showManageInputField, workflowVariableBlock?.onManageInputField, showAssembleVariables, handleSelectAssembleVariables]) return ( void + showAssembleVariables?: boolean + onAssembleVariables?: () => void } export type AgentNode = { diff --git a/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx b/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx index d44f560e08..a2b00a9506 100644 --- a/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx +++ b/web/app/components/workflow/nodes/_base/components/variable/var-reference-vars.tsx @@ -10,6 +10,7 @@ import { useEffect, useMemo, useRef, useState } from 'react' import { useTranslation } from 'react-i18next' import { ChevronRight } from '@/app/components/base/icons/src/vender/line/arrows' import { CodeAssistant, MagicEdit } from '@/app/components/base/icons/src/vender/line/general' +import { MagicWand } from '@/app/components/base/icons/src/vender/solid/mediaAndDevices' import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development' import Input from '@/app/components/base/input' import { @@ -255,6 +256,8 @@ type Props = { isInCodeGeneratorInstructionEditor?: boolean showManageInputField?: boolean onManageInputField?: () => void + showAssembleVariables?: boolean + onAssembleVariables?: () => void autoFocus?: boolean preferSchemaType?: boolean } @@ -272,6 +275,8 @@ const VarReferenceVars: FC = ({ isInCodeGeneratorInstructionEditor, showManageInputField, onManageInputField, + showAssembleVariables, + onAssembleVariables, autoFocus = true, preferSchemaType, }) => { @@ -285,6 +290,13 @@ const VarReferenceVars: FC = ({ } } + const handleAssembleVariables = (e: React.MouseEvent) => { + e.preventDefault() + e.stopPropagation() + onAssembleVariables?.() + onClose?.() + } + const filteredVars = vars.filter((v) => { const children = v.vars.filter(v => checkKeys([v.variable], false).isValid || isSpecialVar(v.variable.split('.')[0])) return children.length > 0 @@ -393,6 +405,25 @@ const VarReferenceVars: FC = ({ /> ) } + { + showAssembleVariables && ( +
+ +
+ ) + } ) } diff --git a/web/i18n/en-US/workflow.json b/web/i18n/en-US/workflow.json index 315179cd9c..d31fe052cf 100644 --- a/web/i18n/en-US/workflow.json +++ b/web/i18n/en-US/workflow.json @@ -767,6 +767,7 @@ "nodes.templateTransform.inputVars": "Input Variables", "nodes.templateTransform.outputVars.output": "Transformed content", "nodes.tool.authorize": "Authorize", + "nodes.tool.assembleVariables": "Assemble variables", "nodes.tool.inputVars": "Input Variables", "nodes.tool.insertPlaceholder1": "Type or press", "nodes.tool.insertPlaceholder2": "insert variable", diff --git a/web/i18n/ja-JP/workflow.json b/web/i18n/ja-JP/workflow.json index f74a865eaf..02958405d6 100644 --- a/web/i18n/ja-JP/workflow.json +++ b/web/i18n/ja-JP/workflow.json @@ -765,6 +765,7 @@ "nodes.templateTransform.inputVars": "入力変数", "nodes.templateTransform.outputVars.output": "変換されたコンテンツ", "nodes.tool.authorize": "認証する", + "nodes.tool.assembleVariables": "変数を組み立てる", "nodes.tool.inputVars": "入力変数", "nodes.tool.insertPlaceholder1": "タイプするか押してください", "nodes.tool.insertPlaceholder2": "変数を挿入する", diff --git a/web/i18n/zh-Hans/workflow.json b/web/i18n/zh-Hans/workflow.json index 7eb9f556dc..25c159f446 100644 --- a/web/i18n/zh-Hans/workflow.json +++ b/web/i18n/zh-Hans/workflow.json @@ -765,6 +765,7 @@ "nodes.templateTransform.inputVars": "输入变量", "nodes.templateTransform.outputVars.output": "转换后内容", "nodes.tool.authorize": "授权", + "nodes.tool.assembleVariables": "组装变量", "nodes.tool.inputVars": "输入变量", "nodes.tool.insertPlaceholder1": "键入", "nodes.tool.insertPlaceholder2": "插入变量", diff --git a/web/i18n/zh-Hant/workflow.json b/web/i18n/zh-Hant/workflow.json index cebfdd2feb..62162aaae3 100644 --- a/web/i18n/zh-Hant/workflow.json +++ b/web/i18n/zh-Hant/workflow.json @@ -765,6 +765,7 @@ "nodes.templateTransform.inputVars": "輸入變數", "nodes.templateTransform.outputVars.output": "轉換後內容", "nodes.tool.authorize": "授權", + "nodes.tool.assembleVariables": "組裝變數", "nodes.tool.inputVars": "輸入變數", "nodes.tool.insertPlaceholder1": "輸入或按壓", "nodes.tool.insertPlaceholder2": "插入變數",