fix(mship): return the chat connect to its own tab, on main's credential UI

Reverts #6403 and #6385 to restore the credential UI users had on main —
individual inline chips, no combined card — and re-adds only the part that was
worth keeping: the connect no longer strands you on a second copy of the chat.

The chip opens the flow in a popup whose return leg is rewritten to a
self-closing completion page, so this tab is never navigated. A refused popup
falls through to the anchor pointed at the same URL, so that tab still closes
itself rather than loading the app again.

Nothing tracks per-chip attempt state, which is what the reverted work needed
to drive the card's connected/pending labels. Main's chip is stateless, so the
ledger, the status hook, the popup watcher and its deadlines all go with it —
along with the races they kept producing.

Keeps oauth/chat-complete out of the strict COOP rule: same-origin would disown
the popup from its opener the moment it loads, leaving it not reliably
script-closable, which is the one thing the page exists to do.

Author: waleedlatif1

apps/sim/app/oauth/chat-complete/chat-complete-handoff.tsx

@@ -0,0 +1,48 @@
+'use client'
+
+import { useEffect } from 'react'
+import { OAUTH_POPUP_RETURN_TO_PARAM } from '@/lib/credentials/oauth-popup-return'
+
+const CLOSE_FALLBACK_DELAY_MS = 400
+
+/**
+ * The fallback redirect must never leave this origin — the target rides in a
+ * query param the user could have tampered with.
+ */
+function sanitizeReturnTo(raw: string | null): string | null {
+  if (!raw) return null
+  try {
+    const url = new URL(raw, window.location.origin)
+    return url.origin === window.location.origin ? url.toString() : null
+  } catch {
+    return null
+  }
+}
+
+/**
+ * Behavior half of the chat OAuth return leg: closes the window it runs in.
+ * Renders nothing, so the page's frame paints as server markup before this
+ * hydrates.
+ *
+ * The credential has already landed server-side by the time this runs — the
+ * page exists only so the flow stops somewhere disposable instead of loading a
+ * second copy of the app over the tab the user started from.
+ *
+ * A window the browser refuses to close redirects on to where the flow began.
+ * That is the popup-blocked path: the anchor's `target='_blank'` opens this leg
+ * in a new tab, which no script may close.
+ */
+export function ChatCompleteHandoff() {
+  useEffect(() => {
+    const returnTo = sanitizeReturnTo(
+      new URL(window.location.href).searchParams.get(OAUTH_POPUP_RETURN_TO_PARAM)
+    )
+    window.close()
+    const timer = window.setTimeout(() => {
+      window.location.replace(returnTo ?? '/workspace')
+    }, CLOSE_FALLBACK_DELAY_MS)
+    return () => window.clearTimeout(timer)
+  }, [])
+
+  return null
+}

apps/sim/app/oauth/chat-complete/page.tsx

@@ -0,0 +1,27 @@
+import type { Metadata } from 'next'
+import { DesktopHandoffShell } from '@/app/desktop/components/desktop-handoff-shell'
+import { ChatCompleteHandoff } from '@/app/oauth/chat-complete/chat-complete-handoff'
+
+export const metadata: Metadata = {
+  title: 'Returning to Sim',
+  robots: { index: false },
+}
+
+/**
+ * Post-OAuth return leg for the chat credential chips. The chip rewrites the
+ * authorize URL's return param to land here, so the OAuth window finishes on
+ * this page — which closes itself — instead of loading a second copy of the app
+ * over the chat the user started from.
+ *
+ * Visible for a few hundred milliseconds in a popup, or briefly in a tab when
+ * the popup was blocked, so it wears the same handoff frame as the other
+ * minimal-chrome gates rather than styling of its own.
+ */
+export default function ChatCompletePage() {
+  return (
+    <>
+      <ChatCompleteHandoff />
+      <DesktopHandoffShell title='Finishing the connection' description='Returning you to Sim.' />
+    </>
+  )
+}

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/special-tags/special-tags.test.tsx

@@ -1,5 +1,6 @@
 /**
  * @vitest-environment jsdom
+ * @vitest-environment-options { "url": "https://sim.test/workspace/workspace-1/chat/chat-1" }
  */
 import { act } from 'react'
 import { createRoot, type Root } from 'react-dom/client'
@@ -86,6 +87,77 @@ describe('CredentialDisplay link tag', () => {
     act(() => root.unmount())
   })
 
+  it('runs the connect in a popup so the chat tab is never navigated', () => {
+    const popup = { focus: vi.fn() }
+    const openSpy = vi
+      .spyOn(window, 'open')
+      .mockReturnValue(popup as unknown as ReturnType<typeof window.open>)
+    const { container, root } = renderCredentialLink({
+      type: 'link',
+      provider: 'google-email',
+      value:
+        'https://sim.test/api/auth/oauth2/authorize?providerId=google-email&callbackURL=https%3A%2F%2Fsim.test%2Fworkspace%2Fworkspace-1%2Fchat%2Fchat-1',
+    })
+
+    const link = container.querySelector('a')
+    const defaultPrevented = !link?.dispatchEvent(
+      new MouseEvent('click', { bubbles: true, cancelable: true })
+    )
+
+    expect(defaultPrevented).toBe(true)
+    expect(popup.focus).toHaveBeenCalledOnce()
+    const callbackUrl = new URL(
+      new URL(openSpy.mock.calls[0][0] as string).searchParams.get('callbackURL') ?? ''
+    )
+    expect(callbackUrl.pathname).toBe('/oauth/chat-complete')
+    openSpy.mockRestore()
+    act(() => root.unmount())
+  })
+
+  it('falls back to the anchor, still via the completion page, when the popup is blocked', () => {
+    const openSpy = vi.spyOn(window, 'open').mockReturnValue(null)
+    const { container, root } = renderCredentialLink({
+      type: 'link',
+      provider: 'google-email',
+      value:
+        'https://sim.test/api/auth/oauth2/authorize?providerId=google-email&callbackURL=https%3A%2F%2Fsim.test%2Fworkspace%2Fworkspace-1%2Fchat%2Fchat-1',
+    })
+
+    const link = container.querySelector('a')
+    const defaultPrevented = !link?.dispatchEvent(
+      new MouseEvent('click', { bubbles: true, cancelable: true })
+    )
+
+    // The tab still opens, but on a page that closes itself instead of a second
+    // copy of the chat.
+    expect(defaultPrevented).toBe(false)
+    const callbackUrl = new URL(
+      new URL(link?.getAttribute('href') ?? '').searchParams.get('callbackURL') ?? ''
+    )
+    expect(callbackUrl.pathname).toBe('/oauth/chat-complete')
+    openSpy.mockRestore()
+    act(() => root.unmount())
+  })
+
+  it('keeps a cross-origin connect URL on the anchor instead of a popup', () => {
+    const openSpy = vi.spyOn(window, 'open')
+    const { container, root } = renderCredentialLink({
+      type: 'link',
+      provider: 'google-email',
+      value:
+        'https://evil.example/api/auth/oauth2/authorize?callbackURL=https%3A%2F%2Fevil.example',
+    })
+
+    const link = container.querySelector('a')
+    link?.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+
+    // The anchor carries rel='noopener noreferrer'; window.open would not.
+    expect(openSpy).not.toHaveBeenCalled()
+    expect(link?.getAttribute('rel')).toBe('noopener noreferrer')
+    openSpy.mockRestore()
+    act(() => root.unmount())
+  })
+
   it('renders nothing when the user cannot edit, regardless of URL safety', () => {
     mockUseUserPermissionsContext.mockReturnValue({ canEdit: false })
     const { container, root } = renderCredentialLink({

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/special-tags/special-tags.tsx

@@ -23,6 +23,11 @@ import { canManageWorkspaceBilling } from '@/lib/billing/workspace-permissions'
 import { isBrowserAgentAvailable, sendBrowserPanelAction } from '@/lib/browser-agent/transport'
 import { isHosted } from '@/lib/core/config/env-flags'
 import { isSafeHttpUrl } from '@/lib/core/utils/urls'
+import {
+  buildOAuthPopupAuthorizeUrl,
+  OAUTH_POPUP_FEATURES,
+  OAUTH_POPUP_WINDOW_NAME,
+} from '@/lib/credentials/oauth-popup-return'
 import { getDesktopBridge } from '@/lib/desktop'
 import { desktopChatScopeId } from '@/lib/desktop/chat-scope'
 import {
@@ -1869,16 +1874,33 @@ function CredentialLinkDisplay({ data }: { data: CredentialTagData }) {
    * completion returns through the app's loopback and refreshes credentials.
    */
   const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {
+    if (!data.value) return
     const bridge = getDesktopBridge()
-    if (!bridge?.beginOAuthConnect || !data.value) return
+    if (bridge?.beginOAuthConnect) {
+      event.preventDefault()
+      const url = new URL(data.value)
+      const providerId = url.searchParams.get('providerId') ?? data.provider
+      if (!providerId) return
+      void bridge.beginOAuthConnect(providerId, {
+        workspaceId: url.searchParams.get('workspaceId') ?? undefined,
+        credentialId: url.searchParams.get('credentialId') ?? undefined,
+      })
+      return
+    }
+
+    // Web: run the flow in a popup routed through the self-closing completion
+    // page, so this tab is never navigated and the user does not end up on a
+    // second copy of the chat they started from. A refused popup falls through
+    // to the anchor, pointed at the same URL so that tab still closes itself.
+    const popupUrl = buildOAuthPopupAuthorizeUrl(data.value)
+    if (!popupUrl) return
+    const popup = window.open(popupUrl, OAUTH_POPUP_WINDOW_NAME, OAUTH_POPUP_FEATURES)
+    if (!popup) {
+      event.currentTarget.href = popupUrl
+      return
+    }
     event.preventDefault()
-    const url = new URL(data.value)
-    const providerId = url.searchParams.get('providerId') ?? data.provider
-    if (!providerId) return
-    void bridge.beginOAuthConnect(providerId, {
-      workspaceId: url.searchParams.get('workspaceId') ?? undefined,
-      credentialId: url.searchParams.get('credentialId') ?? undefined,
-    })
+    popup.focus?.()
   }
 
   return (

apps/sim/lib/credentials/oauth-popup-return.test.ts

@@ -0,0 +1,58 @@
+/**
+ * @vitest-environment jsdom
+ * @vitest-environment-options { "url": "https://sim.test/workspace/workspace-1/chat/chat-1" }
+ */
+import { describe, expect, it } from 'vitest'
+import {
+  buildOAuthPopupAuthorizeUrl,
+  OAUTH_POPUP_COMPLETE_PATH,
+  OAUTH_POPUP_RETURN_TO_PARAM,
+} from '@/lib/credentials/oauth-popup-return'
+
+describe('buildOAuthPopupAuthorizeUrl', () => {
+  it('routes the return through the completion page and keeps the original destination', () => {
+    const result = buildOAuthPopupAuthorizeUrl(
+      'https://sim.test/api/auth/oauth2/authorize?providerId=google-email&callbackURL=https%3A%2F%2Fsim.test%2Fworkspace%2Fworkspace-1%2Fchat%2Fchat-1'
+    )
+
+    const callbackUrl = new URL(new URL(result as string).searchParams.get('callbackURL') ?? '')
+    expect(callbackUrl.pathname).toBe(OAUTH_POPUP_COMPLETE_PATH)
+    expect(callbackUrl.searchParams.get(OAUTH_POPUP_RETURN_TO_PARAM)).toBe(
+      'https://sim.test/workspace/workspace-1/chat/chat-1'
+    )
+  })
+
+  it('rewrites returnUrl for the custom-provider authorize routes', () => {
+    const result = buildOAuthPopupAuthorizeUrl(
+      'https://sim.test/api/auth/trello/authorize?returnUrl=https%3A%2F%2Fsim.test%2Fworkspace%2Fws-1%2Fchat%2Fc-1'
+    )
+
+    const returnUrl = new URL(new URL(result as string).searchParams.get('returnUrl') ?? '')
+    expect(returnUrl.pathname).toBe(OAUTH_POPUP_COMPLETE_PATH)
+  })
+
+  it('anchors the completion page on the server-generated return origin, not this tab', () => {
+    // The authorize route accepts a return target only when it matches the
+    // deployment's configured base URL, which a proxied origin need not equal.
+    const result = buildOAuthPopupAuthorizeUrl(
+      'https://sim.test/api/auth/oauth2/authorize?providerId=slack&callbackURL=https%3A%2F%2Fapp.sim.test%2Fworkspace%2Fws-1'
+    )
+
+    const callbackUrl = new URL(new URL(result as string).searchParams.get('callbackURL') ?? '')
+    expect(callbackUrl.origin).toBe('https://app.sim.test')
+  })
+
+  it('refuses a cross-origin authorize URL so the caller keeps its noopener anchor', () => {
+    expect(
+      buildOAuthPopupAuthorizeUrl(
+        'https://evil.example/api/auth/oauth2/authorize?callbackURL=https%3A%2F%2Fevil.example%2Fsink'
+      )
+    ).toBeNull()
+  })
+
+  it('refuses an authorize URL with no return param to rewrite', () => {
+    expect(
+      buildOAuthPopupAuthorizeUrl('https://sim.test/api/auth/oauth2/authorize?providerId=github')
+    ).toBeNull()
+  })
+})

apps/sim/lib/credentials/oauth-popup-return.ts

@@ -0,0 +1,56 @@
+/**
+ * Routes a chat OAuth flow's return leg through the self-closing completion
+ * page, so a connect started from chat comes back to the tab that started it
+ * instead of leaving a second copy of the app open behind the provider.
+ */
+
+export const OAUTH_POPUP_COMPLETE_PATH = '/oauth/chat-complete'
+export const OAUTH_POPUP_RETURN_TO_PARAM = 'returnTo'
+
+/** Matches the MCP OAuth popup (`hooks/mcp/use-mcp-oauth-popup.ts`) so the two consent windows open alike. */
+export const OAUTH_POPUP_FEATURES = 'width=560,height=720,resizable=yes,scrollbars=yes'
+
+/**
+ * Shared across chips on purpose: a second connect reuses (and refocuses) the
+ * one window rather than leaving an abandoned consent screen behind. Nothing
+ * here tracks a per-chip attempt, so there is no result for a reused window to
+ * strand.
+ */
+export const OAUTH_POPUP_WINDOW_NAME = 'sim-oauth-connect'
+
+/**
+ * Rewrites an authorize URL so its eventual return lands on the completion
+ * page, carrying the original destination for the case where the window cannot
+ * close itself.
+ *
+ * Returns null when the flow must stay on the plain anchor: a cross-origin
+ * authorize URL (the value is streamed model output, checked only for a safe
+ * protocol) would otherwise take the popup path, dropping the anchor's
+ * `rel="noopener"` and handing a foreign page our window handle. An authorize
+ * URL with no return param to rewrite has nowhere to put the completion page.
+ */
+export function buildOAuthPopupAuthorizeUrl(rawUrl: string): string | null {
+  let authorizeUrl: URL
+  try {
+    authorizeUrl = new URL(rawUrl, window.location.origin)
+  } catch {
+    return null
+  }
+  if (authorizeUrl.origin !== window.location.origin) return null
+
+  const returnParam = authorizeUrl.searchParams.has('callbackURL') ? 'callbackURL' : 'returnUrl'
+  const rawReturnUrl = authorizeUrl.searchParams.get(returnParam)
+  if (!rawReturnUrl) return null
+
+  // Anchored on the return URL the server generated rather than this tab's
+  // origin: both the authorize route and the custom-provider callbacks accept a
+  // return target only when it matches the deployment's configured base URL,
+  // which a proxied or aliased origin need not equal.
+  const completeUrl = new URL(
+    OAUTH_POPUP_COMPLETE_PATH,
+    new URL(rawReturnUrl, window.location.origin).origin
+  )
+  completeUrl.searchParams.set(OAUTH_POPUP_RETURN_TO_PARAM, rawReturnUrl)
+  authorizeUrl.searchParams.set(returnParam, completeUrl.toString())
+  return authorizeUrl.toString()
+}

apps/sim/next.config.ts

@@ -318,8 +318,12 @@ const nextConfig: NextConfig = {
       },
       {
         // Exclude Vercel internal resources and static assets from strict COOP, Google Drive Picker
-        // and the /demo Cal.com booking embed to prevent 'refused to connect' / slow-load issues
-        source: '/((?!_next|_vercel|api|favicon.ico|w/.*|workspace/.*|api/tools/drive|demo).*)',
+        // and the /demo Cal.com booking embed to prevent 'refused to connect' / slow-load issues.
+        // `oauth/chat-complete` runs *as* a popup: `same-origin` moves a document into its own
+        // browsing-context group, disowning it from the opener that launched it the moment it
+        // loads — which leaves it not reliably script-closable, the one thing it exists to do.
+        source:
+          '/((?!_next|_vercel|api|favicon.ico|w/.*|workspace/.*|api/tools/drive|demo|oauth/chat-complete).*)',
         headers: [
           {
             key: 'Cross-Origin-Opener-Policy',
@@ -342,8 +346,11 @@ const nextConfig: NextConfig = {
         ],
       },
       {
-        // For main app routes, Google Drive Picker, the /demo Cal.com embed, and Vercel resources - use permissive policies
-        source: '/(w/.*|workspace/.*|api/tools/drive|demo.*|_next/.*|_vercel/.*)',
+        // For main app routes, Google Drive Picker, the /demo Cal.com embed, the chat OAuth popup
+        // return leg, and Vercel resources - use permissive policies. The return leg matches its
+        // opener's value so the two stay in one browsing-context group.
+        source:
+          '/(w/.*|workspace/.*|api/tools/drive|demo.*|oauth/chat-complete|_next/.*|_vercel/.*)',
         headers: [
           {
             key: 'Cross-Origin-Embedder-Policy',