From 0d607a8c9016c8c2d2da61aefde2ceaa8a3fd9e5 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Wed, 13 Nov 2024 16:22:09 +0800
Subject: [PATCH] feat: add update workflow to update use query

---
 web/app/components/tools/provider/detail.tsx  |  4 +++-
 .../tools/workflow-tool/configure-button.tsx  |  4 ++++
 web/service/use-plugins.ts                    |  3 +++
 web/service/use-tools.ts                      | 24 +++++++------------
 4 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/web/app/components/tools/provider/detail.tsx b/web/app/components/tools/provider/detail.tsx
index 96f36a2095..93b728e4c5 100644
--- a/web/app/components/tools/provider/detail.tsx
+++ b/web/app/components/tools/provider/detail.tsx
@@ -44,6 +44,7 @@ import { useProviderContext } from '@/context/provider-context'
 import { ConfigurationMethodEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
 import Loading from '@/app/components/base/loading'
 import { useAppContext } from '@/context/app-context'
+import { useInvalidateAllWorkflowTools } from '@/service/use-tools'
 
 type Props = {
   collection: Collection
@@ -65,7 +66,7 @@ const ProviderDetail = ({
   const isBuiltIn = collection.type === CollectionType.builtIn
   const isModel = collection.type === CollectionType.model
   const { isCurrentWorkspaceManager } = useAppContext()
-
+  const invalidateAllWorkflowTools = useInvalidateAllWorkflowTools()
   const [isDetailLoading, setIsDetailLoading] = useState(false)
 
   // built in provider
@@ -164,6 +165,7 @@ const ProviderDetail = ({
     workflow_tool_id: string
   }>) => {
     await saveWorkflowToolProvider(data)
+    invalidateAllWorkflowTools()
     onRefreshData()
     getWorkflowToolProvider()
     Toast.notify({
diff --git a/web/app/components/tools/workflow-tool/configure-button.tsx b/web/app/components/tools/workflow-tool/configure-button.tsx
index 6521410dae..18d1191235 100644
--- a/web/app/components/tools/workflow-tool/configure-button.tsx
+++ b/web/app/components/tools/workflow-tool/configure-button.tsx
@@ -14,6 +14,7 @@ import { createWorkflowToolProvider, fetchWorkflowToolDetailByAppID, saveWorkflo
 import type { Emoji, WorkflowToolProviderParameter, WorkflowToolProviderRequest, WorkflowToolProviderResponse } from '@/app/components/tools/types'
 import type { InputVar } from '@/app/components/workflow/types'
 import { useAppContext } from '@/context/app-context'
+import { useInvalidateAllWorkflowTools } from '@/service/use-tools'
 
 type Props = {
   disabled: boolean
@@ -46,6 +47,7 @@ const WorkflowToolConfigureButton = ({
   const [isLoading, setIsLoading] = useState(false)
   const [detail, setDetail] = useState<WorkflowToolProviderResponse>()
   const { isCurrentWorkspaceManager } = useAppContext()
+  const invalidateAllWorkflowTools = useInvalidateAllWorkflowTools()
 
   const outdated = useMemo(() => {
     if (!detail)
@@ -135,6 +137,7 @@ const WorkflowToolConfigureButton = ({
   const createHandle = async (data: WorkflowToolProviderRequest & { workflow_app_id: string }) => {
     try {
       await createWorkflowToolProvider(data)
+      invalidateAllWorkflowTools()
       onRefreshData?.()
       getDetail(workflowAppId)
       Toast.notify({
@@ -156,6 +159,7 @@ const WorkflowToolConfigureButton = ({
       await handlePublish()
       await saveWorkflowToolProvider(data)
       onRefreshData?.()
+      invalidateAllWorkflowTools()
       getDetail(workflowAppId)
       Toast.notify({
         type: 'success',
diff --git a/web/service/use-plugins.ts b/web/service/use-plugins.ts
index 4b99caf835..c9f8058e8f 100644
--- a/web/service/use-plugins.ts
+++ b/web/service/use-plugins.ts
@@ -18,6 +18,7 @@ import {
   useQueryClient,
 } from '@tanstack/react-query'
 import { useStore as usePluginDependencyStore } from '@/app/components/workflow/plugin-dependency/store'
+import { useInvalidateAllBuiltInTools } from './use-tools'
 
 const NAME_SPACE = 'plugins'
 
@@ -31,11 +32,13 @@ export const useInstalledPluginList = () => {
 
 export const useInvalidateInstalledPluginList = () => {
   const queryClient = useQueryClient()
+  const invalidateAllBuiltInTools = useInvalidateAllBuiltInTools()
   return () => {
     queryClient.invalidateQueries(
       {
         queryKey: useInstalledPluginListKey,
       })
+    invalidateAllBuiltInTools()
   }
 }
 
diff --git a/web/service/use-tools.ts b/web/service/use-tools.ts
index ee2af1f398..8b06d47342 100644
--- a/web/service/use-tools.ts
+++ b/web/service/use-tools.ts
@@ -4,6 +4,7 @@ import type {
   Tool,
 } from '@/app/components/tools/types'
 import type { ToolWithProvider } from '@/app/components/workflow/types'
+import { useInvalid } from './use-base'
 import {
   useMutation,
   useQuery,
@@ -21,13 +22,7 @@ export const useAllBuiltInTools = () => {
 }
 
 export const useInvalidateAllBuiltInTools = () => {
-  const queryClient = useQueryClient()
-  return () => {
-    queryClient.invalidateQueries(
-      {
-        queryKey: useAllBuiltInToolsKey,
-      })
-  }
+  return useInvalid(useAllBuiltInToolsKey)
 }
 
 const useAllCustomToolsKey = [NAME_SPACE, 'customTools']
@@ -39,22 +34,21 @@ export const useAllCustomTools = () => {
 }
 
 export const useInvalidateAllCustomTools = () => {
-  const queryClient = useQueryClient()
-  return () => {
-    queryClient.invalidateQueries(
-      {
-        queryKey: useAllCustomToolsKey,
-      })
-  }
+  return useInvalid(useAllCustomToolsKey)
 }
 
+const useAllWorkflowToolsKey = [NAME_SPACE, 'workflowTools']
 export const useAllWorkflowTools = () => {
   return useQuery<ToolWithProvider[]>({
-    queryKey: [NAME_SPACE, 'workflowTools'],
+    queryKey: useAllWorkflowToolsKey,
     queryFn: () => get<ToolWithProvider[]>('/workspaces/current/tools/workflow'),
   })
 }
 
+export const useInvalidateAllWorkflowTools = () => {
+  return useInvalid(useAllWorkflowToolsKey)
+}
+
 export const useBuiltinProviderInfo = (providerName: string) => {
   return useQuery({
     queryKey: [NAME_SPACE, 'builtin-provider-info', providerName],