feat: replace inline action buttons with dropdown menu and pin actions column in MCP clients table by impoiler · Pull Request #3486 · maximhq/bifrost

impoiler · 2026-05-14T06:52:01Z

Summary

Replaces the per-row inline action buttons (reconnect + delete) in the MCP clients table with a consolidated MoreHorizontal dropdown menu, and moves the actions column to a sticky right-pinned position so it remains visible when the table scrolls horizontally.

Changes

Replaced the individual Reconnect (with tooltip) and Delete (with inline AlertDialog) buttons with a single DropdownMenu triggered by a MoreHorizontal icon button.
The delete confirmation AlertDialog is now lifted out of the table row and controlled via a clientToDelete state variable, preventing multiple dialog instances from being mounted inside the DOM simultaneously.
The actions column header and cell are now sticky right-0 with PIN_SHADOW_RIGHT applied, keeping the actions visible during horizontal scroll.
The table container changed from overflow-hidden to overflow-auto to enable horizontal scrolling.
Reconnect and delete menu items are conditionally rendered based on RBAC access, rather than being rendered-but-disabled.
The MoreHorizontal button shows a Loader2 spinner while a reconnect is in progress for that row.
Added group class to table rows to allow the sticky actions cell to mirror the row hover background.

Type of change

Affected areas

How to test

Navigate to the MCP Registry page in the workspace UI.
Verify each MCP client row shows a ⋯ (MoreHorizontal) button in the rightmost column.
Click the button and confirm the dropdown shows Reconnect and Delete options (subject to RBAC permissions).
Select Reconnect and confirm the spinner appears on the button while reconnecting.
Select Delete and confirm the confirmation dialog appears with the correct server name, and that confirming removes the client.
Resize the browser window to trigger horizontal scrolling and confirm the actions column remains pinned to the right.

cd ui
pnpm i || npm i
pnpm build || npm run build

Screenshots/Recordings

Before/after screenshots recommended showing the old inline icon buttons vs. the new dropdown menu.

Breaking changes

No

Related issues

Security considerations

RBAC checks are preserved — reconnect and delete menu items are only rendered when the user has the corresponding Update or Delete permission on MCPGateway.

Checklist

I read docs/contributing/README.md and followed the guidelines
I added/updated tests where appropriate
I updated documentation where needed
I verified builds succeed (Go and UI)
I verified the CI pipeline passes locally if applicable

coderabbitai · 2026-05-14T06:52:08Z

Warning

Rate limit exceeded

@impoiler has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 2 minutes before requesting another review.

You’ve run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 83c0e4bb-297e-441f-84f2-7ee9252df7fc

📥 Commits

Reviewing files that changed from the base of the PR and between aeb12f4 and 1ec7297.

📒 Files selected for processing (1)

ui/app/workspace/mcp-registry/views/mcpClientsTable.tsx

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch 05-14-chore_made_actions_sticky_on_the_workspace_mcp-registry_page

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

impoiler · 2026-05-14T06:52:23Z

chore: /ui code formatting #3494
feat: replace inline action buttons with pinned dropdown menus and add active toggle switch in teams and virtual keys tables #3487
feat: replace inline action buttons with dropdown menu and pin actions column in MCP clients table #3486 👈 (View in Graphite)
feat: replace inline edit/delete buttons with dropdown menu in pricing overrides table #3485
feat: replace routing rule action buttons with dropdown menu #3484
feat: replace inline edit/delete buttons with dropdown menu in model limits table #3483
fix: constrain provider keys table column widths and truncate long key names #3482
fix: constrain model catalog table column widths and truncate overflowing text #3481
feat: replace log delete button with actions dropdown menu and pin actions column #3480
dev

This stack of pull requests is managed by Graphite. Learn more about stacking.

greptile-apps · 2026-05-14T08:52:25Z

Confidence Score: 4/5

The refactor is clean overall, but the Delete dropdown item calls e.preventDefault() on onSelect, which leaves the dropdown mounted and visible behind the AlertDialog overlay — it reappears once the dialog is dismissed.

The e.preventDefault() on the Delete DropdownMenuItem's onSelect is unnecessary (the AlertDialog is controlled externally by state) and causes the dropdown menu to reappear after the confirmation dialog closes, resulting in a visible UX defect on every delete attempt. The rest of the changes — sticky pinning, lifted AlertDialog, RBAC-gated items — are correct.

ui/app/workspace/mcp-registry/views/mcpClientsTable.tsx — specifically the Delete item's onSelect handler around line 355.

Important Files Changed

Filename	Overview
ui/app/workspace/mcp-registry/views/mcpClientsTable.tsx	Refactors per-row inline action buttons to a consolidated DropdownMenu with a lifted AlertDialog and a sticky actions column; `e.preventDefault()` on the Delete item's onSelect leaves the dropdown open behind the AlertDialog overlay so it reappears after dismissal.

_{Reviews (2): Last reviewed commit: "chore: made actions sticky on the worksp..." | Re-trigger Greptile}

…s always visible

…page and sidebar active state fix

greptile-apps · 2026-05-14T10:15:36Z

+															onSelect={(e) => {
+																e.preventDefault();
+																setClientToDelete(c);
+															}}


Dropdown reappears after AlertDialog is dismissed

e.preventDefault() on the Delete item's onSelect suppresses Radix's auto-close of the DropdownMenu. Because the AlertDialog is lifted out of the row and controlled via clientToDelete state, preventDefault isn't needed — state-driven re-render opens the dialog independently. With preventDefault in place the dropdown stays open behind the AlertDialog overlay; once the user confirms or cancels, the overlay disappears and the dropdown reappears unexpectedly. Removing e.preventDefault() here (unlike on the Reconnect item) lets the menu close normally before the dialog opens.

akshaydeo · 2026-05-14T10:19:21Z

Merge activity

May 14, 10:19 AM UTC: A user started a stack merge that includes this pull request via Graphite.
May 14, 10:25 AM UTC: @akshaydeo merged this pull request with Graphite.

The base branch was changed.

…s column in MCP clients table (#3486) ## Summary Replaces the per-row inline action buttons (reconnect + delete) in the MCP clients table with a consolidated `MoreHorizontal` dropdown menu, and moves the actions column to a sticky right-pinned position so it remains visible when the table scrolls horizontally. ## Changes - Replaced the individual `Reconnect` (with tooltip) and `Delete` (with inline `AlertDialog`) buttons with a single `DropdownMenu` triggered by a `MoreHorizontal` icon button. - The delete confirmation `AlertDialog` is now lifted out of the table row and controlled via a `clientToDelete` state variable, preventing multiple dialog instances from being mounted inside the DOM simultaneously. - The actions column header and cell are now `sticky right-0` with `PIN_SHADOW_RIGHT` applied, keeping the actions visible during horizontal scroll. - The table container changed from `overflow-hidden` to `overflow-auto` to enable horizontal scrolling. - Reconnect and delete menu items are conditionally rendered based on RBAC access, rather than being rendered-but-disabled. - The `MoreHorizontal` button shows a `Loader2` spinner while a reconnect is in progress for that row. - Added `group` class to table rows to allow the sticky actions cell to mirror the row hover background. ## Type of change - [ ] Bug fix - [ ] Feature - [x] Refactor - [ ] Documentation - [ ] Chore/CI ## Affected areas - [ ] Core (Go) - [ ] Transports (HTTP) - [ ] Providers/Integrations - [ ] Plugins - [x] UI (React) - [ ] Docs ## How to test 1. Navigate to the MCP Registry page in the workspace UI. 2. Verify each MCP client row shows a `⋯` (MoreHorizontal) button in the rightmost column. 3. Click the button and confirm the dropdown shows **Reconnect** and **Delete** options (subject to RBAC permissions). 4. Select **Reconnect** and confirm the spinner appears on the button while reconnecting. 5. Select **Delete** and confirm the confirmation dialog appears with the correct server name, and that confirming removes the client. 6. Resize the browser window to trigger horizontal scrolling and confirm the actions column remains pinned to the right. ```sh cd ui pnpm i || npm i pnpm build || npm run build ``` ## Screenshots/Recordings Before/after screenshots recommended showing the old inline icon buttons vs. the new dropdown menu. ## Breaking changes - [x] No ## Related issues ## Security considerations RBAC checks are preserved — reconnect and delete menu items are only rendered when the user has the corresponding `Update` or `Delete` permission on `MCPGateway`. ## Checklist - [ ] I read `docs/contributing/README.md` and followed the guidelines - [ ] I added/updated tests where appropriate - [ ] I updated documentation where needed - [ ] I verified builds succeed (Go and UI) - [ ] I verified the CI pipeline passes locally if applicable

…s column in MCP clients table (maximhq#3486) ## Summary Replaces the per-row inline action buttons (reconnect + delete) in the MCP clients table with a consolidated `MoreHorizontal` dropdown menu, and moves the actions column to a sticky right-pinned position so it remains visible when the table scrolls horizontally. ## Changes - Replaced the individual `Reconnect` (with tooltip) and `Delete` (with inline `AlertDialog`) buttons with a single `DropdownMenu` triggered by a `MoreHorizontal` icon button. - The delete confirmation `AlertDialog` is now lifted out of the table row and controlled via a `clientToDelete` state variable, preventing multiple dialog instances from being mounted inside the DOM simultaneously. - The actions column header and cell are now `sticky right-0` with `PIN_SHADOW_RIGHT` applied, keeping the actions visible during horizontal scroll. - The table container changed from `overflow-hidden` to `overflow-auto` to enable horizontal scrolling. - Reconnect and delete menu items are conditionally rendered based on RBAC access, rather than being rendered-but-disabled. - The `MoreHorizontal` button shows a `Loader2` spinner while a reconnect is in progress for that row. - Added `group` class to table rows to allow the sticky actions cell to mirror the row hover background. ## Type of change - [ ] Bug fix - [ ] Feature - [x] Refactor - [ ] Documentation - [ ] Chore/CI ## Affected areas - [ ] Core (Go) - [ ] Transports (HTTP) - [ ] Providers/Integrations - [ ] Plugins - [x] UI (React) - [ ] Docs ## How to test 1. Navigate to the MCP Registry page in the workspace UI. 2. Verify each MCP client row shows a `⋯` (MoreHorizontal) button in the rightmost column. 3. Click the button and confirm the dropdown shows **Reconnect** and **Delete** options (subject to RBAC permissions). 4. Select **Reconnect** and confirm the spinner appears on the button while reconnecting. 5. Select **Delete** and confirm the confirmation dialog appears with the correct server name, and that confirming removes the client. 6. Resize the browser window to trigger horizontal scrolling and confirm the actions column remains pinned to the right. ```sh cd ui pnpm i || npm i pnpm build || npm run build ``` ## Screenshots/Recordings Before/after screenshots recommended showing the old inline icon buttons vs. the new dropdown menu. ## Breaking changes - [x] No ## Related issues ## Security considerations RBAC checks are preserved — reconnect and delete menu items are only rendered when the user has the corresponding `Update` or `Delete` permission on `MCPGateway`. ## Checklist - [ ] I read `docs/contributing/README.md` and followed the guidelines - [ ] I added/updated tests where appropriate - [ ] I updated documentation where needed - [ ] I verified builds succeed (Go and UI) - [ ] I verified the CI pipeline passes locally if applicable

This was referenced May 14, 2026

feat: replace inline edit/delete buttons with dropdown menu in pricing overrides table #3485

Merged

feat: replace inline action buttons with pinned dropdown menus and add active toggle switch in teams and virtual keys tables #3487

Merged

impoiler changed the title ~~chore: made actions sticky on the workspace/mcp-registry page~~ feat: replace inline action buttons with dropdown menu and pin actions column in MCP clients table May 14, 2026

impoiler self-assigned this May 14, 2026

impoiler marked this pull request as ready for review May 14, 2026 08:49

greptile-apps Bot reviewed May 14, 2026

View reviewed changes

Comment thread ui/app/workspace/mcp-registry/views/mcpClientsTable.tsx

Comment thread ui/app/workspace/mcp-registry/views/mcpClientsTable.tsx

Comment thread ui/app/workspace/mcp-registry/views/mcpClientsTable.tsx

coderabbitai Bot previously approved these changes May 14, 2026

View reviewed changes

impoiler added 7 commits May 14, 2026 15:41

chore: Made the logs table actions column sticky on the right so it i…

e51f30f

…s always visible

fix: workspace/model-catalog table layout shifts

ebd2d9f

fix: workspace/providers table layout shift

8ef4b61

chore: made actions sticky on the workspace/model-limits page

9dd44b0

chore: Made actions sticky on the workspace/routing-rules page

4f05042

chore: Made actions sticky on the workspace/custom-pricing/overrides …

aeb12f4

…page and sidebar active state fix

chore: made actions sticky on the workspace/mcp-registry page

1ec7297

impoiler force-pushed the 05-14-chore_made_actions_sticky_on_the_workspace_custom-pricing_overrides_page_and_sidebar_active_state_fix branch from 364c29a to aeb12f4 Compare May 14, 2026 10:12

impoiler force-pushed the 05-14-chore_made_actions_sticky_on_the_workspace_mcp-registry_page branch from aa85056 to 1ec7297 Compare May 14, 2026 10:12

greptile-apps Bot reviewed May 14, 2026

View reviewed changes

impoiler mentioned this pull request May 14, 2026

chore: /ui code formatting #3494

Merged

18 tasks

akshaydeo changed the base branch from 05-14-chore_made_actions_sticky_on_the_workspace_custom-pricing_overrides_page_and_sidebar_active_state_fix to graphite-base/3486 May 14, 2026 10:24

akshaydeo changed the base branch from graphite-base/3486 to dev May 14, 2026 10:24

akshaydeo merged commit 0a05c53 into dev May 14, 2026
13 checks passed

akshaydeo deleted the 05-14-chore_made_actions_sticky_on_the_workspace_mcp-registry_page branch May 14, 2026 10:25

akshaydeo mentioned this pull request May 20, 2026

v1.5.3 #3531

Merged

Navigation Menu

Uh oh!

feat: replace inline action buttons with dropdown menu and pin actions column in MCP clients table - #3486

feat: replace inline action buttons with dropdown menu and pin actions column in MCP clients table#3486
akshaydeo merged 7 commits into
devfrom
05-14-chore_made_actions_sticky_on_the_workspace_mcp-registry_page

impoiler commented May 14, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented May 14, 2026 •

edited

Loading

Rate limit exceeded

Uh oh!

impoiler commented May 14, 2026 •

edited

Loading

Uh oh!

greptile-apps Bot commented May 14, 2026 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

greptile-apps Bot May 14, 2026

Uh oh!

akshaydeo commented May 14, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

impoiler commented May 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Changes

Type of change

Affected areas

How to test

Screenshots/Recordings

Breaking changes

Related issues

Security considerations

Checklist

Uh oh!

coderabbitai Bot commented May 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Rate limit exceeded

Uh oh!

impoiler commented May 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

greptile-apps Bot commented May 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Confidence Score: 4/5

Important Files Changed

Uh oh!

Uh oh!

Uh oh!

Uh oh!

greptile-apps Bot May 14, 2026

Choose a reason for hiding this comment

Uh oh!

akshaydeo commented May 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Merge activity

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

impoiler commented May 14, 2026 •

edited

Loading

coderabbitai Bot commented May 14, 2026 •

edited

Loading

impoiler commented May 14, 2026 •

edited

Loading

greptile-apps Bot commented May 14, 2026 •

edited

Loading

akshaydeo commented May 14, 2026 •

edited

Loading