From 9745570490b483f97e6d6d5b3d9101527f387ff2 Mon Sep 17 00:00:00 2001
From: JzoNg <jzongcode@gmail.com>
Date: Mon, 23 Jun 2025 14:05:29 +0800
Subject: [PATCH] modify oauth

---
 web/app/components/tools/mcp/detail/content.tsx |  4 ++--
 web/app/components/tools/provider-list.tsx      |  2 --
 web/app/oauth-callback/page.tsx                 | 10 ++++++++++
 web/hooks/use-oauth.ts                          | 17 ++++-------------
 4 files changed, 16 insertions(+), 17 deletions(-)
 create mode 100644 web/app/oauth-callback/page.tsx

diff --git a/web/app/components/tools/mcp/detail/content.tsx b/web/app/components/tools/mcp/detail/content.tsx
index 7d6525c104..b9401d4246 100644
--- a/web/app/components/tools/mcp/detail/content.tsx
+++ b/web/app/components/tools/mcp/detail/content.tsx
@@ -90,10 +90,10 @@ const MCPDetailContent: FC<Props> = ({
     setFalse: hideDeleting,
   }] = useBoolean(false)
 
-  const handleOAuthCallback = useCallback((state: string) => {
+  const handleOAuthCallback = useCallback(() => {
     if (!isCurrentWorkspaceManager)
       return
-    if (detail.id !== state)
+    if (!detail.id)
       return
     handleUpdateTools()
   }, [detail.id, handleUpdateTools, isCurrentWorkspaceManager])
diff --git a/web/app/components/tools/provider-list.tsx b/web/app/components/tools/provider-list.tsx
index 35a3ab3dc7..8aee0beb0e 100644
--- a/web/app/components/tools/provider-list.tsx
+++ b/web/app/components/tools/provider-list.tsx
@@ -20,13 +20,11 @@ import MCPList from './mcp'
 import { useSelector as useAppContextSelector } from '@/context/app-context'
 import { useAllToolProviders } from '@/service/use-tools'
 import { useInstalledPluginList, useInvalidateInstalledPluginList } from '@/service/use-plugins'
-import { useOAuthCallback } from '@/hooks/use-oauth'
 
 const ProviderList = () => {
   const { t } = useTranslation()
   const containerRef = useRef<HTMLDivElement>(null)
   const { enable_marketplace } = useAppContextSelector(s => s.systemFeatures)
-  useOAuthCallback()
 
   const searchParams = useSearchParams()
   const authCode = searchParams.get('code') || ''
diff --git a/web/app/oauth-callback/page.tsx b/web/app/oauth-callback/page.tsx
new file mode 100644
index 0000000000..38355f435e
--- /dev/null
+++ b/web/app/oauth-callback/page.tsx
@@ -0,0 +1,10 @@
+'use client'
+import { useOAuthCallback } from '@/hooks/use-oauth'
+
+const OAuthCallback = () => {
+  useOAuthCallback()
+
+  return <div />
+}
+
+export default OAuthCallback
diff --git a/web/hooks/use-oauth.ts b/web/hooks/use-oauth.ts
index c4402ff6eb..ae9c1cda66 100644
--- a/web/hooks/use-oauth.ts
+++ b/web/hooks/use-oauth.ts
@@ -1,26 +1,18 @@
 'use client'
 import { useEffect } from 'react'
-import { useSearchParams } from 'next/navigation'
 
 export const useOAuthCallback = () => {
-  const searchParams = useSearchParams()
-
   useEffect(() => {
-    const MCPProviderID = searchParams.get('mcp_provider_id')
-
-    if (MCPProviderID && window.opener) {
+    if (window.opener) {
       window.opener.postMessage({
         type: 'oauth_callback',
-        payload: {
-          state: MCPProviderID,
-        },
       }, '*')
       window.close()
     }
-  }, [searchParams])
+  }, [])
 }
 
-export const openOAuthPopup = (url: string, callback: (state: string) => void) => {
+export const openOAuthPopup = (url: string, callback: () => void) => {
   const width = 600
   const height = 600
   const left = window.screenX + (window.outerWidth - width) / 2
@@ -35,8 +27,7 @@ export const openOAuthPopup = (url: string, callback: (state: string) => void) =
   const handleMessage = (event: MessageEvent) => {
     if (event.data?.type === 'oauth_callback') {
       window.removeEventListener('message', handleMessage)
-      const { state } = event.data.payload
-      callback(state)
+      callback()
     }
   }