fix(mship): settle the connect row from the popup, not from focus alone

Addresses the review findings on the chat OAuth return leg.

- Watch the popup on an interval. A provider interstitial bouncing to the
  workspace root, a denied consent on /oauth-error, or a closed window all end
  the flow without publishing a verdict or firing any event in this tab, so the
  row waited forever. The focus handler also no longer consumes the away flag
  when it defers to a live popup.
- Focus an already-running popup on a repeat click instead of starting a rival
  attempt, which orphaned the first flow's verdict on an attempt id the row had
  stopped reading.
- Settle from the refetched credentials on the popup success path, so the row's
  lock is corroborated and a connected row stops being clickable.

Extracts the shared refetch-then-decide step into settleFromCredentials, used
by the focus handler, the popup watcher, and the success path.

Author: waleedlatif1

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

@@ -505,6 +505,133 @@ describe('CredentialDisplay link tag', () => {
     act(() => root.unmount())
   })
 
+  it('settles the row from the popup watcher when the flow ends with no event in this tab', async () => {
+    // A provider interstitial (Trello parks on one for ~3s) bounces to the
+    // workspace root without ever reaching the completion page. Neither page
+    // publishes a verdict, and a user who never leaves this tab gets no focus
+    // event either — only the watcher can end the wait.
+    vi.useFakeTimers()
+    const popup = {
+      focus: vi.fn(),
+      closed: false,
+      location: { origin: 'https://sim.test', pathname: '/api/auth/trello/callback' },
+    }
+    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',
+    })
+
+    await act(async () => {
+      container
+        .querySelector('a')
+        ?.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(2000)
+    })
+
+    // The interstitial is not terminal, so the row is still deferring.
+    expect(container.textContent).toContain('Waiting for Gmail connection')
+
+    popup.location.pathname = '/workspace'
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(2000)
+    })
+
+    expect(container.textContent).toContain('Not connected — connect Gmail')
+    vi.useRealTimers()
+    openSpy.mockRestore()
+    act(() => root.unmount())
+  })
+
+  it('focuses the live popup instead of starting a rival attempt on a repeat click', async () => {
+    const toastSuccess = vi.spyOn(toast, 'success').mockImplementation(() => '')
+    const popup = {
+      focus: vi.fn(),
+      closed: false,
+      // Still on the provider's pages: reading location across origins throws.
+      get location(): Location {
+        throw new DOMException('cross-origin', 'SecurityError')
+      },
+    }
+    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')
+
+    await act(async () => {
+      link?.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+    const attemptId = new URL(
+      new URL(openSpy.mock.calls[0][0] as string).searchParams.get('callbackURL') ?? ''
+    ).searchParams.get('oauthAttempt') as string
+    await act(async () => {
+      link?.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+
+    // No second window, and no second attempt to strand the first one's verdict.
+    expect(openSpy).toHaveBeenCalledOnce()
+    expect(popup.focus).toHaveBeenCalledTimes(2)
+
+    await act(async () => {
+      setOAuthChatAttemptStatus(attemptId, 'connected')
+    })
+
+    expect(container.textContent).toContain('Connected Gmail')
+    openSpy.mockRestore()
+    toastSuccess.mockRestore()
+    act(() => root.unmount())
+  })
+
+  it('locks the row once the popup verdict is corroborated by a refetched credential', async () => {
+    const toastSuccess = vi.spyOn(toast, 'success').mockImplementation(() => '')
+    const popup = { focus: vi.fn(), closed: false }
+    const openSpy = vi
+      .spyOn(window, 'open')
+      .mockReturnValue(popup as unknown as ReturnType<typeof window.open>)
+    mockRefetchWorkspaceCredentials.mockResolvedValue({
+      data: [{ id: 'new-gmail', providerId: 'google', updatedAt: '2026-08-07T10:05:00Z' }],
+    })
+    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',
+    })
+
+    await act(async () => {
+      container
+        .querySelector('a')
+        ?.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+    const attemptId = new URL(
+      new URL(openSpy.mock.calls[0][0] as string).searchParams.get('callbackURL') ?? ''
+    ).searchParams.get('oauthAttempt') as string
+    await act(async () => {
+      setOAuthChatAttemptStatus(attemptId, 'connected')
+    })
+
+    // The popup flow never blurs this tab, so this refetch is the only one that
+    // can corroborate the verdict and let the control lock.
+    expect(mockRefetchWorkspaceCredentials).toHaveBeenCalled()
+    expect(container.textContent).toContain('Connected Gmail')
+    expect(container.querySelector('a')?.getAttribute('aria-disabled')).toBe('true')
+    openSpy.mockRestore()
+    toastSuccess.mockRestore()
+    act(() => root.unmount())
+  })
+
   it('navigates the tab through the same completion page when the popup is blocked', () => {
     const openSpy = vi.spyOn(window, 'open').mockReturnValue(null)
     const { container, root } = renderCredentialLink({
@@ -816,6 +943,76 @@ describe('CredentialDisplay link tag', () => {
     expect(container.querySelector('input')).toBeNull()
     act(() => root.unmount())
   })
+
+  it('keeps a typed secret while a sibling row runs its OAuth connect', async () => {
+    // The card's secret drafts live in component state until its Submit, so a
+    // connect that navigates this tab away discards whatever the user already
+    // typed into a sibling row. Running the flow in a popup is what makes the
+    // mixed card safe: this tab is never unloaded, so the draft outlives the
+    // connect — including the re-render its verdict and refetch trigger.
+    const toastSuccess = vi.spyOn(toast, 'success').mockImplementation(() => '')
+    const popup = { focus: vi.fn(), closed: false }
+    const openSpy = vi
+      .spyOn(window, 'open')
+      .mockReturnValue(popup as unknown as ReturnType<typeof window.open>)
+    const container = document.createElement('div')
+    const root: Root = createRoot(container)
+    const onOptionSelect = vi.fn()
+    const data: CredentialItemData[] = [
+      {
+        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',
+      },
+      { type: 'secret_input', name: 'OPENAI_API_KEY' },
+    ]
+    act(() => {
+      root.render(
+        <SpecialTags segment={{ type: 'credential', data }} onOptionSelect={onOptionSelect} />
+      )
+    })
+
+    const secretInput = container.querySelector('input')
+    act(() => {
+      if (!secretInput) return
+      const valueSetter = Object.getOwnPropertyDescriptor(
+        window.HTMLInputElement.prototype,
+        'value'
+      )?.set
+      valueSetter?.call(secretInput, 'sk-test-key')
+      secretInput.dispatchEvent(new Event('input', { bubbles: true }))
+    })
+
+    await act(async () => {
+      container
+        .querySelector('a')
+        ?.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+    })
+    const attemptId = new URL(
+      new URL(openSpy.mock.calls[0][0] as string).searchParams.get('callbackURL') ?? ''
+    ).searchParams.get('oauthAttempt') as string
+    await act(async () => {
+      setOAuthChatAttemptStatus(attemptId, 'connected')
+    })
+
+    // The field masks while unfocused, so assert on what the draft is actually
+    // for: submitting it. A mask of the right length is not proof it survived.
+    const submitButton = Array.from(container.querySelectorAll('button')).find(
+      (button) => button.textContent === 'Submit'
+    )
+    await act(async () => {
+      submitButton?.click()
+    })
+
+    expect(mockUpsertWorkspaceEnvironment).toHaveBeenCalledWith({
+      workspaceId: 'workspace-1',
+      variables: { OPENAI_API_KEY: 'sk-test-key' },
+    })
+    openSpy.mockRestore()
+    toastSuccess.mockRestore()
+    act(() => root.unmount())
+  })
 })
 
 describe('parseSpecialTags sim_key placeholder', () => {

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/special-tags/use-oauth-chip-connection.ts

@@ -28,6 +28,12 @@ import { useWorkspaceCredentials } from '@/hooks/queries/credentials'
 const OAUTH_POPUP_WINDOW_NAME = 'sim-oauth-connect'
 /** Matches the MCP OAuth popup (`hooks/mcp/use-mcp-oauth-popup.ts`) so the two consent windows open alike. */
 const OAUTH_POPUP_FEATURES = 'width=560,height=720,resizable=yes,scrollbars=yes'
+/**
+ * How often to re-examine a live popup. Matches the MCP OAuth popup's own
+ * watcher: a closed or terminal window fires no event in the opener, so
+ * polling the handle is the only way to observe it.
+ */
+const OAUTH_POPUP_POLL_INTERVAL_MS = 400
 
 /**
  * Same-origin pages an OAuth flow can die on without ever reaching the return
@@ -266,6 +272,44 @@ export function useOAuthChipConnection({
     })
   }, [activeAttemptId, controlId, providerId, reconnectCredentialId, workspaceId])
 
+  /**
+   * Refetches the workspace credentials and settles this row's pending attempt
+   * against them. Shared by the two endings the completion page cannot cover: a
+   * return to this tab, and a popup seen closed or parked on a terminal page.
+   * Idempotent — an attempt is only rewritten while still `pending`.
+   */
+  const settleFromCredentials = useCallback(async () => {
+    const result = await refetchWorkspaceOAuthCredentials()
+    const credentials = result.data ?? []
+
+    // Also covers a credential connected from another tab, which this row never
+    // launched and query state alone would surface only on its next fetch.
+    const storedBaseline = workspaceCredentialBaselineRef.current
+    if (!reconnectCredentialId && storedBaseline?.scope === credentialScope) {
+      setConnectedFromWorkspaceChange(
+        hasOAuthCredentialChanged({ ...credentialTarget, ...storedBaseline.baseline }, credentials)
+      )
+    }
+
+    // Read after the await: a snapshot taken before it goes stale the moment the
+    // popup publishes its verdict mid-refetch, and that stale 'pending' would
+    // license the very overwrite the guard below exists to prevent.
+    const attempt = readRowAttempt()
+    if (!attempt || attempt.status !== 'pending') return
+    // Only the callback path can prove a reconnect returned — an unrelated edit
+    // to the credential is indistinguishable from one here.
+    const attemptConnected = reconnectCredentialId
+      ? false
+      : hasOAuthCredentialChanged(attempt, credentials)
+    setOAuthChatAttemptStatus(attempt.id, attemptConnected ? 'connected' : 'failed')
+  }, [
+    credentialScope,
+    credentialTarget,
+    readRowAttempt,
+    reconnectCredentialId,
+    refetchWorkspaceOAuthCredentials,
+  ])
+
   useEffect(() => {
     const syncStatus = () => setConnectionStatus(readRowAttempt()?.status ?? null)
     window.addEventListener(OAUTH_CHAT_ATTEMPT_EVENT, syncStatus)
@@ -281,47 +325,19 @@ export function useOAuthChipConnection({
     const markAway = () => {
       oauthWindowWasAwayRef.current = true
     }
-    const verifyAfterReturn = async () => {
+    const verifyAfterReturn = () => {
       if (!oauthWindowWasAwayRef.current || document.visibilityState !== 'visible') return
-      oauthWindowWasAwayRef.current = false
-      const result = await refetchWorkspaceOAuthCredentials()
-      const credentials = result.data ?? []
-
-      // Refetching on every return closes the other-tab gap even when this row
-      // did not launch the connection. Query state normally drives the effect
-      // above; updating here as well makes the result immediate and deterministic.
-      const storedBaseline = workspaceCredentialBaselineRef.current
-      if (!reconnectCredentialId && storedBaseline?.scope === credentialScope) {
-        setConnectedFromWorkspaceChange(
-          hasOAuthCredentialChanged(
-            { ...credentialTarget, ...storedBaseline.baseline },
-            credentials
-          )
-        )
-      }
-
-      // Read the attempt only after the await. A snapshot taken before it goes
-      // stale the moment the popup publishes its verdict mid-refetch, and the
-      // stale 'pending' would license the overwrite this check exists to stop —
-      // deterministically to 'failed' on the reconnect branch below.
-      const attempt = readRowAttempt()
-      if (!attempt || attempt.status !== 'pending') return
-      // Clicking back to this tab while the popup is still on the provider's
-      // consent screen is not a verdict — the flow it owns has not returned
-      // yet, and settling here would flash "not connected" under a connect the
-      // user is midway through. Its own return leg publishes the result.
+      // A live popup still owns the flow; settling now would flash "not
+      // connected" mid-connect. The away flag deliberately survives this bail —
+      // consuming it would spend the only signal a later return has to work
+      // with, and no second focus event is guaranteed to arrive.
       if (isPopupStillOpen(popupRef.current)) return
-      // A reconnect is verified by the callback path, which has proof that the
-      // OAuth flow returned. A plain focus event cannot distinguish it from an
-      // unrelated edit to the same credential.
-      const attemptConnected = reconnectCredentialId
-        ? false
-        : hasOAuthCredentialChanged(attempt, credentials)
-      setOAuthChatAttemptStatus(attempt.id, attemptConnected ? 'connected' : 'failed')
+      oauthWindowWasAwayRef.current = false
+      void settleFromCredentials()
     }
     const handleVisibilityChange = () => {
       if (document.visibilityState === 'hidden') markAway()
-      else void verifyAfterReturn()
+      else verifyAfterReturn()
     }
 
     window.addEventListener('blur', markAway)
@@ -332,13 +348,24 @@ export function useOAuthChipConnection({
       window.removeEventListener('focus', verifyAfterReturn)
       document.removeEventListener('visibilitychange', handleVisibilityChange)
     }
-  }, [
-    credentialScope,
-    credentialTarget,
-    readRowAttempt,
-    reconnectCredentialId,
-    refetchWorkspaceOAuthCredentials,
-  ])
+  }, [settleFromCredentials])
+
+  /**
+   * Watches a live popup for the endings that publish no verdict — a provider
+   * interstitial exiting to the workspace root, a denied consent landing on the
+   * OAuth error page, or the user closing the window. None reach the completion
+   * page or fire an event here, and the user need never leave this tab for a
+   * focus event either, so polling is the only way the row learns it is over.
+   */
+  useEffect(() => {
+    if (connectionStatus !== 'pending' || !popupRef.current) return
+    const poll = window.setInterval(() => {
+      if (isPopupStillOpen(popupRef.current)) return
+      popupRef.current = null
+      void settleFromCredentials()
+    }, OAUTH_POPUP_POLL_INTERVAL_MS)
+    return () => window.clearInterval(poll)
+  }, [connectionStatus, settleFromCredentials])
 
   useEffect(() => {
     if (connected) onConnectedRef.current?.()
@@ -356,10 +383,14 @@ export function useOAuthChipConnection({
     if (connectionStatus !== 'connected' || !popup) return
     const attempt = readOAuthChatAttempt(popup.attemptId)
     popupRef.current = null
+    // The verdict settles the label, but the lock also waits on the credential
+    // being observable. A popup flow never blurs this tab, so nothing else
+    // refetches here and the row would read "Connected" yet stay clickable.
+    void settleFromCredentials()
     if (attempt?.status === 'connected') {
       toast.success(`${attempt.displayName} connected successfully.`)
     }
-  }, [connectionStatus])
+  }, [connectionStatus, settleFromCredentials])
 
   /**
    * Desktop app: OAuth cannot run in an embedded window — not in the app
@@ -376,6 +407,20 @@ export function useOAuthChipConnection({
         event.preventDefault()
         return
       }
+      // A second click would replace both the active attempt and the window
+      // handle, orphaning the first flow — its verdict lands on an attempt id
+      // the row no longer reads, so a successful connect waits forever. The
+      // live window is the flow; surface it instead of starting a rival one.
+      const livePopup = popupRef.current
+      if (isPopupStillOpen(livePopup)) {
+        event.preventDefault()
+        try {
+          livePopup?.window.focus?.()
+        } catch {
+          // A COOP-severed handle refuses focus, but still owns the flow.
+        }
+        return
+      }
       const attempt = createOAuthChatAttempt({
         workspaceId,
         providerId,