From edc6ab8722e5e469c72f14f90d98ac0fdecbeb34 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Wed, 21 May 2025 16:22:15 +0800
Subject: [PATCH] fix: remove start var problem

---
 .../workflow/nodes/start/use-config.ts        | 15 +++++++---
 .../workflow/debug/inspect-vars-slice.ts      | 29 +++++++++----------
 .../workflow/variable-inspect/group.tsx       |  2 +-
 web/service/use-workflow.ts                   |  2 +-
 4 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/web/app/components/workflow/nodes/start/use-config.ts b/web/app/components/workflow/nodes/start/use-config.ts
index 3cfc97f9d9..c0ade614e0 100644
--- a/web/app/components/workflow/nodes/start/use-config.ts
+++ b/web/app/components/workflow/nodes/start/use-config.ts
@@ -22,6 +22,8 @@ const useConfig = (id: string, payload: StartNodeType) => {
   const {
     deleteNodeInspectorVars,
     renameInspectVarName,
+    nodesWithInspectVars,
+    deleteInspectVar,
   } = useInspectVarsCrud()
 
   const [isShowAddVarModal, {
@@ -37,6 +39,12 @@ const useConfig = (id: string, payload: StartNodeType) => {
   const [removedIndex, setRemoveIndex] = useState(0)
   const handleVarListChange = useCallback((newList: InputVar[], moreInfo?: { index: number; payload: MoreInfo }) => {
     if (moreInfo?.payload?.type === ChangeType.remove) {
+      const varId = nodesWithInspectVars.find(node => node.nodeId === id)?.vars.find((varItem) => {
+        return varItem.name === moreInfo?.payload?.payload?.beforeKey
+      })?.id
+      if(varId)
+        deleteInspectVar(id, varId)
+
       if (isVarUsedInNodes([id, moreInfo?.payload?.payload?.beforeKey || ''])) {
         showRemoveVarConfirm()
         setRemovedVar([id, moreInfo?.payload?.payload?.beforeKey || ''])
@@ -54,10 +62,10 @@ const useConfig = (id: string, payload: StartNodeType) => {
       handleOutVarRenameChange(id, [id, inputs.variables[moreInfo.index].variable], [id, changedVar.variable])
       renameInspectVarName(id, inputs.variables[moreInfo.index].variable, changedVar.variable)
     }
-    else { // edit var type
+    else if(moreInfo?.payload?.type !== ChangeType.remove) { // edit var type
       deleteNodeInspectorVars(id)
     }
-  }, [deleteNodeInspectorVars, handleOutVarRenameChange, id, inputs, isVarUsedInNodes, renameInspectVarName, setInputs, showRemoveVarConfirm])
+  }, [deleteInspectVar, deleteNodeInspectorVars, handleOutVarRenameChange, id, inputs, isVarUsedInNodes, nodesWithInspectVars, renameInspectVarName, setInputs, showRemoveVarConfirm])
 
   const removeVarInNode = useCallback(() => {
     const newInputs = produce(inputs, (draft) => {
@@ -73,8 +81,7 @@ const useConfig = (id: string, payload: StartNodeType) => {
       draft.variables.push(payload)
     })
     setInputs(newInputs)
-    deleteNodeInspectorVars(id)
-  }, [deleteNodeInspectorVars, id, inputs, setInputs])
+  }, [inputs, setInputs])
   return {
     readOnly,
     isChatMode,
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 f3eacf6fec..8c56ba9a3a 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
@@ -104,21 +104,20 @@ export const createInspectVarsSlice: StateCreator<InspectVarsSliceShape> = (set,
       })
     },
     deleteInspectVar: (nodeId, varId) => {
-      set(produce((state: InspectVarsSliceShape) => {
-        const nodes = state.nodesWithInspectVars.map((node) => {
-          if (node.nodeId === nodeId) {
-            return produce(node, (draft) => {
-              const needChangeVarIndex = draft.vars.findIndex((varItem) => {
-                return varItem.id === varId
-              })
-              if (needChangeVarIndex !== -1)
-                draft.vars.splice(needChangeVarIndex, 1)
-            })
-          }
-          return node
-        })
-        state.nodesWithInspectVars = nodes
-      }))
+      set((state: InspectVarsSliceShape) => {
+        const nodes = produce(state.nodesWithInspectVars, (draft) => {
+          const targetNode = draft.find(node => node.nodeId === nodeId)
+          if (!targetNode)
+            return
+          const needChangeVarIndex = targetNode.vars.findIndex(varItem => varItem.id === varId)
+          if (needChangeVarIndex !== -1)
+            targetNode.vars.splice(needChangeVarIndex, 1)
+          },
+        )
+        return {
+          nodesWithInspectVars: nodes,
+        }
+      })
     },
   })
 }
diff --git a/web/app/components/workflow/variable-inspect/group.tsx b/web/app/components/workflow/variable-inspect/group.tsx
index 834bc0dc09..984eb0fe36 100644
--- a/web/app/components/workflow/variable-inspect/group.tsx
+++ b/web/app/components/workflow/variable-inspect/group.tsx
@@ -148,7 +148,7 @@ const Group = ({
               key={varItem.id}
               className={cn(
                 'relative flex cursor-pointer items-center gap-1 rounded-md px-3 py-1 hover:bg-state-base-hover',
-                varItem.id === currentVar?.var.id && 'bg-state-base-hover-alt hover:bg-state-base-hover-alt',
+                varItem.id === currentVar?.var?.id && 'bg-state-base-hover-alt hover:bg-state-base-hover-alt',
               )}
               onClick={() => handleSelectVar(varItem, varType)}
             >
diff --git a/web/service/use-workflow.ts b/web/service/use-workflow.ts
index 855b9dcf1e..23b2363728 100644
--- a/web/service/use-workflow.ts
+++ b/web/service/use-workflow.ts
@@ -161,7 +161,7 @@ export const useDeleteInspectVar = (appId: string) => {
   return useMutation({
     mutationKey: [NAME_SPACE, 'delete inspector var', appId],
     mutationFn: async (varId: string) => {
-      return del(`workflows/draft/variables/${varId}`)
+      return del(`apps/${appId}/workflows/draft/variables/${varId}`)
     },
   })
 }