feat: replace inline edit/delete buttons with dropdown menu in model limits table

[impoiler]

Summary

Replaces the individual inline Edit and Delete action buttons in the model limits table with a consolidated DropdownMenu (three-dot menu). The delete confirmation dialog is also lifted out of the per-row render loop and rendered once at the table level, driven by a deleteModelConfigId state value.

Changes

• Replaced per-row Edit and Delete buttons with a single MoreHorizontal icon button that opens a DropdownMenu containing Edit and Delete items.
• Moved the AlertDialog for delete confirmation out of the table row loop into a single top-level instance, controlled by deleteModelConfigId state. This prevents multiple dialog instances from being mounted simultaneously.
• Added deletingModelConfig derived from deleteModelConfigId via useMemo, keeping it in sync with the RTK cache similarly to editingModelConfig.
• Cleared deleteModelConfigId on successful deletion to close the dialog automatically.
• Removed the hover/focus-dependent opacity animation on the action cell since the dropdown replaces that pattern.

Type of change

• Bug fix
• Feature
• Refactor
• Documentation
• Chore/CI

Affected areas

• Core (Go)
• Transports (HTTP)
• Providers/Integrations
• Plugins
• UI (React)
• Docs

How to test

1. Navigate to the Model Limits table in the workspace.
2. Hover over any model limit row and click the ... (MoreHorizontal) button.
3. Verify the dropdown shows Edit and Delete options.
4. Click Edit and confirm the model limit sheet opens with the correct config pre-populated.
5. Click Delete and confirm the confirmation dialog appears with the correct model name (truncated if over 30 characters).
6. Confirm deletion succeeds, the dialog closes, and a success toast is shown.
7. Confirm that users without update/delete RBAC access see the respective menu items disabled.

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

Screenshots/Recordings

Add before/after screenshots showing the old separate Edit/Delete buttons vs. the new dropdown menu.

Breaking changes

• No

Related issues

Security considerations

RBAC checks for Governance update and delete operations are preserved on the new dropdown menu items.

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]

Warning

Rate limit exceeded

@impoiler has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 1 minute and 58 seconds 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: 3e23435b-c751-4c6e-937e-23b7160176af

📥 Commits

Reviewing files that changed from the base of the PR and between 8aa7789 and 9dd44b0.

📒 Files selected for processing (1)

• ui/app/workspace/model-limits/views/modelLimitsTable.tsx

📝 Walkthrough

Walkthrough

The ModelLimitsTable component refactors delete confirmation from per-row inline triggers to a single, centralized AlertDialog controlled by table-level state. Row actions now use a DropdownMenu with "Edit" and "Delete" items. Imports for dropdown components and icons are updated, and the delete flow clears state after successful deletion.

Changes

Delete Dialog Centralization

Layer / File(s)	Summary
Dropdown and icon dependencies ui/app/workspace/model-limits/views/modelLimitsTable.tsx	Updated imports for DropdownMenu UI components and Trash2 icon used in row actions.
Delete dialog state and implementation ui/app/workspace/model-limits/views/modelLimitsTable.tsx	Added deleteModelConfigId state and deletingModelConfig memo that drive a centralized AlertDialog for delete confirmation, with dynamic model name truncation and loading behavior.
Row actions UI and event flow ui/app/workspace/model-limits/views/modelLimitsTable.tsx	Replaced inline action buttons with DropdownMenu containing "Edit" and "Delete" items; updated handleEditModelLimit handler to accept config only; delete action sets deleteModelConfigId, and successful deletion clears it.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 A table dialog hops with grace,
Per-row confirmations found their place—
One dropdown menu, centered and true,
No more scattered triggers in view!
Delete now flows from a single source,
Cleaner, calmer, of course!

🚥 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
Title check	✅ Passed	The title accurately summarizes the main change: replacing inline edit/delete buttons with a dropdown menu in the model limits table.
Description check	✅ Passed	The description comprehensively covers the purpose, changes, type of change, affected areas, testing steps, RBAC preservation, and checklist items, aligning well with the template.
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 unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch 05-14-chore_made_actions_sticky_on_the_workspace_model-limits_page

---

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

[impoiler]

• 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
• 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 👈 (View in Graphite)
• 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]

Confidence Score: 5/5

This is a well-scoped UI refactor with no new logic errors; safe to merge.

The change is a straightforward UI consolidation. The deletingModelConfig memo correctly derives from the RTK cache prop, RBAC checks are intact on both new menu items, and the single top-level AlertDialog is a strict improvement over per-row instances. No new data paths or async race conditions are introduced beyond what was already present and flagged in earlier review threads.

No files require special attention.

Important Files Changed

Filename	Overview
ui/app/workspace/model-limits/views/modelLimitsTable.tsx	Replaces inline Edit/Delete buttons with a DropdownMenu, lifts the AlertDialog out of the per-row render loop, and adds deleteModelConfigId state — refactor is clean with RBAC preserved on both menu items.

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

[coderabbitai]

Actionable comments posted: 1

🧹 Nitpick comments (1)

ui/app/workspace/model-limits/views/modelLimitsTable.tsx (1)

390-406: ⚡ Quick win

Prefer onSelect over onClick for DropdownMenuItem actions.

Using onSelect aligns with Radix menu-item activation semantics and avoids input-method edge cases for keyboard-triggered selection.

Suggested patch

 															<DropdownMenuItem
 																className="cursor-pointer"
 																disabled={!hasUpdateAccess}
-																onClick={(e) => {
+																onSelect={(e) => {
 																	e.stopPropagation();
 																	handleEditModelLimit(config);
 																}}
 																data-testid={`model-limit-button-edit-${toTestIdPart(config.model_name)}-${toTestIdPart(config.provider || "all")}`}
 															>
@@
 															<DropdownMenuItem
 																variant="destructive"
 																className="cursor-pointer"
 																disabled={!hasDeleteAccess}
-																onClick={(e) => {
+																onSelect={(e) => {
 																	e.stopPropagation();
 																	setDeleteModelConfigId(config.id);
 																}}
 																data-testid={`model-limit-button-delete-${toTestIdPart(config.model_name)}-${toTestIdPart(config.provider || "all")}`}
 															>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@ui/app/workspace/model-limits/views/modelLimitsTable.tsx` around lines 390 -
406, Replace the onClick handlers on the DropdownMenuItem instances with
onSelect handlers to follow Radix activation semantics: move the existing inline
functions to onSelect (e.g., change onClick={(e)=>{e.stopPropagation();
handleEditModelLimit(config);}} to onSelect={(e)=>{e.stopPropagation();
handleEditModelLimit(config);}} for the Edit item and similarly replace
setDeleteModelConfigId(config.id) on the destructive item; keep the
e.stopPropagation() call, preserve the disabled prop
(disabled={!hasDeleteAccess}) and existing data-testid usage so behavior and
test hooks remain unchanged.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@ui/app/workspace/model-limits/views/modelLimitsTable.tsx`:
- Around line 141-148: The new delete dialog buttons (AlertDialogCancel and
AlertDialogAction) need test selectors: add data-testid attributes to the Cancel
and Delete controls in the modelLimitsTable component so E2E tests can target
them; specifically, update the AlertDialogCancel element to include
data-testid="model-delete-cancel" and the AlertDialogAction (the delete button
that calls handleDelete using deletingModelConfig.id and respects isDeleting) to
include data-testid="model-delete-confirm" so tests can reliably locate these
interactive elements.

---

Nitpick comments:
In `@ui/app/workspace/model-limits/views/modelLimitsTable.tsx`:
- Around line 390-406: Replace the onClick handlers on the DropdownMenuItem
instances with onSelect handlers to follow Radix activation semantics: move the
existing inline functions to onSelect (e.g., change
onClick={(e)=>{e.stopPropagation(); handleEditModelLimit(config);}} to
onSelect={(e)=>{e.stopPropagation(); handleEditModelLimit(config);}} for the
Edit item and similarly replace setDeleteModelConfigId(config.id) on the
destructive item; keep the e.stopPropagation() call, preserve the disabled prop
(disabled={!hasDeleteAccess}) and existing data-testid usage so behavior and
test hooks remain unchanged.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 26a1213b-ed6c-4a0f-a7ef-25c43742c3b1

📥 Commits

Reviewing files that changed from the base of the PR and between 9b9032e and 8aa7789.

📒 Files selected for processing (1)

• ui/app/workspace/model-limits/views/modelLimitsTable.tsx

[akshaydeo]

Merge activity

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

The base branch was changed.