Skip to content

feat(tabletools): add collapse all option for the table - #127

Merged
bastilian merged 4 commits into
bastilian:mainfrom
Fewwy:add-expand-collapse-all
Aug 10, 2026
Merged

feat(tabletools): add collapse all option for the table#127
bastilian merged 4 commits into
bastilian:mainfrom
Fewwy:add-expand-collapse-all

Conversation

@Fewwy

@Fewwy Fewwy commented Aug 4, 2026

Copy link
Copy Markdown
Collaborator

I am working on migrating Rules table in Advisor to tabletools, and I stumbled upon the fact that tabletools does not handle expand all rows.

Right now useExpandable only exposes single-row toggle: ({ item: { itemId } }) => toggle(itemId). It never passes canCollapseAll: true to PF's Table, so the expand-all arrow never renders

What this pr change
useExpandable now handles the PF Table's canCollapseAll pattern:
When detailsComponent is set, canCollapseAll: true is automatically passed to the Table — renders the expand-all chevron in the header row.
onCollapse handles rowIndex === undefined (PF's expand-all signal) using set/clear from useSelectionManager
useTableTools passes items to useExpandable so it knows which itemIds to expand

@Fewwy Fewwy self-assigned this Aug 4, 2026
@Fewwy
Fewwy force-pushed the add-expand-collapse-all branch from c7c2259 to b583276 Compare August 4, 2026 10:50
@bastilian

Copy link
Copy Markdown
Owner

@Fewwy Thank you for taking the time to add this! It would be great if we'd have this also in the Storybook. It should be enough to extend the TableToolsTable story to have an argument/option to enable the "Expand all" feature here https://github.com/bastilian/tabletools/blob/main/src/components/TableToolsTable/TableToolsTable.stories.js#L87

...(enableExpandingRow
? {
tableProps: {
canCollapseAll: options.canCollapseAll !== false,

Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

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

Since the useExpandable is also utilised when the table is a tree, we do need to add one guard here to not pass the canCollapseAll prop in that case.

Something like:

...!options.treeTable ? { canCollapseAll: options.canCollapseAll !== false,} : {}

We could at some point extend the "expand all" feature to support tree tables, but that will require a bit more work... and might actually be tricky to implement.

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

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

I added it :) thank for the advice

Copy link
Copy Markdown
Owner

Choose a reason for hiding this comment

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

@Fewwy Mind taking another look. I was really just guessing.... It seems that the when a treetable is passed it still shows the collapse all:

Screenshot 2026-08-07 at 00 03 54

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

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

I fixed that, we had to check for !options.enableTreeView and not !options.treeTable, it works as intended now :)
image

@bastilian
bastilian merged commit 8ba103d into bastilian:main Aug 10, 2026
3 checks passed
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.

2 participants