improvement(credentials): consolidate OAuth modals and auto-fill credential name

[waleedlatif1]

Summary

• Consolidate ConnectCredentialModal and OAuthRequiredModal into a single OAuthModal with mode: 'connect' | 'reauthorize' discriminated union props
• Auto-fill credential display name as "{Username}'s {Provider} {N}" (e.g. "Waleed's Google Drive 1"), falling back to "My {Provider} {N}"
• Move OAuthModal to workspace-level components since it's shared across workflow editor and knowledge base
• Remove unnecessary lazy loading of OAuthModal in workflow.tsx (already eagerly imported by credential-selector)

Type of Change

• Enhancement / refactor

Testing

• Unit tests for getDefaultCredentialName (9 cases)
• Tested manually

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
docs	Skipped		Apr 1, 2026 10:29pm

[cursor]

PR Summary

Medium Risk
Refactors OAuth connection/reauthorization UI into a single shared modal and changes the connect flow to prefill and validate credential display names, which could affect OAuth initiation paths (including Trello/Shopify redirects) across workflows and knowledge base connectors.

Overview
Consolidates OAuth UX by replacing ConnectCredentialModal and OAuthRequiredModal with a single workspace-level OAuthModal that supports mode: 'connect' | 'reauthorize', and updates all workflow + knowledge base connector entry points to use it.

Improves connect flow by auto-prefilling the credential display name using getDefaultCredentialName (user-name-based fallback to "My" and incremented suffix), persisting the same OAuth return context, and adding unit tests covering name formatting edge cases.

Removes the workflow OAuth modal lazy-loading and renders OAuthModal directly where needed.

^{Written by Cursor Bugbot for commit 71915c5. Configure here.}

[greptile-apps]

Greptile Summary

This PR consolidates ConnectCredentialModal and OAuthRequiredModal into a single OAuthModal with a mode: 'connect' | 'reauthorize' discriminated union, adds auto-fill for the credential display name based on the session user's name, moves the component to the workspace-level components/ folder, and removes a now-unnecessary lazy-load wrapper in workflow.tsx. All four call sites correctly pass the required props for each mode, and the previous review concern about the knowledge-base subtitle is addressed.

Confidence Score: 5/5

• Safe to merge — clean refactor with no regressions; all call sites verified, previous review concerns addressed
• No P0 or P1 findings. Every call site correctly passes all required props for both connect and reauthorize modes. The discriminated union types enforce correctness at compile time. The lazy-load removal is justified, the KB subtitle fix is in place, and unit tests cover all edge cases for the new getDefaultCredentialName helper.
• No files require special attention

Important Files Changed

Filename	Overview
apps/sim/app/workspace/[workspaceId]/components/oauth-modal.tsx	New unified modal using a clean discriminated union; handles both connect and reauthorize modes, knowledge-base subtitle, trello/shopify special-case redirects, and draft mutation — all correctly
apps/sim/app/workspace/[workspaceId]/components/oauth-modal.test.ts	9 unit tests for getDefaultCredentialName covering null, undefined, empty, whitespace, and normal name cases — all edge cases covered
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/connectors-section/connectors-section.tsx	Both modal usages (connect and reauthorize) correctly pass all required props including workspaceId, knowledgeBaseId, credentialCount, toolName, scopes
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx	Lazy wrapper and Suspense removed; OAuthModal eagerly imported — justified since credential-selector already pulls it into the same bundle chunk

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[User triggers credential action] --> B{Which mode?}
    B -->|New connection| C[OAuthModal mode='connect']
    B -->|Re-authorize| D[OAuthModal mode='reauthorize']

    C --> E[Show display name input\nauto-filled via getDefaultCredentialName]
    E --> F[User submits]
    F --> G[createDraft.mutateAsync]
    G --> H[writeOAuthReturnContext]

    D --> I[Show scopes + New badges\nfor missing scopes]
    I --> J[User clicks Connect]
    J --> K{onConnectOverride?}
    K -->|yes| L[Call override → onClose]
    K -->|no| M[Proceed to OAuth flow]

    H --> M
    M --> N{Provider?}
    N -->|trello| O[Redirect /api/auth/trello/authorize]
    N -->|shopify| P[Redirect /api/auth/shopify/authorize]
    N -->|other| Q[client.oauth2.link]
    Q --> R[handleClose]

Loading

_{Reviews (2): Last reviewed commit: "fix(credentials): context-aware subtitle..." | Re-trigger Greptile}

[waleedlatif1]

@greptile

[waleedlatif1]

@cursor review

[cursor]

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR