-
Notifications
You must be signed in to change notification settings - Fork 78
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Multiselect table filter #1523
Multiselect table filter #1523
Conversation
Deploy preview for carbon-addons-iot-react ready! Built with commit 0007502 https://deploy-preview-1523--carbon-addons-iot-react.netlify.app |
Deploy preview for carbon-addons-iot-react ready! Built with commit a0936b1 https://deploy-preview-1523--carbon-addons-iot-react.netlify.app |
src/components/Table/TableViewDropdown/__snapshots__/TableViewDropdown.story.storyshot
Show resolved
Hide resolved
I've added a link to close the relevant issue on this repo |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good! Functionally, the search results update, pagination reflects the changes, keyboard navigation looks solid - you can focus to deselect all options at once or individually inside the menu. Code is 👍
I think it would be beneficial to add some RTL tests that cover the general interaction though. Something like:
- render table with preselected filters
- deselect one filter, add one filter, remove all filters - assert between each that the search results are updated in the dom and the pagination component displays the proper result count
- render table without preselected filters
- do similar flow as above, maybe modify to deselect all filters first then add new ones or something
I know this will overlap some of the tests that Carbon has on Multiselect, but as they make changes (and we update to accept them) it would be great to ensure the table functions aren't impacted. They recently upgraded downshift for instance (#1462 WIP) and I've found some problems were caught by tests, while others were not. We've also seen changes where reducer tests pass but functionally things have broken. Trying to avoid these things as much as possible, particularly with the Table
Thanks @tay1orjones . That does sound very beneficial to hopefully catch some bugs with this as versions change. I will add some RTL test cases. |
@tay1orjones I have added some RTL test cases to cover preselected filters, non-preselected filters, adding filters, removing filters, and clearing the multiselect box. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great job!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for adding those tests! 🎉
Summary
Closes #1432
Relevant ticket item: https://github.ibm.com/wiotp/monitoring-dashboard/issues/728
Adds the ability to filter a table based on a multiselect dropdown.
Change List (commits, features, bugs, etc)
Add
isMultiselect
option on thefilter
prop forTable
Render
Multiselect
for filtering in theFilterHeaderRow
Update
TableReducer
logic to handle multiselect filters.Acceptance Test (how to verify the PR)
Go to the
Table example with multiselect filtering
story in storybook and confirm that the multiselect properly filters the table.