Add account integrations page

[kentcdodds]

Summary

• Add an authenticated /account/integrations page and JSON endpoint for saved OAuth integration metadata.
• Link integrations from the signed-in nav and account landing page.
• Add a focused handler test for user-scoped integration listing.
• Keep reconnect links provider-only so /connect/oauth reloads the latest stored integration config.

Walkthrough

Testing

• npx vitest run packages/worker/src/app/handlers/account-integrations.node.test.ts
• npm run typecheck
• npm run lint (passes with existing warnings)
• npm run format:check
• npm run validate
• Manual browser walkthrough against local dev server with seeded login and integration metadata.
• Manual browser walkthrough verified Reconnect OAuth navigates to /connect/oauth?provider=github and loads the current stored integration config.

  

Summary by CodeRabbit

• New Features
  • Added an “Integrations” page to the account menu and account details area.
  • Users can view saved OAuth integrations, including scopes/host details and last-updated timestamps.
  • Added “Reconnect OAuth” actions for eligible integrations.
• Tests
  • Added test coverage for the integrations API endpoint (including authentication and response content).

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 61d74223-2912-42fb-8807-2df19bca8488

📥 Commits

Reviewing files that changed from the base of the PR and between 39ed019 and 5a388ac.

📒 Files selected for processing (1)

• packages/worker/client/routes/account-integrations.tsx

---

📝 Walkthrough

Walkthrough

A new /account/integrations page is added end-to-end: a server handler authenticates users, queries stored OAuth integration configs via the MCP values service, and returns a JSON payload; a client Remix route fetches and renders integration cards with reconnect OAuth links; the account overview page and navigation are updated to surface the new section.

Changes

Account Integrations Feature

Layer / File(s)	Summary
API types, handler, buildPayload, and route wiring packages/worker/src/app/handlers/account-integrations.ts, packages/worker/src/app/routes.ts, packages/worker/src/app/router.ts, packages/worker/src/app/handlers/account-integrations.node.test.ts	Defines AccountIntegrationListItem and AccountIntegrationsPayload types. Implements createAccountIntegrationsHandler (page render with auth redirect) and createAccountIntegrationsApiHandler (GET-only JSON endpoint with 401/405 guards). buildPayload lists user-scoped values, parses each into integration configs, filters malformed entries, sorts by name, and returns the payload. A jsonResponse helper serializes with Cache-Control: no-store. Routes are registered in routes.ts and router.ts. Tests mock auth, values service, and layout; assert 200 response, correct listValues call args, and filtered/parsed integration payload.
Client route component and route registration packages/worker/client/routes/account-integrations.tsx, packages/worker/client/routes/index.tsx	Adds client-side types mirroring the API contract, buildConnectOauthHref to construct /connect/oauth URLs when integration has an authorize URL (encoding provider from name), and renderIntegrationDetail for labeled rows. AccountIntegrationsRoute manages loading/ready/error state, fetches /account/integrations.json with AbortSignal and credentials: include, redirects to /login on 401, and re-fetches on navigation changes via handle.queueTask. Renders loading, error, empty, and grid-of-cards states with conditional Reconnect OAuth links. Registered in clientRoutes.
Account page card and nav/layout wiring packages/worker/client/routes/account.tsx, packages/worker/client/app.tsx	Adds an Integrations card with a "Manage integrations" link to the account overview, updates the page description to include integrations, extends the wide-layout path check to /account/integrations, and adds an Integrations nav entry before Package tokens.

Sequence Diagram

sequenceDiagram
  participant Browser
  participant AccountIntegrationsRoute
  participant WorkerAPI as /account/integrations.json
  participant readAuthenticatedAppUser
  participant buildPayload
  participant listValues

  Browser->>AccountIntegrationsRoute: navigate to /account/integrations
  AccountIntegrationsRoute->>WorkerAPI: fetch (credentials: include)
  WorkerAPI->>readAuthenticatedAppUser: authenticate
  readAuthenticatedAppUser-->>WorkerAPI: user | null
  alt unauthenticated
    WorkerAPI-->>AccountIntegrationsRoute: 401
    AccountIntegrationsRoute->>Browser: redirect to /login
  else authenticated
    WorkerAPI->>buildPayload: buildPayload(user, env)
    buildPayload->>listValues: listValues({ userId, scope })
    listValues-->>buildPayload: stored integration values
    buildPayload-->>WorkerAPI: { ok, email, username, integrations[] }
    WorkerAPI-->>AccountIntegrationsRoute: 200 JSON payload
    AccountIntegrationsRoute->>Browser: render integration cards
  end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Poem

🐇 Hop, hop — a new page appears,
Where integrations dance through the years!
The rabbit fetches tokens with care,
OAuth reconnects float through the air.
Each card shows a secret, a scope, a URL bright—
Now managing integrations feels just right! 🌟

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'Add account integrations page' directly and clearly summarizes the main change—adding a new authenticated integrations page to the account section.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch cursor/integrations-page-3411

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

🔎 Preview deployed: https://kody-pr-550.kentcdodds.workers.dev

Worker: kody-pr-550
D1: kody-pr-550-db
KV: kody-pr-550-oauth-kv

Mocks:

• cloudflare: https://kody-pr-550-mock-cloudflare.kentcdodds.workers.dev/__mocks (kody-pr-550-mock-cloudflare)

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 39ed019. Configure here.}