refactor: replace useStore hooks with useAll*Tools hooks for better data fetching in workflow components

web/app/components/workflow/hooks/use-checklist.ts

@@ -45,14 +45,19 @@ import { getNodeUsedVars, isSpecialVar } from '../nodes/_base/components/variabl
 import { useModelList } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import { ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import type { KnowledgeBaseNodeType } from '../nodes/knowledge-base/types'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 export const useChecklist = (nodes: Node[], edges: Edge[]) => {
   const { t } = useTranslation()
   const language = useGetLanguage()
   const { nodesMap: nodesExtraData } = useNodesMetaData()
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   const { data: strategyProviders } = useStrategyProviders()
   const datasetsDetail = useDatasetsDetailStore(s => s.datasetsDetail)
@@ -104,7 +109,7 @@ export const useChecklist = (nodes: Node[], edges: Edge[]) => {
       let usedVars: ValueSelector[] = []
 
       if (node.data.type === BlockEnum.Tool)
-        moreDataForCheckValid = getToolCheckParams(node.data as ToolNodeType, buildInTools, customTools, workflowTools, language)
+        moreDataForCheckValid = getToolCheckParams(node.data as ToolNodeType, buildInTools || [], customTools || [], workflowTools || [], language)
 
       if (node.data.type === BlockEnum.DataSource)
         moreDataForCheckValid = getDataSourceCheckParams(node.data as DataSourceNodeType, dataSourceList || [], language)
@@ -194,6 +199,9 @@ export const useChecklistBeforePublish = () => {
   const { getNodesAvailableVarList } = useGetNodesAvailableVarList()
   const { data: embeddingModelList } = useModelList(ModelTypeEnum.textEmbedding)
   const { data: rerankModelList } = useModelList(ModelTypeEnum.rerank)
+  const { data: buildInTools } = useAllBuiltInTools()
+  const { data: customTools } = useAllCustomTools()
+  const { data: workflowTools } = useAllWorkflowTools()
 
   const getCheckData = useCallback((data: CommonNodeType<{}>, datasets: DataSet[]) => {
     let checkData = data
@@ -230,9 +238,6 @@ export const useChecklistBeforePublish = () => {
     } = store.getState()
     const {
       dataSourceList,
-      buildInTools,
-      customTools,
-      workflowTools,
     } = workflowStore.getState()
     const nodes = getNodes()
     const filteredNodes = nodes.filter(node => node.type === CUSTOM_NODE)
@@ -275,7 +280,7 @@ export const useChecklistBeforePublish = () => {
       let moreDataForCheckValid
       let usedVars: ValueSelector[] = []
       if (node.data.type === BlockEnum.Tool)
-        moreDataForCheckValid = getToolCheckParams(node.data as ToolNodeType, buildInTools, customTools, workflowTools, language)
+        moreDataForCheckValid = getToolCheckParams(node.data as ToolNodeType, buildInTools || [], customTools || [], workflowTools || [], language)
 
       if (node.data.type === BlockEnum.DataSource)
         moreDataForCheckValid = getDataSourceCheckParams(node.data as DataSourceNodeType, dataSourceList || [], language)
@@ -340,7 +345,7 @@ export const useChecklistBeforePublish = () => {
     }
 
     return true
-  }, [store, notify, t, language, nodesExtraData, strategyProviders, updateDatasetsDetail, getCheckData, getStartNodes, workflowStore])
+  }, [store, notify, t, language, nodesExtraData, strategyProviders, updateDatasetsDetail, getCheckData, getStartNodes, workflowStore, buildInTools, customTools, workflowTools])
 
   return {
     handleCheckBeforePublish,

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

@@ -11,6 +11,12 @@ import useMatchSchemaType, { getMatchedSchemaType } from '../nodes/_base/compone
 import { toNodeOutputVars } from '../nodes/_base/components/variable/utils'
 import type { SchemaTypeDefinition } from '@/service/use-common'
 import { useCallback } from 'react'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 type Params = {
   flowType: FlowType
@@ -27,17 +33,17 @@ export const useSetWorkflowVarsWithValue = ({
   const invalidateSysVarValues = useInvalidateSysVarValues(flowType, flowId)
   const { handleCancelAllNodeSuccessStatus } = useNodesInteractionsWithoutSync()
   const { schemaTypeDefinitions } = useMatchSchemaType()
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   const allPluginInfoList = {
-    buildInTools,
+    buildInTools: buildInTools || [],
-    customTools,
+    customTools: customTools || [],
-    workflowTools,
+    workflowTools: workflowTools || [],
-    mcpTools,
+    mcpTools: mcpTools || [],
-    dataSourceList: dataSourceList ?? [],
+    dataSourceList: dataSourceList || [],
   }
 
   const setInspectVarsToStore = (inspectVars: VarInInspect[], passedInAllPluginInfoList?: Record<string, ToolWithProvider[]>, passedInSchemaTypeDefinitions?: SchemaTypeDefinition[]) => {

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

@@ -18,6 +18,12 @@ import type { FlowType } from '@/types/common'
 import useFLow from '@/service/use-flow'
 import { useStoreApi } from 'reactflow'
 import type { SchemaTypeDefinition } from '@/service/use-common'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 type Params = {
   flowId: string
@@ -51,6 +57,11 @@ export const useInspectVarsCrudCommon = ({
   const { mutateAsync: doEditInspectorVar } = useEditInspectorVar(flowId)
   const { handleCancelNodeSuccessStatus } = useNodesInteractionsWithoutSync()
   const { handleEdgeCancelRunningStatus } = useEdgesInteractionsWithoutSync()
+  const { data: buildInTools } = useAllBuiltInTools()
+  const { data: customTools } = useAllCustomTools()
+  const { data: workflowTools } = useAllWorkflowTools()
+  const { data: mcpTools } = useAllMCPTools()
+
   const getNodeInspectVars = useCallback((nodeId: string) => {
     const { nodesWithInspectVars } = workflowStore.getState()
     const node = nodesWithInspectVars.find(node => node.nodeId === nodeId)
@@ -98,10 +109,6 @@ export const useInspectVarsCrudCommon = ({
   const fetchInspectVarValue = useCallback(async (selector: ValueSelector, schemaTypeDefinitions: SchemaTypeDefinition[]) => {
     const {
       setNodeInspectVars,
-      buildInTools,
-      customTools,
-      workflowTools,
-      mcpTools,
       dataSourceList,
     } = workflowStore.getState()
     const nodeId = selector[0]
@@ -119,11 +126,11 @@ export const useInspectVarsCrudCommon = ({
     const nodeArr = getNodes()
     const currentNode = nodeArr.find(node => node.id === nodeId)
     const allPluginInfoList = {
-      buildInTools,
+      buildInTools: buildInTools || [],
-      customTools,
+      customTools: customTools || [],
-      workflowTools,
+      workflowTools: workflowTools || [],
-      mcpTools,
+      mcpTools: mcpTools || [],
-      dataSourceList: dataSourceList ?? [],
+      dataSourceList: dataSourceList || [],
     }
     const currentNodeOutputVars = toNodeOutputVars([currentNode], false, () => true, [], [], [], allPluginInfoList, schemaTypeDefinitions)
     const vars = await fetchNodeInspectVars(flowType, flowId, nodeId)
@@ -135,7 +142,7 @@ export const useInspectVarsCrudCommon = ({
       }
     })
     setNodeInspectVars(nodeId, varsWithSchemaType)
-  }, [workflowStore, flowType, flowId, invalidateSysVarValues, invalidateConversationVarValues])
+  }, [workflowStore, flowType, flowId, invalidateSysVarValues, invalidateConversationVarValues, buildInTools, customTools, workflowTools, mcpTools])
 
   // after last run would call this
   const appendNodeInspectVars = useCallback((nodeId: string, payload: VarInInspect[], allNodes: Node[]) => {

web/app/components/workflow/hooks/use-nodes-meta-data.ts

@@ -7,6 +7,11 @@ import { CollectionType } from '@/app/components/tools/types'
 import { useStore } from '@/app/components/workflow/store'
 import { canFindTool } from '@/utils'
 import { useGetLanguage } from '@/context/i18n'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 export const useNodesMetaData = () => {
   const availableNodesMetaData = useHooksStore(s => s.availableNodesMetaData)
@@ -21,9 +26,9 @@ export const useNodesMetaData = () => {
 
 export const useNodeMetaData = (node: Node) => {
   const language = useGetLanguage()
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   const availableNodesMetaData = useNodesMetaData()
   const { data } = node
@@ -34,10 +39,10 @@ export const useNodeMetaData = (node: Node) => {
 
     if (data.type === BlockEnum.Tool) {
       if (data.provider_type === CollectionType.builtIn)
-        return buildInTools.find(toolWithProvider => canFindTool(toolWithProvider.id, data.provider_id))?.author
+        return buildInTools?.find(toolWithProvider => canFindTool(toolWithProvider.id, data.provider_id))?.author
       if (data.provider_type === CollectionType.workflow)
-        return workflowTools.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.author
+        return workflowTools?.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.author
-      return customTools.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.author
+      return customTools?.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.author
     }
     return nodeMetaData?.metaData.author
   }, [data, buildInTools, customTools, workflowTools, nodeMetaData, dataSourceList])
@@ -47,10 +52,10 @@ export const useNodeMetaData = (node: Node) => {
       return dataSourceList?.find(dataSource => dataSource.plugin_id === data.plugin_id)?.description[language]
     if (data.type === BlockEnum.Tool) {
       if (data.provider_type === CollectionType.builtIn)
-        return buildInTools.find(toolWithProvider => canFindTool(toolWithProvider.id, data.provider_id))?.description[language]
+        return buildInTools?.find(toolWithProvider => canFindTool(toolWithProvider.id, data.provider_id))?.description[language]
       if (data.provider_type === CollectionType.workflow)
-        return workflowTools.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.description[language]
+        return workflowTools?.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.description[language]
-      return customTools.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.description[language]
+      return customTools?.find(toolWithProvider => toolWithProvider.id === data.provider_id)?.description[language]
     }
     return nodeMetaData?.metaData.description
   }, [data, buildInTools, customTools, workflowTools, nodeMetaData, dataSourceList, language])

web/app/components/workflow/hooks/use-tool-icon.ts

@@ -14,12 +14,18 @@ import {
 } from '../store'
 import { CollectionType } from '@/app/components/tools/types'
 import { canFindTool } from '@/utils'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 export const useToolIcon = (data?: Node['data']) => {
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   // const a = useStore(s => s.data)
   const toolIcon = useMemo(() => {
@@ -27,15 +33,15 @@ export const useToolIcon = (data?: Node['data']) => {
       return ''
     if (data.type === BlockEnum.Tool) {
       // eslint-disable-next-line sonarjs/no-dead-store
-      let targetTools = buildInTools
+      let targetTools = buildInTools || []
       if (data.provider_type === CollectionType.builtIn)
-        targetTools = buildInTools
+        targetTools = buildInTools || []
       else if (data.provider_type === CollectionType.custom)
-        targetTools = customTools
+        targetTools = customTools || []
       else if (data.provider_type === CollectionType.mcp)
-        targetTools = mcpTools
+        targetTools = mcpTools || []
       else
-        targetTools = workflowTools
+        targetTools = workflowTools || []
       return targetTools.find(toolWithProvider => canFindTool(toolWithProvider.id, data.provider_id))?.icon
     }
     if (data.type === BlockEnum.DataSource)
@@ -46,24 +52,24 @@ export const useToolIcon = (data?: Node['data']) => {
 }
 
 export const useGetToolIcon = () => {
+  const { data: buildInTools } = useAllBuiltInTools()
+  const { data: customTools } = useAllCustomTools()
+  const { data: workflowTools } = useAllWorkflowTools()
   const workflowStore = useWorkflowStore()
   const getToolIcon = useCallback((data: Node['data']) => {
     const {
-      buildInTools,
-      customTools,
-      workflowTools,
       dataSourceList,
     } = workflowStore.getState()
 
     if (data.type === BlockEnum.Tool) {
       // eslint-disable-next-line sonarjs/no-dead-store
-      let targetTools = buildInTools
+      let targetTools = buildInTools || []
       if (data.provider_type === CollectionType.builtIn)
-        targetTools = buildInTools
+        targetTools = buildInTools || []
       else if (data.provider_type === CollectionType.custom)
-        targetTools = customTools
+        targetTools = customTools || []
       else
-        targetTools = workflowTools
+        targetTools = workflowTools || []
       return targetTools.find(toolWithProvider => canFindTool(toolWithProvider.id, data.provider_id))?.icon
     }
 

web/app/components/workflow/hooks/use-workflow-search.tsx

@@ -13,6 +13,11 @@ import type { Emoji } from '@/app/components/tools/types'
 import { CollectionType } from '@/app/components/tools/types'
 import { canFindTool } from '@/utils'
 import type { LLMNodeType } from '../nodes/llm/types'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 /**
  * Hook to register workflow nodes search functionality
@@ -22,9 +27,9 @@ export const useWorkflowSearch = () => {
   const { handleNodeSelect } = useNodesInteractions()
 
   // Filter and process nodes for search
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
   const mcpTools = useStore(s => s.mcpTools)
 
   // Extract tool icon logic - clean separation of concerns
@@ -32,13 +37,13 @@ export const useWorkflowSearch = () => {
     if (nodeData?.type !== BlockEnum.Tool) return undefined
 
     const toolCollections: Record<string, any[]> = {
-      [CollectionType.builtIn]: buildInTools,
+      [CollectionType.builtIn]: buildInTools || [],
-      [CollectionType.custom]: customTools,
+      [CollectionType.custom]: customTools || [],
-      [CollectionType.mcp]: mcpTools,
+      [CollectionType.mcp]: mcpTools || [],
     }
 
     const targetTools = (nodeData.provider_type && toolCollections[nodeData.provider_type]) || workflowTools
-    return targetTools.find((tool: any) => canFindTool(tool.id, nodeData.provider_id))?.icon
+    return targetTools?.find((tool: any) => canFindTool(tool.id, nodeData.provider_id))?.icon
   }, [buildInTools, customTools, workflowTools, mcpTools])
 
   // Extract model info logic - clean extraction

web/app/components/workflow/hooks/use-workflow-variables.ts

@@ -10,20 +10,25 @@ import type {
 } from '@/app/components/workflow/types'
 import { useIsChatMode } from './use-workflow'
 import { useStoreApi } from 'reactflow'
-import { useStore } from '@/app/components/workflow/store'
 import type { Type } from '../nodes/llm/types'
 import useMatchSchemaType from '../nodes/_base/components/variable/use-match-schema-type'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 export const useWorkflowVariables = () => {
   const { t } = useTranslation()
   const workflowStore = useWorkflowStore()
   const { schemaTypeDefinitions } = useMatchSchemaType()
 
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
-  const dataSourceList = useStore(s => s.dataSourceList)
+
   const getNodeAvailableVars = useCallback(({
     parentNode,
     beforeNodes,
@@ -43,6 +48,7 @@ export const useWorkflowVariables = () => {
       conversationVariables,
       environmentVariables,
       ragPipelineVariables,
+      dataSourceList,
     } = workflowStore.getState()
     return toNodeAvailableVars({
       parentNode,
@@ -54,15 +60,15 @@ export const useWorkflowVariables = () => {
       ragVariables: ragPipelineVariables,
       filterVar,
       allPluginInfoList: {
-        buildInTools,
+        buildInTools: buildInTools || [],
-        customTools,
+        customTools: customTools || [],
-        workflowTools,
+        workflowTools: workflowTools || [],
-        mcpTools,
+        mcpTools: mcpTools || [],
-        dataSourceList: dataSourceList ?? [],
+        dataSourceList: dataSourceList || [],
       },
       schemaTypeDefinitions,
     })
-  }, [t, workflowStore, schemaTypeDefinitions, buildInTools])
+  }, [t, workflowStore, schemaTypeDefinitions, buildInTools, customTools, workflowTools, mcpTools])
 
   const getCurrentVariableType = useCallback(({
     parentNode,

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

@@ -32,15 +32,9 @@ import { CUSTOM_NOTE_NODE } from '../note-node/constants'
 import { findUsedVarNodes, getNodeOutputVars, updateNodeVars } from '../nodes/_base/components/variable/utils'
 import { useAvailableBlocks } from './use-available-blocks'
 import { useStore as useAppStore } from '@/app/components/app/store'
-import {
+
-  fetchAllBuiltInTools,
-  fetchAllCustomTools,
-  fetchAllMCPTools,
-  fetchAllWorkflowTools,
-} from '@/service/tools'
 import { CUSTOM_ITERATION_START_NODE } from '@/app/components/workflow/nodes/iteration-start/constants'
 import { CUSTOM_LOOP_START_NODE } from '@/app/components/workflow/nodes/loop-start/constants'
-import { basePath } from '@/utils/var'
 import { useNodesMetaData } from '.'
 
 export const useIsChatMode = () => {
@@ -416,51 +410,6 @@ export const useWorkflow = () => {
   }
 }
 
-export const useFetchToolsData = () => {
-  const workflowStore = useWorkflowStore()
-
-  const handleFetchAllTools = useCallback(async (type: string) => {
-    if (type === 'builtin') {
-      const buildInTools = await fetchAllBuiltInTools()
-
-      if (basePath) {
-        buildInTools.forEach((item) => {
-          if (typeof item.icon == 'string' && !item.icon.includes(basePath))
-            item.icon = `${basePath}${item.icon}`
-        })
-      }
-      workflowStore.setState({
-        buildInTools: buildInTools || [],
-      })
-    }
-    if (type === 'custom') {
-      const customTools = await fetchAllCustomTools()
-
-      workflowStore.setState({
-        customTools: customTools || [],
-      })
-    }
-    if (type === 'workflow') {
-      const workflowTools = await fetchAllWorkflowTools()
-
-      workflowStore.setState({
-        workflowTools: workflowTools || [],
-      })
-    }
-    if (type === 'mcp') {
-      const mcpTools = await fetchAllMCPTools()
-
-      workflowStore.setState({
-        mcpTools: mcpTools || [],
-      })
-    }
-  }, [workflowStore])
-
-  return {
-    handleFetchAllTools,
-  }
-}
-
 export const useWorkflowReadOnly = () => {
   const workflowStore = useWorkflowStore()
   const workflowRunningData = useStore(s => s.workflowRunningData)

web/app/components/workflow/index.tsx

@@ -37,7 +37,6 @@ import {
 } from './types'
 import {
   useEdgesInteractions,
-  useFetchToolsData,
   useNodesInteractions,
   useNodesReadOnly,
   useNodesSyncDraft,
@@ -92,6 +91,12 @@ import useMatchSchemaType from './nodes/_base/components/variable/use-match-sche
 import type { VarInInspect } from '@/types/workflow'
 import { fetchAllInspectVars } from '@/service/workflow'
 import cn from '@/utils/classnames'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 const Confirm = dynamic(() => import('@/app/components/base/confirm'), {
   ssr: false,
@@ -242,13 +247,6 @@ export const Workflow: FC<WorkflowProps> = memo(({
       })
     }
   })
-  const { handleFetchAllTools } = useFetchToolsData()
-  useEffect(() => {
-    handleFetchAllTools('builtin')
-    handleFetchAllTools('custom')
-    handleFetchAllTools('workflow')
-    handleFetchAllTools('mcp')
-  }, [handleFetchAllTools])
 
   const {
     handleNodeDragStart,
@@ -299,10 +297,10 @@ export const Workflow: FC<WorkflowProps> = memo(({
 
   const { schemaTypeDefinitions } = useMatchSchemaType()
   const { fetchInspectVars } = useSetWorkflowVarsWithValue()
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   // buildInTools, customTools, workflowTools, mcpTools, dataSourceList
   const configsMap = useHooksStore(s => s.configsMap)
@@ -323,10 +321,10 @@ export const Workflow: FC<WorkflowProps> = memo(({
         passInVars: true,
         vars,
         passedInAllPluginInfoList: {
-          buildInTools,
+          buildInTools: buildInTools || [],
-          customTools,
+          customTools: customTools || [],
-          workflowTools,
+          workflowTools: workflowTools || [],
-          mcpTools,
+          mcpTools: mcpTools || [],
           dataSourceList: dataSourceList ?? [],
         },
         passedInSchemaTypeDefinitions: schemaTypeDefinitions,

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

@@ -75,6 +75,7 @@ import { DataSourceClassification } from '@/app/components/workflow/nodes/data-s
 import { useModalContext } from '@/context/modal-context'
 import DataSourceBeforeRunForm from '@/app/components/workflow/nodes/data-source/before-run-form'
 import useInspectVarsCrud from '@/app/components/workflow/hooks/use-inspect-vars-crud'
+import { useAllBuiltInTools } from '@/service/use-tools'
 
 const getCustomRunForm = (params: CustomRunFormProps): React.JSX.Element => {
   const nodeType = params.payload.type
@@ -259,9 +260,9 @@ const BasePanel: FC<BasePanelProps> = ({
     return {}
   })()
 
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
   const currCollection = useMemo(() => {
-    return buildInTools.find(item => canFindTool(item.id, data.provider_id))
+    return buildInTools?.find(item => canFindTool(item.id, data.provider_id))
   }, [buildInTools, data.provider_id])
   const showPluginAuth = useMemo(() => {
     return data.type === BlockEnum.Tool && currCollection?.allow_delete

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

@@ -53,6 +53,13 @@ import { useInvalidLastRun } from '@/service/use-workflow'
 import useInspectVarsCrud from '../../../hooks/use-inspect-vars-crud'
 import type { FlowType } from '@/types/common'
 import useMatchSchemaType from '../components/variable/use-match-schema-type'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
+
 // eslint-disable-next-line ts/no-unsafe-function-type
 const checkValidFns: Record<BlockEnum, Function> = {
   [BlockEnum.LLM]: checkLLMValid,
@@ -133,21 +140,23 @@ const useOneStepRun = <T>({
   const availableNodesIncludeParent = getBeforeNodesInSameBranchIncludeParent(id)
   const workflowStore = useWorkflowStore()
   const { schemaTypeDefinitions } = useMatchSchemaType()
+
+  const { data: buildInTools } = useAllBuiltInTools()
+  const { data: customTools } = useAllCustomTools()
+  const { data: workflowTools } = useAllWorkflowTools()
+  const { data: mcpTools } = useAllMCPTools()
+
   const getVar = (valueSelector: ValueSelector): Var | undefined => {
     const isSystem = valueSelector[0] === 'sys'
     const {
-      buildInTools,
-      customTools,
-      workflowTools,
-      mcpTools,
       dataSourceList,
     } = workflowStore.getState()
     const allPluginInfoList = {
-      buildInTools,
+      buildInTools: buildInTools || [],
-      customTools,
+      customTools: customTools || [],
-      workflowTools,
+      workflowTools: workflowTools || [],
-      mcpTools,
+      mcpTools: mcpTools || [],
-      dataSourceList: dataSourceList ?? [],
+      dataSourceList: dataSourceList || [],
     }
 
     const allOutputVars = toNodeOutputVars(availableNodes, isChatMode, undefined, undefined, conversationVariables, [], allPluginInfoList, schemaTypeDefinitions)

web/app/components/workflow/nodes/if-else/components/condition-list/condition-item.tsx

@@ -42,6 +42,12 @@ import BoolValue from '@/app/components/workflow/panel/chat-variable-panel/compo
 import { getVarType } from '@/app/components/workflow/nodes/_base/components/variable/utils'
 import { useIsChatMode } from '@/app/components/workflow/hooks/use-workflow'
 import useMatchSchemaType from '../../../_base/components/variable/use-match-schema-type'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 const optionNameI18NPrefix = 'workflow.nodes.ifElse.optionName'
 
 type ConditionItemProps = {
@@ -91,15 +97,12 @@ const ConditionItem = ({
   const [isHovered, setIsHovered] = useState(false)
   const [open, setOpen] = useState(false)
 
+  const { data: buildInTools } = useAllBuiltInTools()
+  const { data: customTools } = useAllCustomTools()
+  const { data: workflowTools } = useAllWorkflowTools()
+  const { data: mcpTools } = useAllMCPTools()
+
   const workflowStore = useWorkflowStore()
-  const {
-    setControlPromptEditorRerenderKey,
-    buildInTools,
-    customTools,
-    mcpTools,
-    workflowTools,
-    dataSourceList,
-  } = workflowStore.getState()
 
   const doUpdateCondition = useCallback((newCondition: Condition) => {
     if (isSubVariableKey)
@@ -213,6 +216,8 @@ const ConditionItem = ({
   const handleVarChange = useCallback((valueSelector: ValueSelector, _varItem: Var) => {
     const {
       conversationVariables,
+      setControlPromptEditorRerenderKey,
+      dataSourceList,
     } = workflowStore.getState()
     const resolvedVarType = getVarType({
       valueSelector,
@@ -220,11 +225,11 @@ const ConditionItem = ({
       availableNodes,
       isChatMode,
       allPluginInfoList: {
-        buildInTools,
+        buildInTools: buildInTools || [],
-        customTools,
+        customTools: customTools || [],
-        mcpTools,
+        mcpTools: mcpTools || [],
-        workflowTools,
+        workflowTools: workflowTools || [],
-        dataSourceList: dataSourceList ?? [],
+        dataSourceList: dataSourceList || [],
       },
       schemaTypeDefinitions,
     })
@@ -241,12 +246,12 @@ const ConditionItem = ({
     })
     doUpdateCondition(newCondition)
     setOpen(false)
-  }, [condition, doUpdateCondition, availableNodes, isChatMode, setControlPromptEditorRerenderKey, schemaTypeDefinitions])
+  }, [condition, doUpdateCondition, availableNodes, isChatMode, schemaTypeDefinitions, buildInTools, customTools, mcpTools, workflowTools])
 
   const showBooleanInput = useMemo(() => {
     if(condition.varType === VarType.boolean)
       return true
-    // eslint-disable-next-line sonarjs/prefer-single-boolean-return
+
     if(condition.varType === VarType.arrayBoolean && [ComparisonOperator.contains, ComparisonOperator.notContains].includes(condition.comparison_operator!))
       return true
     return false

web/app/components/workflow/nodes/iteration/use-config.ts

@@ -15,6 +15,12 @@ import type { Item } from '@/app/components/base/select'
 import useInspectVarsCrud from '../../hooks/use-inspect-vars-crud'
 import { isEqual } from 'lodash-es'
 import { useStore } from '../../store'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 const useConfig = (id: string, payload: IterationNodeType) => {
   const {
@@ -40,17 +46,17 @@ const useConfig = (id: string, payload: IterationNodeType) => {
   // output
   const { getIterationNodeChildren } = useWorkflow()
   const iterationChildrenNodes = getIterationNodeChildren(id)
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   const allPluginInfoList = {
-    buildInTools,
+    buildInTools: buildInTools || [],
-    customTools,
+    customTools: customTools || [],
-    workflowTools,
+    workflowTools: workflowTools || [],
-    mcpTools,
+    mcpTools: mcpTools || [],
-    dataSourceList: dataSourceList ?? [],
+    dataSourceList: dataSourceList || [],
   }
   const childrenNodeVars = toNodeOutputVars(iterationChildrenNodes, isChatMode, undefined, [], [], [], allPluginInfoList)
 

web/app/components/workflow/nodes/loop/use-config.ts

@@ -15,9 +15,24 @@ import useNodeCrud from '../_base/hooks/use-node-crud'
 import { toNodeOutputVars } from '../_base/components/variable/utils'
 import { getOperators } from './utils'
 import { LogicalOperator } from './types'
-import type { HandleAddCondition, HandleAddSubVariableCondition, HandleRemoveCondition, HandleToggleConditionLogicalOperator, HandleToggleSubVariableConditionLogicalOperator, HandleUpdateCondition, HandleUpdateSubVariableCondition, LoopNodeType } from './types'
+import type {
+  HandleAddCondition,
+  HandleAddSubVariableCondition,
+  HandleRemoveCondition,
+  HandleToggleConditionLogicalOperator,
+  HandleToggleSubVariableConditionLogicalOperator,
+  HandleUpdateCondition,
+  HandleUpdateSubVariableCondition,
+  LoopNodeType,
+} from './types'
 import useIsVarFileAttribute from './use-is-var-file-attribute'
 import { useStore } from '@/app/components/workflow/store'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 const useConfig = (id: string, payload: LoopNodeType) => {
   const { nodesReadOnly: readOnly } = useNodesReadOnly()
@@ -38,17 +53,17 @@ const useConfig = (id: string, payload: LoopNodeType) => {
   // output
   const { getLoopNodeChildren } = useWorkflow()
   const loopChildrenNodes = [{ id, data: payload } as any, ...getLoopNodeChildren(id)]
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
   const dataSourceList = useStore(s => s.dataSourceList)
   const allPluginInfoList = {
-    buildInTools,
+    buildInTools: buildInTools || [],
-    customTools,
+    customTools: customTools || [],
-    workflowTools,
+    workflowTools: workflowTools || [],
-    mcpTools,
+    mcpTools: mcpTools || [],
-    dataSourceList: dataSourceList ?? [],
+    dataSourceList: dataSourceList || [],
   }
   const childrenNodeVars = toNodeOutputVars(loopChildrenNodes, isChatMode, undefined, [], conversationVariables, [], allPluginInfoList)
 

web/app/components/workflow/nodes/parameter-extractor/components/extract-parameter/import-from-tool.tsx

@@ -8,7 +8,6 @@ import { useTranslation } from 'react-i18next'
 import BlockSelector from '../../../../block-selector'
 import type { Param, ParamType } from '../../types'
 import cn from '@/utils/classnames'
-import { useStore } from '@/app/components/workflow/store'
 import type {
   DataSourceDefaultValue,
   ToolDefaultValue,
@@ -18,6 +17,11 @@ import { CollectionType } from '@/app/components/tools/types'
 import type { BlockEnum } from '@/app/components/workflow/types'
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import { canFindTool } from '@/utils'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllWorkflowTools,
+} from '@/service/use-tools'
 
 const i18nPrefix = 'workflow.nodes.parameterExtractor'
 
@@ -42,9 +46,9 @@ const ImportFromTool: FC<Props> = ({
   const { t } = useTranslation()
   const language = useLanguage()
 
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
 
   const handleSelectTool = useCallback((_type: BlockEnum, toolInfo?: ToolDefaultValue | DataSourceDefaultValue) => {
     if (!toolInfo || 'datasource_name' in toolInfo)
@@ -54,11 +58,11 @@ const ImportFromTool: FC<Props> = ({
     const currentTools = (() => {
       switch (provider_type) {
         case CollectionType.builtIn:
-          return buildInTools
+          return buildInTools || []
         case CollectionType.custom:
-          return customTools
+          return customTools || []
         case CollectionType.workflow:
-          return workflowTools
+          return workflowTools || []
         default:
           return []
       }

web/app/components/workflow/nodes/tool/use-config.ts

@@ -2,7 +2,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { produce } from 'immer'
 import { useBoolean } from 'ahooks'
-import { useStore, useWorkflowStore } from '../../store'
+import { useWorkflowStore } from '../../store'
 import type { ToolNodeType, ToolVarInputs } from './types'
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import useNodeCrud from '@/app/components/workflow/nodes/_base/hooks/use-node-crud'
@@ -15,15 +15,20 @@ import {
 import Toast from '@/app/components/base/toast'
 import type { InputVar } from '@/app/components/workflow/types'
 import {
-  useFetchToolsData,
   useNodesReadOnly,
 } from '@/app/components/workflow/hooks'
 import { canFindTool } from '@/utils'
+import {
+  useAllBuiltInTools,
+  useAllCustomTools,
+  useAllMCPTools,
+  useAllWorkflowTools,
+  useInvalidToolsByType,
+} from '@/service/use-tools'
 
 const useConfig = (id: string, payload: ToolNodeType) => {
   const workflowStore = useWorkflowStore()
   const { nodesReadOnly: readOnly } = useNodesReadOnly()
-  const { handleFetchAllTools } = useFetchToolsData()
   const { t } = useTranslation()
 
   const language = useLanguage()
@@ -43,21 +48,21 @@ const useConfig = (id: string, payload: ToolNodeType) => {
     tool_parameters,
   } = inputs
   const isBuiltIn = provider_type === CollectionType.builtIn
-  const buildInTools = useStore(s => s.buildInTools)
+  const { data: buildInTools } = useAllBuiltInTools()
-  const customTools = useStore(s => s.customTools)
+  const { data: customTools } = useAllCustomTools()
-  const workflowTools = useStore(s => s.workflowTools)
+  const { data: workflowTools } = useAllWorkflowTools()
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: mcpTools } = useAllMCPTools()
 
   const currentTools = useMemo(() => {
     switch (provider_type) {
       case CollectionType.builtIn:
-        return buildInTools
+        return buildInTools || []
       case CollectionType.custom:
-        return customTools
+        return customTools || []
       case CollectionType.workflow:
-        return workflowTools
+        return workflowTools || []
       case CollectionType.mcp:
-        return mcpTools
+        return mcpTools || []
       default:
         return []
     }
@@ -75,6 +80,7 @@ const useConfig = (id: string, payload: ToolNodeType) => {
     { setTrue: showSetAuthModal, setFalse: hideSetAuthModal },
   ] = useBoolean(false)
 
+  const invalidToolsByType = useInvalidToolsByType(provider_type)
   const handleSaveAuth = useCallback(
     async (value: any) => {
       await updateBuiltInToolCredential(currCollection?.name as string, value)
@@ -83,14 +89,14 @@ const useConfig = (id: string, payload: ToolNodeType) => {
         type: 'success',
         message: t('common.api.actionSuccess'),
       })
-      handleFetchAllTools(provider_type)
+      invalidToolsByType()
       hideSetAuthModal()
     },
     [
       currCollection?.name,
       hideSetAuthModal,
       t,
-      handleFetchAllTools,
+      invalidToolsByType,
       provider_type,
     ],
   )
@@ -241,17 +247,15 @@ const useConfig = (id: string, payload: ToolNodeType) => {
           name: outputKey,
           type:
             output.type === 'array'
-              ? `Array[${
+              ? `Array[${output.items?.type
-                output.items?.type
+                ? output.items.type.slice(0, 1).toLocaleUpperCase()
-                  ? output.items.type.slice(0, 1).toLocaleUpperCase()
+                + output.items.type.slice(1)
-                      + output.items.type.slice(1)
+                : 'Unknown'
-                  : 'Unknown'
               }]`
-              : `${
+              : `${output.type
-                output.type
+                ? output.type.slice(0, 1).toLocaleUpperCase()
-                  ? output.type.slice(0, 1).toLocaleUpperCase()
+                + output.type.slice(1)
-                      + output.type.slice(1)
+                : 'Unknown'
-                  : 'Unknown'
               }`,
           description: output.description,
         })

web/app/components/workflow/store/workflow/tool-slice.ts

@@ -1,30 +1,11 @@
 import type { StateCreator } from 'zustand'
-import type {
-  ToolWithProvider,
-} from '@/app/components/workflow/types'
 
 export type ToolSliceShape = {
-  buildInTools: ToolWithProvider[]
-  setBuildInTools: (tools: ToolWithProvider[]) => void
-  customTools: ToolWithProvider[]
-  setCustomTools: (tools: ToolWithProvider[]) => void
-  workflowTools: ToolWithProvider[]
-  setWorkflowTools: (tools: ToolWithProvider[]) => void
-  mcpTools: ToolWithProvider[]
-  setMcpTools: (tools: ToolWithProvider[]) => void
   toolPublished: boolean
   setToolPublished: (toolPublished: boolean) => void
 }
 
 export const createToolSlice: StateCreator<ToolSliceShape> = set => ({
-  buildInTools: [],
-  setBuildInTools: buildInTools => set(() => ({ buildInTools })),
-  customTools: [],
-  setCustomTools: customTools => set(() => ({ customTools })),
-  workflowTools: [],
-  setWorkflowTools: workflowTools => set(() => ({ workflowTools })),
-  mcpTools: [],
-  setMcpTools: mcpTools => set(() => ({ mcpTools })),
   toolPublished: false,
   setToolPublished: toolPublished => set(() => ({ toolPublished })),
 })

web/service/use-tools.ts

@@ -4,9 +4,11 @@ import type {
   MCPServerDetail,
   Tool,
 } from '@/app/components/tools/types'
+import { CollectionType } from '@/app/components/tools/types'
 import type { RAGRecommendedPlugins, ToolWithProvider } from '@/app/components/workflow/types'
 import type { AppIconType } from '@/types/app'
 import { useInvalid } from './use-base'
+import type { QueryKey } from '@tanstack/react-query'
 import {
   useMutation,
   useQuery,
@@ -76,6 +78,16 @@ export const useInvalidateAllMCPTools = () => {
   return useInvalid(useAllMCPToolsKey)
 }
 
+const useInvalidToolsKeyMap: Record<string, QueryKey> = {
+  [CollectionType.builtIn]: useAllBuiltInToolsKey,
+  [CollectionType.custom]: useAllCustomToolsKey,
+  [CollectionType.workflow]: useAllWorkflowToolsKey,
+  [CollectionType.mcp]: useAllMCPToolsKey,
+}
+export const useInvalidToolsByType = (type: CollectionType) => {
+  return useInvalid(useInvalidToolsKeyMap[type])
+}
+
 export const useCreateMCP = () => {
   return useMutation({
     mutationKey: [NAME_SPACE, 'create-mcp'],