Skip to content

feat(bulk-action): create reusable BulkActionToolbar component#1671

Open
PARTH-TUSSLE wants to merge 3 commits into
layer5io:masterfrom
PARTH-TUSSLE:feature/1665-bulk-action-toolbar
Open

feat(bulk-action): create reusable BulkActionToolbar component#1671
PARTH-TUSSLE wants to merge 3 commits into
layer5io:masterfrom
PARTH-TUSSLE:feature/1665-bulk-action-toolbar

Conversation

@PARTH-TUSSLE

Copy link
Copy Markdown

Notes for Reviewers

This PR implements a standardized, reusable BulkActionToolbar custom component in Sistent (resolving sub-issue #1665 under the #1661 umbrella).

This component is designed to replace the duplicate and custom CustomToolbarSelect headers implemented across meshery-ui and other Layer5 projects.

Changes

  • Created src/custom/BulkActionToolbar/BulkActionToolbar.tsx which implements the selection bar containing the selected count and an optional "Deselect ALL" checkbox action button.
  • Reuses Sistent theme design tokens (theme.palette.background.secondary, theme.palette.background.card, theme.palette.text.default) for proper light/dark mode contrast.
  • Returns null if selectedCount <= 0 to hide itself automatically.
  • Created unit tests in src/__testing__/BulkActionToolbar.test.tsx to verify component mounting, children rendering, and click events.
  • Registered the component in custom and root barrel files to prevent rollup-plugin-dts nested declaration bugs.

Integration and preview ->

When integrated with mui-datatables as a customToolbarSelect replacement, the BulkActionToolbar cleanly renders the deselect action [-], selection count (X selected), and custom action buttons (like Delete/Compare) next to the table's default selection label:

{2D4940A7-2A81-4FDD-A858-08C77056F932}

This PR fixes #1665

Signed commits

  • [✅ ] Yes, I signed my commits.

Signed-off-by: Parth Gartan <parthgartan26feb@gmail.com>

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a new BulkActionToolbar component, including its unit tests and exports. The component displays a toolbar when items are selected, showing the count of selected items and an optional deselect button. The review feedback suggests avoiding hardcoded UI strings like 'Deselect ALL' and 'selected' to support internationalization (i18n). It recommends exposing these strings as configurable props with default values to maintain backward compatibility.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

Comment thread src/custom/BulkActionToolbar/BulkActionToolbar.tsx
Comment thread src/custom/BulkActionToolbar/BulkActionToolbar.tsx
Signed-off-by: Parth Gartan <parthgartan26feb@gmail.com>
@PARTH-TUSSLE

Copy link
Copy Markdown
Author

Hey @KhushamBansal , would appreciate review on this whenever you get the time.

Signed-off-by: Parth Gartan <parthgartan26feb@gmail.com>
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.

BulkActionToolbar:A Reusable component to replace meshery-ui's CustomToolbarSelect

1 participant