fix(mcp): clear OAuth tokens on server revival; clear popup intervals on unmount

- POST upsert: when reviving a soft-deleted server, drop any prior
  mcpServerOauth rows so stale tokens never silently carry over.
- mcp.tsx: track the popup-closed setInterval per server in a ref and
  clear it on component unmount to avoid leaked timers.
- client.ts: don't log OAuth-redirect/Unauthorized as connect errors;
  these are expected control flow during the auth bootstrap.
- Use toError() for error message extraction.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

Author: waleedlatif1

apps/sim/app/api/mcp/servers/route.ts

@@ -165,10 +165,16 @@ export const POST = withRouteHandler(
           }
           const oauthCredsChanged = clientIdChanged || clientSecretChanged
 
-          if (urlChanged || oauthCredsChanged) {
+          const isRevival = existingServer.deletedAt !== null
+          if (urlChanged || oauthCredsChanged || isRevival) {
             await db.delete(mcpServerOauth).where(eq(mcpServerOauth.mcpServerId, serverId))
+            const reason = isRevival
+              ? 'server revival'
+              : urlChanged
+                ? 'URL change'
+                : 'OAuth credential change'
             logger.info(
-              `[${requestId}] Cleared OAuth credentials for server ${serverId} due to ${urlChanged ? 'URL' : 'OAuth credential'} change`
+              `[${requestId}] Cleared OAuth credentials for server ${serverId} due to ${reason}`
             )
           }
 

apps/sim/app/workspace/[workspaceId]/settings/components/mcp/components/mcp-server-form-modal/mcp-server-form-modal.tsx

@@ -2,6 +2,7 @@
 
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
+import { toError } from '@sim/utils/errors'
 import { ChevronDown, ChevronRight } from 'lucide-react'
 import {
   Button,
@@ -556,8 +557,7 @@ export function McpServerFormModal({
 
       onOpenChange(false)
     } catch (error) {
-      const message = error instanceof Error ? error.message : 'Failed to save server'
-      setSubmitError(message)
+      setSubmitError(toError(error).message || 'Failed to save server')
       logger.error('Failed to save MCP server:', error)
     } finally {
       setIsSubmitting(false)
@@ -618,8 +618,7 @@ export function McpServerFormModal({
 
       onOpenChange(false)
     } catch (error) {
-      const message = error instanceof Error ? error.message : 'Failed to save server'
-      setSubmitError(message)
+      setSubmitError(toError(error).message || 'Failed to save server')
       logger.error('Failed to save MCP server from JSON:', error)
     } finally {
       setIsSubmitting(false)

apps/sim/app/workspace/[workspaceId]/settings/components/mcp/mcp.tsx

@@ -1,7 +1,8 @@
 'use client'
 
-import { useCallback, useEffect, useMemo, useState } from 'react'
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
+import { toError } from '@sim/utils/errors'
 import { useQueryClient } from '@tanstack/react-query'
 import { ChevronDown, Plus, Search } from 'lucide-react'
 import { useParams } from 'next/navigation'
@@ -177,6 +178,15 @@ export function MCP({ initialServerId }: MCPProps) {
   const [searchTerm, setSearchTerm] = useState('')
   const [deletingServers, setDeletingServers] = useState<Set<string>>(() => new Set())
   const [connectingOauthServers, setConnectingOauthServers] = useState<Set<string>>(() => new Set())
+  const oauthPopupIntervalsRef = useRef<Map<string, number>>(new Map())
+
+  useEffect(() => {
+    const intervals = oauthPopupIntervalsRef.current
+    return () => {
+      for (const id of intervals.values()) window.clearInterval(id)
+      intervals.clear()
+    }
+  }, [])
 
   const [showDeleteDialog, setShowDeleteDialog] = useState(false)
   const [serverToDelete, setServerToDelete] = useState<{ id: string; name: string } | null>(null)
@@ -218,12 +228,18 @@ export function MCP({ initialServerId }: MCPProps) {
   const startOauthForServer = useCallback(
     async (serverId: string) => {
       setConnectingOauthServers((prev) => new Set(prev).add(serverId))
-      const clear = () =>
+      const clear = () => {
+        const existing = oauthPopupIntervalsRef.current.get(serverId)
+        if (existing !== undefined) {
+          window.clearInterval(existing)
+          oauthPopupIntervalsRef.current.delete(serverId)
+        }
         setConnectingOauthServers((prev) => {
           const next = new Set(prev)
           next.delete(serverId)
           return next
         })
+      }
       try {
         const result = await startOauthMutation.mutateAsync({ serverId, workspaceId })
         if (result.status === 'already_authorized') {
@@ -232,15 +248,13 @@ export function MCP({ initialServerId }: MCPProps) {
         }
         const { popup } = result
         const interval = window.setInterval(() => {
-          if (popup.closed) {
-            window.clearInterval(interval)
-            clear()
-          }
+          if (popup.closed) clear()
         }, 500)
+        oauthPopupIntervalsRef.current.set(serverId, interval)
       } catch (e) {
         clear()
         logger.error('Failed to start MCP OAuth', e)
-        toast.error(e instanceof Error ? e.message : 'Failed to start authorization')
+        toast.error(toError(e).message || 'Failed to start authorization')
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps -- mutateAsync is stable

apps/sim/lib/mcp/client.ts

@@ -17,6 +17,7 @@ import {
   ToolListChangedNotificationSchema,
 } from '@modelcontextprotocol/sdk/types.js'
 import { createLogger } from '@sim/logger'
+import { toError } from '@sim/utils/errors'
 import { getMaxExecutionTimeout } from '@/lib/core/execution-limits'
 import { McpOauthRedirectRequired } from '@/lib/mcp/oauth'
 import {
@@ -139,13 +140,14 @@ export class McpClient {
         protocolVersion: serverVersion,
       })
     } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : 'Unknown error'
-      this.connectionStatus.lastError = errorMessage
       this.isConnected = false
-      logger.error(`Failed to connect to MCP server ${this.config.name}:`, error)
       if (error instanceof McpOauthRedirectRequired || error instanceof UnauthorizedError) {
+        this.connectionStatus.lastError = undefined
         throw error
       }
+      const errorMessage = toError(error).message
+      this.connectionStatus.lastError = errorMessage
+      logger.error(`Failed to connect to MCP server ${this.config.name}:`, error)
       throw new McpConnectionError(errorMessage, this.config.name)
     }
   }