fix(mcp): make OAuth probe work via JSON add modal and preserve HTTP status

Two changes that together let spec-compliant OAuth servers (Semrush,
Linear, Notion, Atlassian) connect via either modal path:

1. client.ts: when the SDK throws StreamableHTTPError, prefix the
   wrapped error message with `HTTP <code>:` so the status code survives
   McpConnectionError wrapping. Without this the 401 status is invisible
   downstream — the message read just "Streamable HTTP error: Error
   POSTing to endpoint:" with no body for empty 401s.

2. form modal: extract isAuthRequiredError helper and apply it to BOTH
   handleSubmitForm AND handleSubmitJson. Previously only the form path
   swallowed auth-shaped test-connection failures and proceeded to the
   create flow (where the probe runs and the OAuth dance starts). The
   JSON path treated any failure as fatal, blocking Semrush et al.

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

Author: waleedlatif1

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

@@ -67,6 +67,22 @@ export interface McpServerFormModalProps {
 
 const ENV_VAR_PATTERN = /\{\{[^}]+\}\}/
 
+/**
+ * Treats a failed test-connection as a soft failure when the response looks like
+ * an OAuth/auth challenge — the create flow can then run the probe and kick off
+ * the OAuth handshake. Without this, OAuth-protected servers like Semrush get
+ * rejected at the modal before the probe ever runs.
+ */
+function isAuthRequiredError(errorMessage: string | undefined): boolean {
+  const text = (errorMessage || '').toLowerCase()
+  return (
+    /\b401\b/.test(text) ||
+    text.includes('unauthorized') ||
+    text.includes('oauth') ||
+    text.includes('authentication')
+  )
+}
+
 function hasEnvVarInHostname(url: string): boolean {
   const globalPattern = new RegExp(ENV_VAR_PATTERN.source, 'g')
   if (url.trim().replace(globalPattern, '').trim() === '') return true
@@ -517,19 +533,11 @@ export function McpServerFormModal({
         workspaceId,
       })
 
-      if (!connectionResult.success) {
-        const errorText = (connectionResult.error || '').toLowerCase()
-        const looksLikeAuthRequired =
-          /\b401\b/.test(errorText) ||
-          errorText.includes('unauthorized') ||
-          errorText.includes('oauth') ||
-          errorText.includes('authentication')
-        if (!looksLikeAuthRequired) {
-          setSubmitError(
-            connectionResult.error || 'Connection test failed. Please check the URL and try again.'
-          )
-          return
-        }
+      if (!connectionResult.success && !isAuthRequiredError(connectionResult.error)) {
+        setSubmitError(
+          connectionResult.error || 'Connection test failed. Please check the URL and try again.'
+        )
+        return
       }
 
       await onSubmit({
@@ -587,7 +595,7 @@ export function McpServerFormModal({
         workspaceId,
       })
 
-      if (!connectionResult.success) {
+      if (!connectionResult.success && !isAuthRequiredError(connectionResult.error)) {
         setSubmitError(
           connectionResult.error || 'Connection test failed. Please check the URL and try again.'
         )

apps/sim/lib/mcp/client.ts

@@ -10,7 +10,10 @@
 
 import { UnauthorizedError } from '@modelcontextprotocol/sdk/client/auth.js'
 import { Client } from '@modelcontextprotocol/sdk/client/index.js'
-import { StreamableHTTPClientTransport } from '@modelcontextprotocol/sdk/client/streamableHttp.js'
+import {
+  StreamableHTTPClientTransport,
+  StreamableHTTPError,
+} from '@modelcontextprotocol/sdk/client/streamableHttp.js'
 import {
   type ListToolsResult,
   type Tool,
@@ -127,7 +130,11 @@ export class McpClient {
         this.connectionStatus.lastError = undefined
         throw error
       }
-      const errorMessage = getErrorMessage(error, 'Unknown error')
+      const rawMessage = getErrorMessage(error, 'Unknown error')
+      const errorMessage =
+        error instanceof StreamableHTTPError && typeof error.code === 'number'
+          ? `HTTP ${error.code}: ${rawMessage}`
+          : rawMessage
       this.connectionStatus.lastError = errorMessage
       logger.error(`Failed to connect to MCP server ${this.config.name}:`, error)
       throw new McpConnectionError(errorMessage, this.config.name)