diff --git a/web/app/components/workflow/hooks/use-inspect-vars-crud.ts b/web/app/components/workflow/hooks/use-inspect-vars-crud.ts index 48921ae400..ee47adda48 100644 --- a/web/app/components/workflow/hooks/use-inspect-vars-crud.ts +++ b/web/app/components/workflow/hooks/use-inspect-vars-crud.ts @@ -20,13 +20,11 @@ const useInspectVarsCrud = () => { const nodesWithInspectVars = useStore(s => s.nodesWithInspectVars) const { appId, - getNodeInspectVars, setNodeInspectVars, setInspectVarValue, getVarId, renameInspectVarName: renameInspectVarNameInStore, deleteAllInspectVars: deleteAllInspectVarsInStore, - hasNodeInspectVars, deleteNodeInspectVars: deleteNodeInspectVarsInStore, deleteInspectVar: deleteInspectVarInStore, isInspectVarEdited, @@ -43,6 +41,15 @@ const useInspectVarsCrud = () => { const { mutate: doEditInspectorVar } = useEditInspectorVar(appId) + const getNodeInspectVars = useCallback((nodeId: string) => { + const node = nodesWithInspectVars.find(node => node.nodeId === nodeId) + return node + }, [nodesWithInspectVars]) + + const hasNodeInspectVars = useCallback((nodeId: string) => { + return !!getNodeInspectVars(nodeId) + }, [getNodeInspectVars]) + const fetchInspectVarValue = async (selector: ValueSelector) => { const nodeId = selector[0] const isSystemVar = nodeId === 'sys' @@ -131,6 +138,7 @@ const useInspectVarsCrud = () => { conversationVars: conversationVars || [], systemVars: systemVars || [], nodesWithInspectVars, + hasNodeInspectVars, fetchInspectVarValue, editInspectVarValue, renameInspectVarName, diff --git a/web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx b/web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx index 025a617653..859be53200 100644 --- a/web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx +++ b/web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx @@ -73,6 +73,8 @@ const BasePanel: FC = ({ const nodePanelWidth = useStore(s => s.nodePanelWidth) const otherPanelWidth = useStore(s => s.otherPanelWidth) const setNodePanelWidth = useStore(s => s.setNodePanelWidth) + const nodesWithInspectVars = useStore(s => s.nodesWithInspectVars) + window.nodesWithInspectVars = nodesWithInspectVars const maxNodePanelWidth = useMemo(() => { if (!workflowCanvasWidth) diff --git a/web/app/components/workflow/nodes/_base/node.tsx b/web/app/components/workflow/nodes/_base/node.tsx index e70a471cf3..df5047f858 100644 --- a/web/app/components/workflow/nodes/_base/node.tsx +++ b/web/app/components/workflow/nodes/_base/node.tsx @@ -44,7 +44,7 @@ import AddVariablePopupWithPosition from './components/add-variable-popup-with-p import cn from '@/utils/classnames' import BlockIcon from '@/app/components/workflow/block-icon' import Tooltip from '@/app/components/base/tooltip' -import { useStore } from '../../store' +import useInspectVarsCrud from '../../hooks/use-inspect-vars-crud' type BaseNodeProps = { children: ReactElement @@ -90,8 +90,8 @@ const BaseNode: FC = ({ } }, [data.isInLoop, data.selected, id, handleNodeLoopChildSizeChange]) - const hasNodeInspectVars = useStore(s => s.hasNodeInspectVars) - const hasVarValue = hasNodeInspectVars(id) + const { hasNodeInspectVars } = useInspectVarsCrud() + const hasVarValue = useMemo(() => hasNodeInspectVars(id), [id, hasNodeInspectVars]) const showSelectedBorder = data.selected || data._isBundled || data._isEntering const { showRunningBorder, diff --git a/web/app/components/workflow/store/workflow/debug/inspect-vars-slice.ts b/web/app/components/workflow/store/workflow/debug/inspect-vars-slice.ts index cd9d7026e3..94b9089cb2 100644 --- a/web/app/components/workflow/store/workflow/debug/inspect-vars-slice.ts +++ b/web/app/components/workflow/store/workflow/debug/inspect-vars-slice.ts @@ -20,7 +20,6 @@ type InspectVarsActions = { appendNodeInspectVars: (nodeId: string, payload: VarInInspect[], allNodes: Node[]) => void deleteNodeInspectVars: (nodeId: string) => void getNodeInspectVars: (nodeId: string) => NodeWithVar | undefined - hasNodeInspectVars: (nodeId: string) => boolean getVarId: (nodeId: string, varName: string) => string | undefined setInspectVarValue: (nodeId: string, name: string, value: any) => void renameInspectVarName: (nodeId: string, varId: string, selector: ValueSelector) => void @@ -106,9 +105,6 @@ export const createInspectVarsSlice: StateCreator = (set, const nodes = get().nodesWithInspectVars return nodes.find(node => node.nodeId === nodeId) }, - hasNodeInspectVars: (nodeId) => { - return !!get().getNodeInspectVars(nodeId) - }, getVarId: (nodeId: string, varName: string) => { const node = get().getNodeInspectVars(nodeId) if (!node)