From 034108c218215d2229f942f945882118a85b9547 Mon Sep 17 00:00:00 2001 From: heheer Date: Thu, 29 Aug 2024 14:09:20 +0800 Subject: [PATCH] fix: global variable during debug & variable update textarea rerender (#2553) * fix: global variable during debug & variable update textarea rerender * update var node use prompt editor * fix --- .../workflow/dispatch/tools/runUpdateVar.ts | 14 ++++- .../common/Textarea/PromptEditor/index.tsx | 22 ++++--- .../app/src/global/core/workflow/api.d.ts | 1 + .../app/src/pages/api/core/workflow/debug.ts | 3 +- .../Flow/nodes/NodeVariableUpdate.tsx | 37 ++++++++---- .../render/RenderInput/templates/Textarea.tsx | 44 ++------------ .../components/WorkflowComponents/context.tsx | 12 ++-- .../components/WorkflowComponents/utils.tsx | 60 +++++++++++++++++++ 8 files changed, 128 insertions(+), 65 deletions(-) diff --git a/packages/service/core/workflow/dispatch/tools/runUpdateVar.ts b/packages/service/core/workflow/dispatch/tools/runUpdateVar.ts index 62b0f5d14..9a95c6ea0 100644 --- a/packages/service/core/workflow/dispatch/tools/runUpdateVar.ts +++ b/packages/service/core/workflow/dispatch/tools/runUpdateVar.ts @@ -8,6 +8,7 @@ import { getReferenceVariableValue } from '@fastgpt/global/core/workflow/runtime import { TUpdateListItem } from '@fastgpt/global/core/workflow/template/system/variableUpdate/type'; import { ModuleDispatchProps } from '@fastgpt/global/core/workflow/runtime/type'; import { removeSystemVariable, valueTypeFormat } from '../utils'; +import { replaceVariableLabel } from '@fastgpt/global/core/workflow/utils'; type Props = ModuleDispatchProps<{ [NodeInputKeyEnum.updateList]: TUpdateListItem[]; @@ -15,7 +16,7 @@ type Props = ModuleDispatchProps<{ type Response = DispatchNodeResultType<{}>; export const dispatchUpdateVariable = async (props: Props): Promise => { - const { params, variables, runtimeNodes, workflowStreamResponse } = props; + const { params, variables, runtimeNodes, workflowStreamResponse, node } = props; const { updateList } = params; updateList.forEach((item) => { @@ -28,7 +29,16 @@ export const dispatchUpdateVariable = async (props: Props): Promise => const value = (() => { if (!item.value?.[0]) { - return valueTypeFormat(item.value?.[1], item.valueType); + const formatValue = valueTypeFormat(item.value?.[1], item.valueType); + + return typeof formatValue === 'string' + ? replaceVariableLabel({ + text: formatValue, + nodes: runtimeNodes, + variables, + runningNode: node + }) + : formatValue; } else { return getReferenceVariableValue({ value: item.value, diff --git a/packages/web/components/common/Textarea/PromptEditor/index.tsx b/packages/web/components/common/Textarea/PromptEditor/index.tsx index c2a22afb0..ca151f4e6 100644 --- a/packages/web/components/common/Textarea/PromptEditor/index.tsx +++ b/packages/web/components/common/Textarea/PromptEditor/index.tsx @@ -40,14 +40,20 @@ const PromptEditor = ({ const { isOpen, onOpen, onClose } = useDisclosure(); const { t } = useTranslation(); - const onChangeInput = useCallback((editorState: EditorState, editor: LexicalEditor) => { - const text = editorStateToText(editor).replaceAll('}}{{', '}} {{'); - onChange?.(text); - }, []); - const onBlurInput = useCallback((editor: LexicalEditor) => { - const text = editorStateToText(editor).replaceAll('}}{{', '}} {{'); - onBlur?.(text); - }, []); + const onChangeInput = useCallback( + (editorState: EditorState, editor: LexicalEditor) => { + const text = editorStateToText(editor).replaceAll('}}{{', '}} {{'); + onChange?.(text); + }, + [onChange] + ); + const onBlurInput = useCallback( + (editor: LexicalEditor) => { + const text = editorStateToText(editor).replaceAll('}}{{', '}} {{'); + onBlur?.(text); + }, + [onBlur] + ); return ( <> diff --git a/projects/app/src/global/core/workflow/api.d.ts b/projects/app/src/global/core/workflow/api.d.ts index dcc892a6d..baeb36693 100644 --- a/projects/app/src/global/core/workflow/api.d.ts +++ b/projects/app/src/global/core/workflow/api.d.ts @@ -16,4 +16,5 @@ export type PostWorkflowDebugResponse = { finishedEdges: RuntimeEdgeItemType[]; nextStepRunNodes: RuntimeNodeItemType[]; flowResponses: ChatHistoryItemResType[]; + newVariables: Record; }; diff --git a/projects/app/src/pages/api/core/workflow/debug.ts b/projects/app/src/pages/api/core/workflow/debug.ts index 88ac05566..29482913f 100644 --- a/projects/app/src/pages/api/core/workflow/debug.ts +++ b/projects/app/src/pages/api/core/workflow/debug.ts @@ -39,7 +39,7 @@ async function handler( const { user } = await getUserChatInfoAndAuthTeamPoints(tmbId); /* start process */ - const { flowUsages, flowResponses, debugResponse } = await dispatchWorkFlow({ + const { flowUsages, flowResponses, debugResponse, newVariables } = await dispatchWorkFlow({ res, requestOrigin: req.headers.origin, mode: 'debug', @@ -68,6 +68,7 @@ async function handler( return { ...debugResponse, + newVariables, flowResponses }; } diff --git a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeVariableUpdate.tsx b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeVariableUpdate.tsx index acd26c936..9aa8c5fee 100644 --- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeVariableUpdate.tsx +++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeVariableUpdate.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useMemo } from 'react'; +import React, { useCallback, useEffect, useMemo, useState } from 'react'; import NodeCard from './render/NodeCard'; import { NodeProps } from 'reactflow'; import { FlowNodeItemType } from '@fastgpt/global/core/workflow/type/node'; @@ -12,8 +12,7 @@ import { NumberInput, NumberInputField, NumberInputStepper, - Switch, - Textarea + Switch } from '@chakra-ui/react'; import { TUpdateListItem } from '@fastgpt/global/core/workflow/template/system/variableUpdate/type'; import { NodeInputKeyEnum, WorkflowIOValueTypeEnum } from '@fastgpt/global/core/workflow/constants'; @@ -33,6 +32,9 @@ import { ReferSelector, useReference } from './render/RenderInput/templates/Refe import { getRefData } from '@/web/core/workflow/utils'; import { isReferenceValue } from '@fastgpt/global/core/workflow/utils'; import { AppContext } from '@/pages/app/detail/components/context'; +import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor'; +import { useCreation } from 'ahooks'; +import { getEditorVariables } from '../../utils'; const NodeVariableUpdate = ({ data, selected }: NodeProps) => { const { inputs = [], nodeId } = data; @@ -41,6 +43,17 @@ const NodeVariableUpdate = ({ data, selected }: NodeProps) => const onChangeNode = useContextSelector(WorkflowContext, (v) => v.onChangeNode); const nodeList = useContextSelector(WorkflowContext, (v) => v.nodeList); const appDetail = useContextSelector(AppContext, (v) => v.appDetail); + const edges = useContextSelector(WorkflowContext, (v) => v.edges); + + const variables = useCreation(() => { + return getEditorVariables({ + nodeId, + nodeList, + edges, + appDetail, + t + }); + }, [nodeList, edges, inputs, t]); const updateList = useMemo( () => @@ -90,7 +103,6 @@ const NodeVariableUpdate = ({ data, selected }: NodeProps) => chatConfig: appDetail.chatConfig, t }); - const renderTypeData = menuList.find((item) => item.renderType === updateItem.renderType); const handleUpdate = (newValue: ReferenceValueProps | string) => { if (isReferenceValue(newValue)) { @@ -199,12 +211,15 @@ const NodeVariableUpdate = ({ data, selected }: NodeProps) => } if (valueType === WorkflowIOValueTypeEnum.string) { return ( -