Skip to content

feat(connections): connection organization redesign#2537

Closed
rafavalls wants to merge 16 commits intomainfrom
valls/deco-1427-connection-organization-in-studio
Closed

feat(connections): connection organization redesign#2537
rafavalls wants to merge 16 commits intomainfrom
valls/deco-1427-connection-organization-in-studio

Conversation

@rafavalls
Copy link
Collaborator

@rafavalls rafavalls commented Mar 1, 2026

Summary

Full redesign of the connections list and detail pages for better organization and UX.

List page

  • Grouped accordion view: connections with the same app_name are collapsed under a service header (icon + name + instance count)
  • Solo connections render as individual rows with their own icon
  • Defaults to cards view; bumped storage key to reset persisted table preference

Detail page

  • Hero header with connection icon, name, status badge, and settings/disconnect actions
  • Activity chart powered by real MONITORING_LOGS_LIST data with 7d/14d/30d timeframe toggle
  • Capabilities section with Tools / Prompts / Resources tabs
  • Agents panel showing which agents use this connection
  • Info card with metadata (connection type, URL, last updated)

Settings

  • Reverted settings from Dialog back to a Sheet drawer (520px, right side)
  • Sticky header with connection name, scrollable form body, sticky Save/Undo footer
  • Removed "This server is all set!" empty state — replaced with compact inline status badge
  • Fixed double-padding in ConnectionFields (p-5py-4)

Store

  • Removed Store from the sidebar navigation
  • "Add Connection" button on the connections page opens an inline store modal (Dialog) with StoreDiscovery embedded — no separate page navigation needed

Test plan

  • Connections list: verify accordion grouping for multi-instance services, solo rows show icon
  • Connections list: default to cards view on fresh load
  • Activity chart: loads real data, timeframe toggle works (7d/14d/30d)
  • Capabilities tabs: Tools / Prompts / Resources show when populated
  • Settings sheet: opens on "Configure", saves changes, Undo reverts form
  • OAuth flow: authenticate button triggers OAuth popup, token saved
  • Store modal: "Add Connection" opens modal with store catalog, clicking item navigates to store detail page
  • Sidebar: Store no longer appears in Build group
  • bun run fmt && bun run lint pass with 0 errors

🤖 Generated with Claude Code


Summary by cubic

Redesigned the connections list and detail pages for clearer organization and faster workflows. Addresses Linear DECO-1427 with a grouped list, a dashboard-style detail view, and an inline Add Connection flow.

  • New Features

    • Grouped accordion list by service; solo connections render as rows with icons.
    • Default to cards view; reset old prefs with storage key "connections-v2".
    • Detail hero header with icon, name, status, Configure, and Disconnect.
    • Activity chart from MONITORING_LOGS_LIST with 7d/14d/30d toggle.
    • Capabilities panel with Tools, Prompts, and Resources.
    • Agents panel showing which agents use the connection.
    • Info card with added by, protocol, and updated time.
    • "Add Connection" opens an inline Store modal; Store removed from sidebar.
  • Refactors

    • Replaced sidebar+tabs with a two-column dashboard; moved settings to a right-side Sheet with sticky Save/Undo.
    • Exported ConnectionFields and fixed padding; added xl IntegrationIcon.
    • Added KEYS.connectionActivity and a Disconnect flow with confirm + redirect.
    • Replaced the success empty state with a compact inline status badge.

Written for commit 1e393c2. Summary will update on new commits.

@github-actions
Copy link
Contributor

github-actions bot commented Mar 1, 2026

🧪 Benchmark

Should we run the Virtual MCP strategy benchmark for this PR?

React with 👍 to run the benchmark.

Reaction Action
👍 Run quick benchmark (10 & 128 tools)

Benchmark will run on the next push after you react.

@github-actions
Copy link
Contributor

github-actions bot commented Mar 1, 2026

Release Options

Should a new version be published when this PR is merged?

React with an emoji to vote on the release type:

Reaction Type Next Version
👍 Prerelease 2.128.2-alpha.1
🎉 Patch 2.128.2
❤️ Minor 2.129.0
🚀 Major 3.0.0

Current version: 2.128.1

Deployment

  • Deploy to production (triggers ArgoCD sync after Docker image is published)

rafavalls and others added 16 commits March 3, 2026 11:06
…d layout

- Replace sidebar+tabs layout with ConnectionDetailHeader + two-column dashboard
- Move connection settings (URL, auth, token) into a slide-over Sheet
- Add handleDisconnect with confirm dialog and post-delete navigation
- Surface ConnectionActivity, ConnectionCapabilities, ConnectionAgentsPanel, ConnectionInfoCard panels
- Remove unused tabs state, CollectionTabs, SaveActions, PinToSidebarButton, ConnectionSidebar, ReadmeTab imports
- Remove unused imports: useSearch, useCollectionBindings, useMCPPromptsListQuery, useMCPResourcesListQuery
- Remove dead props from ConnectionInspectorViewWithConnection (requestedTabId, collections, prompts, resources, isLoadingTools)
- Remove corresponding dead variables and hook calls from ConnectionInspectorViewContent
…oved UX

- Connect activity chart to real MONITORING_LOGS_LIST data with 7d/14d/30d timeframe toggle
- Add prompts and resources tabs to capabilities section (Tools / Prompts / Resources)
- Replace Sheet drawer with Dialog for settings — better UX than a sliding panel
- Add IntegrationIcon to solo connection rows so they are visually recognizable
- Design polish: header hierarchy, status dots, disconnect button styling
- Add connectionActivity query key to KEYS constant

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Switch default view mode from "table" to "cards" and bump the storage
key to "connections-v2" so existing users' persisted "table" preference
is reset, revealing the accordion-grouped connection list.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…ve store from sidebar

- Revert settings panel from Dialog back to Sheet drawer with polished layout
  (sticky header with connection title, scrollable form body, sticky save/undo footer)
- Replace 'This server is all set!' empty state with compact inline status badge
- Fix ConnectionFields double-padding by removing p-5 (Sheet already has px-6 padding)
- Remove Store from sidebar navigation
- Add inline 'Add Connection' store modal on connections page so users can browse
  and pick MCP servers without leaving the connections list

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@rafavalls rafavalls force-pushed the valls/deco-1427-connection-organization-in-studio branch from c1a85bb to 1e393c2 Compare March 3, 2026 14:09
@rafavalls rafavalls closed this Mar 18, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant