Give each connection its own page and list connections as cards

[leoisadev1]

Summary

In the local dashboard, a connection was split across three screens. The Connect page put the setup prompt first and listed connections below it. Clicking one opened a read-only detail view. Changing anything meant Edit access, then a separate editor. Now the sidebar's Connect is Connections: a card per connection with a Connect button. Clicking a scoped connection opens one page where you rename it, turn apps on and set their tools in place, and save.

 Sidebar
-  Connect → /connect
+  Connections → /connections
 /connections  (new, local)
+  Full access card (the plain MCP URL) + one card per scoped connection
+  Connect → dialog with Prompt / MCP URL / Command
+  New connection → /connections/new
 /connections/$connectionId  (new, local; replaces detail view + editor)
+  title is the name field
+  "Can use" apps, then "Other apps": checkbox, tools, events, accounts per row
+  search, turn on all matches, assign one account, needs-setup filter
+  Save / Discard bar appears only after a change
+  ⋯ menu: Copy MCP URL, Rename, Revoke connection
 ConnectionAppRow (packages/ui, shared with hosted)
-  repeats an app's only account next to its subtitle
+  optional renderConnectAccount → "Connect account" for apps with none
 ProviderIcon (packages/ui, shared with hosted)
-  17px logo inside a bordered 34px box
+  logo fills a rounded white tile; bordered box only for the fallback

App logos also change everywhere they appear. They used to render at 17px inside a bordered box. Now they fill a rounded white tile, like the integrations catalog.

The old /connect page and the hosted dashboard are unchanged in this PR. If this direction is right, the next step is moving the page into the shared ScopedConnectionsPage so hosted gets it too.

Evidence

Real local data: the full-access URL and two scoped connections, Support assistant and Release bot.

Before	After

Before, mobile	After, mobile

Logos before	Logos after

After: specific tools	After: ⋯ menu

After: Connect dialog	After: app with no account turned on

• Saving works end to end: switched Release bot's Executor tools from Read-only to All tools, saved, reloaded, and the change held. Switched it back the same way.
• In the tools picker, Select under the Read filter selects only the 45 read tools (45 of 81).
• Rename focuses and selects the title. Revoke asks for confirmation. "Connect account" opens the app's Accounts tab.
• No horizontal overflow at 390px on the list or the connection page.
• bun run format:check, bun run lint, bun run typecheck and the no-unit-tests check pass. patches:check fails on its own fixtures on v2 as well; this PR doesn't touch patches.
• On self-host, "Members create and revoke a scoped connection from the dashboard" passes. It drives the hosted editor through the shared app row this PR changes.
• An independent GPT-6.1 Sol review found that the "Connect account" link was inside the row's <label>, so following it could toggle the app. Fixed: the link now sits outside the label.

Not covered: the hosted dashboard in a browser. It shares the app row and logo changes but was not screenshotted; the self-host scenario above runs through it.

mcp-connections.spec.ts
local-mcp-connections.spec.ts

Merge Danger

Door: two-way. UI only; no stored data, API or migration changes.

Blast radius: the local dashboard's Connections pages, the app row in the hosted connection editor, and every app logo in both dashboards. If it's wrong, an app row shows the wrong account text, or "Connect account" leaves the page and drops unsaved edits (it does today, without a warning).

Created with Claude Opus 5.5 in T3 Code.