fix: append run not work

web/app/components/workflow/hooks/use-inspect-vars-crud.ts

@@ -16,6 +16,8 @@ import {
 } from '@/service/use-workflow'
 import { useCallback, useEffect, useState } from 'react'
 import { isConversationVar, isENV, isSystemVar } from '../nodes/_base/components/variable/utils'
+import produce from 'immer'
+import type { Node } from '@/app/components/workflow/types'
 
 const useInspectVarsCrud = () => {
   const workflowStore = useWorkflowStore()
@@ -28,6 +30,7 @@ const useInspectVarsCrud = () => {
     deleteAllInspectVars: deleteAllInspectVarsInStore,
     deleteNodeInspectVars: deleteNodeInspectVarsInStore,
     deleteInspectVar: deleteInspectVarInStore,
+    setNodesWithInspectVars,
   } = workflowStore.getState()
 
   const { data: conversationVars } = useConversationVarValues(appId)
@@ -100,6 +103,28 @@ const useInspectVarsCrud = () => {
     setNodeInspectVars(nodeId, vars)
   }
 
+  // after last run would call this
+  const appendNodeInspectVars = (nodeId: string, payload: VarInInspect[], allNodes: Node[]) => {
+    const nodes = produce(nodesWithInspectVars, (draft) => {
+      const nodeInfo = allNodes.find(node => node.id === nodeId)
+        if (nodeInfo) {
+          const index = draft.findIndex(node => node.nodeId === nodeId)
+          if (index === -1) {
+            draft.push({
+              nodeId,
+              nodeType: nodeInfo.data.type,
+              title: nodeInfo.data.title,
+              vars: payload,
+            })
+          }
+          else {
+            draft[index].vars = payload
+          }
+        }
+    })
+    setNodesWithInspectVars(nodes)
+  }
+
   const deleteInspectVar = async (nodeId: string, varId: string) => {
     await doDeleteInspectVar(varId)
     deleteInspectVarInStore(nodeId, varId)
@@ -184,6 +209,7 @@ const useInspectVarsCrud = () => {
     fetchInspectVarValue,
     editInspectVarValue,
     renameInspectVarName,
+    appendNodeInspectVars,
     deleteInspectVar,
     deleteNodeInspectorVars,
     deleteAllInspectorVars,

web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx

@@ -73,8 +73,6 @@ const BasePanel: FC<BasePanelProps> = ({
   const nodePanelWidth = useStore(s => s.nodePanelWidth)
   const otherPanelWidth = useStore(s => s.otherPanelWidth)
   const setNodePanelWidth = useStore(s => s.setNodePanelWidth)
-  const nodesWithInspectVars = useStore(s => s.nodesWithInspectVars)
-  console.log(nodesWithInspectVars)
 
   const maxNodePanelWidth = useMemo(() => {
     if (!workflowCanvasWidth)

web/app/components/workflow/nodes/_base/hooks/use-one-step-run.ts

@@ -51,6 +51,7 @@ import {
   useStoreApi,
 } from 'reactflow'
 import { useInvalidLastRun } from '@/service/use-workflow'
+import useInspectVarsCrud from '../../../hooks/use-inspect-vars-crud'
 // eslint-disable-next-line ts/no-unsafe-function-type
 const checkValidFns: Record<BlockEnum, Function> = {
   [BlockEnum.LLM]: checkLLMValid,
@@ -159,11 +160,13 @@ const useOneStepRun = <T>({
   const store = useStoreApi()
   const workflowStore = useWorkflowStore()
   const {
-    appendNodeInspectVars,
     setShowSingleRunPanel,
   } = workflowStore.getState()
   const invalidLastRun = useInvalidLastRun(appId!, id)
   const [runResult, doSetRunResult] = useState<NodeRunResult | null>(null)
+  const {
+    appendNodeInspectVars,
+  } = useInspectVarsCrud()
   const setRunResult = useCallback(async (data: NodeRunResult | null) => {
     doSetRunResult(data)
     invalidLastRun()

web/app/components/workflow/nodes/_base/node.tsx

@@ -90,8 +90,9 @@ const BaseNode: FC<BaseNodeProps> = ({
     }
   }, [data.isInLoop, data.selected, id, handleNodeLoopChildSizeChange])
 
-  const { hasNodeInspectVars } = useInspectVarsCrud()
+  const { hasNodeInspectVars, nodesWithInspectVars } = useInspectVarsCrud()
-  const hasVarValue = useMemo(() => hasNodeInspectVars(id), [id, hasNodeInspectVars])
+  // window.nodesWithInspectVars = nodesWithInspectVars
+  const hasVarValue = hasNodeInspectVars(id)
   const showSelectedBorder = data.selected || data._isBundled || data._isEntering
   const {
     showRunningBorder,

web/app/components/workflow/store/workflow/debug/inspect-vars-slice.ts

@@ -2,7 +2,6 @@ import type { StateCreator } from 'zustand'
 import produce from 'immer'
 import type { NodeWithVar, VarInInspect } from '@/types/workflow'
 import type { ValueSelector } from '../../../types'
-import type { Node } from '@/app/components/workflow/types'
 
 type InspectVarsState = {
   currentFocusNodeId: string | null
@@ -15,7 +14,6 @@ type InspectVarsActions = {
   setNodesWithInspectVars: (payload: NodeWithVar[]) => void
   deleteAllInspectVars: () => void
   setNodeInspectVars: (nodeId: string, payload: VarInInspect[]) => void
-  appendNodeInspectVars: (nodeId: string, payload: VarInInspect[], allNodes: Node[]) => void
   deleteNodeInspectVars: (nodeId: string) => void
   setInspectVarValue: (nodeId: string, name: string, value: any) => void
   renameInspectVarName: (nodeId: string, varId: string, selector: ValueSelector) => void
@@ -60,30 +58,6 @@ export const createInspectVarsSlice: StateCreator<InspectVarsSliceShape> = (set,
         }
       })
     },
-    // after last run would call this
-    appendNodeInspectVars: (nodeId, payload, allNodes) => {
-      set((state) => {
-        const nodes = state.nodesWithInspectVars
-        const nodeInfo = allNodes.find(node => node.id === nodeId)
-        if (nodeInfo) {
-          const index = nodes.findIndex(node => node.nodeId === nodeId)
-          if (index === -1) {
-            nodes.push({
-              nodeId,
-              nodeType: nodeInfo.data.type,
-              title: nodeInfo.data.title,
-              vars: payload,
-            })
-          }
-          else {
-            nodes[index].vars = payload
-          }
-        }
-        return {
-          nodesWithInspectVars: nodes,
-        }
-      })
-    },
     deleteNodeInspectVars: (nodeId) => {
       set(produce((state: InspectVarsSliceShape) => {
         const nodes = state.nodesWithInspectVars.filter(node => node.nodeId !== nodeId)