fix(ui): standardize kebab menu behavior across dashboard cards

[ompharate]

fixes #36324

I noticed that the three-dot (kebab) menu behaved a bit differently depending on where it appeared. Welcome page cards and Dashboard page cards were using different color tokens and different interaction patterns (hover vs click) for what is effectively the same control. This PR cleans that up by introducing a small shared KebabMenuButton component and using it consistently in DashboardCard, ChartCard, and SliceHeaderControls. The result is a uniform look and click based interaction across all card menus

https://github.com/user-attachments/assets/a74ea904-9ec5-471b-b370-cf94fc886b74

TEST FIX

open Superset and check the three-dot menu on both Welcome page cards and Dashboard page cards (including chart cards). Confirm that the menu icon uses the same color in all contexts and that the menu opens on click (not on hover).

ADDITIONAL INFORMATION

• [ ] Required feature flags:
• [x] Changes UI
• [ ] Includes DB Migration (follow approval process in SIP-59)
  • [ ] Migration is atomic, supports rollback & is backwards-compatible
  • [ ] Confirm DB migration upgrade and downgrade tested
  • [ ] Runtime estimates and downtime expectations provided
• [ ] Introduces new feature or API
• [ ] Removes existing feature or API

[bito-code-review[bot]]

Code Review Agent Run #41d1e9

Actionable Suggestions - 0

Review Details

• Files reviewed - 5 · Commit Range: 961329a..961329a

  • superset-frontend/src/components/KebabMenuButton/index.tsx
  • superset-frontend/src/components/index.ts
  • superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx
  • superset-frontend/src/features/charts/ChartCard.tsx
  • superset-frontend/src/features/dashboards/DashboardCard.tsx
• Files skipped - 0
• Tools

  • Eslint (Linter) - ✔︎ Successful
  • Whispers (Secret Scanner) - ✔︎ Successful
  • Detect-secrets (Secret Scanner) - ✔︎ Successful

---

Bito Usage Guide

Commands

Type the following command in the pull request comment and save the comment.

• /review - Manually triggers a full AI review.

• /pause - Pauses automatic reviews on this pull request.

• /resume - Resumes automatic reviews.

• /resolve - Marks all Bito-posted review comments as resolved.

• /abort - Cancels all in-progress reviews.

Refer to the documentation for additional commands.

Configuration

This repository uses Default Agent You can customize the agent settings here or contact your Bito workspace admin at [email protected].

Documentation & Help

• Customize agent settings
• Review rules
• General documentation
• FAQ

AI Code Review powered by

[ompharate]

Should I work on both changes reviewed by Copilot?'

1. Use KebabMenuButton in SliceHeaderControls/index.tsx
2. adding a test file KebabMenuButton.test.tsx

[palaxi0]

@ompharate please add unit tests to this refactor.

[rusackas]

I'm all for uniformity/consistency! I'm wondering if this just adds another animal to the zoo... I'd want to take stock of all the places it can and should be used (the tabs in SQL Lab come to mind, but I'd wager there are a lot of places to be made consistent one way or another).