fix: always show kebab menu in payroll list for consistent alignment#1457
fix: always show kebab menu in payroll list for consistent alignment#1457jeffredodd wants to merge 3 commits intomainfrom
Conversation
There was a problem hiding this comment.
Pull request overview
This PR ensures the Payroll list row actions column stays consistently aligned by always rendering the kebab (hamburger) menu for each row, showing a disabled “No actions available” item when no actions apply.
Changes:
- Always render the row kebab menu (including for processed payrolls and other no-action states).
- Add a new i18n string for the disabled empty-actions menu item.
- Update PayrollListPresentation tests to reflect the new always-visible menu behavior.
Reviewed changes
Copilot reviewed 3 out of 4 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/types/i18next.d.ts | Adds the new noActionsAvailable key to the PayrollList i18n type definition. |
| src/i18n/en/Payroll.PayrollList.json | Adds the English translation for “No actions available”. |
| src/components/Payroll/PayrollList/PayrollListPresentation.tsx | Renders HamburgerMenu for all rows and falls back to a disabled “No actions available” item when needed. |
| src/components/Payroll/PayrollList/PayrollListPresentation.test.tsx | Updates assertions to expect the menu to be present and to show the disabled fallback item. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <HamburgerMenu | ||
| menuLabel={t('payrollMenuLabel')} | ||
| items={[ | ||
| { | ||
| label: t('noActionsAvailable'), | ||
| onClick: () => {}, | ||
| isDisabled: true, | ||
| }, | ||
| ]} |
There was a problem hiding this comment.
The disabled "No actions available" menu item is defined in multiple places (the processed branch and the default menuItems fallback). Consider extracting a shared noActionsAvailable menu-item definition to avoid duplication and prevent the two instances from drifting over time (label/disabled behavior/etc.).
serikjensen
left a comment
There was a problem hiding this comment.
Flagging this one for additional design work
The kebab menu was conditionally hidden when no actions (skip/delete) were available, causing button misalignment across rows. Now the menu is always rendered with a disabled "No actions available" item when no real actions exist. Made-with: Cursor
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
…abled item Replace the disabled "No actions available" menu item with a hidden ButtonIcon placeholder that preserves row alignment. Uses the actual ButtonIcon component via ComponentsContext so the placeholder automatically matches partner overrides. Made-with: Cursor
2e57997 to
eb6267a
Compare
Summary
Screenshots
Before
After
Test plan
PayrollListWithBlockersStoryandPayrollListWithWireInStatusesStorynow show the kebab icon on every rowMade with Cursor