feat: inspect vars crud hooks

web/app/components/workflow/hooks/use-current-vars.ts

@@ -1,35 +0,0 @@
-import { useWorkflowStore } from '../store'
-const useCurrentVars = () => {
-  const workflowStore = useWorkflowStore()
-  const {
-    nodesWithInspectVars: currentNodes,
-    getInspectVar: getCurrentVar,
-    setInspectVar: setCurrentVar,
-    clearInspectVars: clearCurrentVars,
-    clearNodeInspectVars: clearCurrentNodeVars,
-    getLastRunVar,
-    getLastRunInfos,
-  } = workflowStore.getState()
-
-  const isVarChanged = (nodeId: string, key: string) => {
-    return getCurrentVar(nodeId, key) !== getLastRunVar(nodeId, key)
-  }
-
-  const resetToLastRunVar = (nodeId: string, key: string) => {
-    const lastRunVar = getLastRunVar(nodeId, key)
-    if (lastRunVar)
-      setCurrentVar(nodeId, key, lastRunVar)
-  }
-
-  return {
-    currentVars: currentNodes,
-    getLastRunInfos,
-    isVarChanged,
-    clearCurrentVars,
-    clearCurrentNodeVars,
-    setCurrentVar,
-    resetToLastRunVar,
-  }
-}
-
-export default useCurrentVars

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

@@ -0,0 +1,81 @@
+import { useWorkflowStore } from '../store'
+import { BlockEnum, type ValueSelector, type VarType } from '../types'
+const useCurrentVars = () => {
+  const workflowStore = useWorkflowStore()
+  const {
+    conversationVars,
+    nodesWithInspectVars,
+    getInspectVar,
+    setInspectVar,
+    deleteAllInspectVars: deleteAllInspectVarsInStore,
+    deleteNodeInspectVars: deleteNodeInspectVarsInStore,
+    getLastRunVar,
+  } = workflowStore.getState()
+
+  // rag flow don't have start node
+  const startNode = nodesWithInspectVars.find(node => node.nodeType === BlockEnum.Start)
+  const systemVars = startNode?.vars.filter(varItem => varItem.selector[0] === 'sys')
+
+  const fetchInspectVarValue = (selector: ValueSelector) => {
+    const nodeId = selector[0]
+    const isSystemVar = selector[1] === 'sys'
+    const isConversationVar = selector[1] === 'conversation'
+    console.log(nodeId, isSystemVar, isConversationVar)
+    // fetch values under nodeId. system var and conversation var has different fetch method
+  }
+
+  const editInspectVarValue = (varId: string, value: any) => {
+    console.log('edit var', varId, value)
+    // call api and update store
+  }
+
+  const editInspectVarSelector = (varId: string, selector: ValueSelector) => {
+    console.log('edit var selector', varId, selector)
+    // call api and update store
+  }
+
+  const editInspectVarValueType = (varId: string, valueType: VarType) => {
+    console.log('edit var value type', varId, valueType)
+  }
+
+  const deleteInspectVar = async (varId: string) => {
+    console.log('delete var', varId)
+  }
+
+  const deleteNodeInspectorVars = async (nodeId: string) => {
+    // todo fetch api
+    deleteNodeInspectVarsInStore(nodeId)
+  }
+
+  const deleteAllInspectorVars = async () => {
+    // todo fetch api
+    deleteAllInspectVarsInStore()
+  }
+
+  const isInspectVarEdited = (nodeId: string, key: string) => {
+    return getInspectVar(nodeId, key) !== getLastRunVar(nodeId, key)
+  }
+
+  const resetToLastRunVar = (nodeId: string, key: string) => {
+    const lastRunVar = getLastRunVar(nodeId, key)
+    if (lastRunVar)
+      setInspectVar(nodeId, key, lastRunVar)
+  }
+
+  return {
+    conversationVars,
+    systemVars,
+    nodesWithInspectVars,
+    fetchInspectVarValue,
+    editInspectVarValue,
+    editInspectVarSelector,
+    editInspectVarValueType,
+    deleteInspectVar,
+    deleteNodeInspectorVars,
+    deleteAllInspectorVars,
+    isInspectVarEdited,
+    resetToLastRunVar,
+  }
+}
+
+export default useCurrentVars

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

@@ -11,10 +11,10 @@ type InspectVarsState = {
 type InspectVarsActions = {
   setCurrentFocusNodeId: (nodeId: string | null) => void
   setNodesWithInspectVars: (payload: NodeWithVar[]) => void
-  clearInspectVars: () => void
+  deleteAllInspectVars: () => void
   getAllInspectVars: () => NodeWithVar[]
   setNodeInspectVars: (nodeId: string, payload: NodeWithVar) => void
-  clearNodeInspectVars: (nodeId: string) => void
+  deleteNodeInspectVars: (nodeId: string) => void
   getNodeInspectVars: (nodeId: string) => NodeWithVar | undefined
   hasNodeInspectVars: (nodeId: string) => boolean
   setInspectVar: (nodeId: string, name: string, value: any) => void
@@ -41,7 +41,7 @@ export const createInspectVarsSlice: StateCreator<InspectVarsSliceShape> = (set,
     getAllInspectVars: () => {
       return get().nodesWithInspectVars
     },
-    clearInspectVars: () => {
+    deleteAllInspectVars: () => {
       set(() => ({
         nodesWithInspectVars: [],
       }))
@@ -62,7 +62,7 @@ export const createInspectVarsSlice: StateCreator<InspectVarsSliceShape> = (set,
         }
       })
     },
-    clearNodeInspectVars: (nodeId) => {
+    deleteNodeInspectVars: (nodeId) => {
       set(produce((state: InspectVarsSliceShape) => {
         const nodes = state.nodesWithInspectVars.filter(node => node.nodeId !== nodeId)
         state.nodesWithInspectVars = nodes

web/app/components/workflow/variable-inspect/left.tsx

@@ -13,7 +13,7 @@ import Button from '@/app/components/base/button'
 import BlockIcon from '@/app/components/workflow/block-icon'
 import { BubbleX, Env } from '@/app/components/base/icons/src/vender/line/others'
 import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
-import useCurrentVars from '../hooks/use-current-vars'
+import useCurrentVars from '../hooks/use-inspect-vars-crud'
 import cn from '@/utils/classnames'
 
 type Props = {

web/app/components/workflow/variable-inspect/right.tsx

@@ -7,7 +7,7 @@ import {
 } from '@remixicon/react'
 import { useStore } from '../store'
 import { BlockEnum } from '../types'
-import useCurrentVars from '../hooks/use-current-vars'
+import useCurrentVars from '../hooks/use-inspect-vars-crud'
 import Empty from './empty'
 import ValueContent from './value-content'
 import ActionButton from '@/app/components/base/action-button'

web/app/components/workflow/variable-inspect/trigger.tsx

@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next'
 import { RiLoader2Line, RiStopCircleFill } from '@remixicon/react'
 import Tooltip from '@/app/components/base/tooltip'
 import { useStore } from '../store'
-import useCurrentVars from '../hooks/use-current-vars'
+import useCurrentVars from '../hooks/use-inspect-vars-crud'
 import { WorkflowRunningStatus } from '@/app/components/workflow/types'
 import { NodeRunningStatus } from '@/app/components/workflow/types'
 import cn from '@/utils/classnames'
@@ -25,7 +25,7 @@ const VariableInspectTrigger: FC = () => {
   }, [workflowRunningData])
 
   const {
-    currentVars,
+    nodesWithInspectVars: currentVars,
     clearCurrentVars,
   } = useCurrentVars()
 

web/types/workflow.ts

@@ -394,4 +394,6 @@ export type NodeWithVar = {
   nodeType: BlockEnum
   title: string
   vars: VarInInspect[]
+  isFetchingValues?: boolean
+  isSingRunRunning: boolean
 }