feat: Introduce RAG tool recommendations and refactor related components for improved plugin management (#27259)

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

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 customTools = useStore(s => s.customTools)
-  const workflowTools = useStore(s => s.workflowTools)
-  const mcpTools = useStore(s => s.mcpTools)
+  const { data: buildInTools } = useAllBuiltInTools()
+  const { data: customTools } = useAllCustomTools()
+  const { data: workflowTools } = useAllWorkflowTools()
+  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[${
-                output.items?.type
-                  ? output.items.type.slice(0, 1).toLocaleUpperCase()
-                      + output.items.type.slice(1)
-                  : 'Unknown'
+              ? `Array[${output.items?.type
+                ? output.items.type.slice(0, 1).toLocaleUpperCase()
+                + output.items.type.slice(1)
+                : 'Unknown'
               }]`
-              : `${
-                output.type
-                  ? output.type.slice(0, 1).toLocaleUpperCase()
-                      + output.type.slice(1)
-                  : 'Unknown'
+              : `${output.type
+                ? output.type.slice(0, 1).toLocaleUpperCase()
+                + output.type.slice(1)
+                : 'Unknown'
               }`,
           description: output.description,
         })