Skip to content
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

feat(table): enable single nested hierarchy styling #1609

Merged
merged 4 commits into from
Sep 19, 2020

Conversation

sstone2423
Copy link

@sstone2423 sstone2423 commented Sep 16, 2020

Closes #1602
Closes #1600

Summary

  • The current Table only supports multiple hierarchy nested styling, but the release of List has given a new use-case where single nested hierarchies can exist, and should have similar styling to List
  • This PR adds a new prop hasSingleNestedHierarchy as an option that will disable the gray offset if enabled

Related internal Monitor design: https://ibm.invisionapp.com/share/KWO0FZ5BHQ9#/screens/319695909

Change List (commits, features, bugs, etc)

  • added hasSingleNestedHierarchy prop
  • removed padding when select all checkbox was enabled as it was creating an odd offset where it was not aligned with the first level parents (this also fixed [Table] parent row selection doesn't select all children nested rows #1600 )
  • Updated snapshots, but not sure why the pagination id increased
  • Added new single nested hierarchy story

Acceptance Test (how to verify the PR)

  • Go to /?path=/story/watson-iot-table--stateful-example-with-single-nested-hierarchy in the netlify preview
    • ensure that all first level checkboxes are aligned
    • expand one of the rows
      • see that there is no gray offset

Regression Test (how to make sure I didn't break things)

  • Go to ?path=/story/watson-iot-table--stateful-example-with-row-nesting-and-fixed-columns

    • ensure that the checkboxes are still aligned
    • expand one of the rows
      • see that there IS a gray offset still (as this is not a single hierarchy)
  • Go to table resize AND fixed column stories to ensure that the padding still looks correct in the select all checkbox in the table head AND the offset still works correctly with those (if they include nested rows)

Screen Shot 2020-09-16 at 12 40 17 PM

Screen Shot 2020-09-16 at 12 40 13 PM

@netlify
Copy link

netlify bot commented Sep 16, 2020

Deploy preview for carbon-addons-iot-react ready!

Built with commit 1b22d2b

https://deploy-preview-1609--carbon-addons-iot-react.netlify.app

Copy link
Contributor

@bjornalm bjornalm left a comment

Choose a reason for hiding this comment

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

Nice work! I give an approval right away, but please consider the comment regarding the new prop and its naming

Copy link
Contributor

@JoelArmendariz JoelArmendariz left a comment

Choose a reason for hiding this comment

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

Looks good to me

@tay1orjones tay1orjones merged commit abefcbd into master Sep 19, 2020
@tay1orjones tay1orjones deleted the table-hierarchy branch September 19, 2020 19:15
@tay1orjones
Copy link
Member

🎉 This PR is included in version 2.122.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
4 participants