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.

Sign up for GitHub

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

Jump to bottom

fix(TableOfContents): sync props and state for dynamically added items #7687

Merged
merged 4 commits into from
Nov 19, 2021
Merged

fix(TableOfContents): sync props and state for dynamically added items #7687

merged 4 commits into from
Nov 19, 2021

Conversation

emyarod
Copy link
Member

@emyarod emyarod commented Nov 17, 2021 •
edited
Loading

Related Ticket(s)

#7676

Description

This PR updates the React TableOfContents so that when items are dynamically added by the ToC component a rerender is triggered. Previously when dynamically populating the ToC, it would remain in the same state as the initial render

this can be tested in the TableOfContents story from #7676 by adding additional items in the story knobs https://ibmdotcom-react.s3.us-south.cloud-object-storage.appdomain.cloud/deploy-previews/7676/index.html

Changelog

New

  • NPE checks on validateMenuItems

Changed

  • watch changes in children to update when ToC items are dynamically added/removed

@emyarod emyarod added this to the Sprint 21-23 milestone Nov 17, 2021
@emyarod emyarod self-assigned this Nov 17, 2021
@emyarod emyarod requested a review from a team as a code owner November 17, 2021 16:41
@emyarod emyarod added the package: react Work necessary for the Carbon for IBM.com react components package label Nov 17, 2021
@emyarod emyarod mentioned this pull request Nov 17, 2021
Merged
@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Nov 17, 2021 •
edited
Loading

Deploy preview created for package Web Components (React wrapper):
https://ibmdotcom-web-components-react.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: f2ea4218617daabc033e14fd4f0a7e42c0894141

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Nov 17, 2021 •
edited
Loading

Deploy preview created for package Web Components:
https://ibmdotcom-webcomponents.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: f2ea4218617daabc033e14fd4f0a7e42c0894141

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Nov 17, 2021 •
edited
Loading

Deploy preview created for package Web Components HTML Test Application:
https://ibmdotcom-web-components-html-test-upstream.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: f2ea4218617daabc033e14fd4f0a7e42c0894141

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Nov 17, 2021 •
edited
Loading

Deploy preview created for package React:
https://ibmdotcom-react.s3.us-south.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: f2ea4218617daabc033e14fd4f0a7e42c0894141

@ibmdotcom-bot
Copy link
Contributor

Deploy preview created for package NextJS Test Application:
https://ibmdotcom-nextjs-test-upstream.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: daaf2af8657c71367312f32f7db2fbf75f78119d

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Nov 17, 2021 •
edited
Loading

Deploy preview created for package "Web Components (Codesandbox Examples)":
https://webcomponents-codesandbox.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: f2ea4218617daabc033e14fd4f0a7e42c0894141

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Nov 17, 2021 •
edited
Loading

Deploy preview created for package "React (Codesandbox Examples)":
https://react-codesandbox.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/7687/index.html

Built with commit: f2ea4218617daabc033e14fd4f0a7e42c0894141

jeffchew
jeffchew approved these changes Nov 18, 2021
View reviewed changes
Copy link
Member

@jeffchew jeffchew left a comment

Choose a reason for hiding this comment

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

LGTM!

@jeffchew jeffchew added the Ready to merge Label for the pull requests that are ready to merge label Nov 18, 2021
@kodiakhq kodiakhq bot merged commit a04b670 into carbon-design-system:master Nov 19, 2021
@emyarod emyarod deleted the fix/toc-props-state-sync branch November 19, 2021 15:09
@jeffchew jeffchew mentioned this pull request Nov 19, 2021
Closed
jeffchew pushed a commit that referenced this pull request Dec 3, 2021
@emyarod
docs(table-of-contents): add dynamic copy knobs (#7676)
3b390c3 
### Related Ticket(s)

#5644

### Description

This PR updates the web components, React wrapper, and React storybook Table of Contents stories according to match the expected content described in #5644:

* only "Default" (vertical) and "Horizontal" stories remain
* "With heading content" knob in default story toggles a link list header instead of an image
* the number of items is limited from 4-8 and the copy can be customized. This does not work properly in the web components storybook UI so you will need to view the story in a separate tab. This will work in the React storybook after #7687 is merged

### Changelog

**New**

- dynamic content knobs (the table of contents component does not update when its child elements change though, need to view story in new tab for updates)
- "Horizontal" story in React
- "Default" story in React

**Changed**

- "Default" story in web components and react wrapper

**Removed**

- obsolete React stories
- "With heading content" stories in all storybooks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@jeffchew jeffchew jeffchew approved these changes

@photodow photodow Awaiting requested review from photodow photodow was automatically assigned from carbon-design-system/carbon-for-ibm-com-members

@annawen1 annawen1 Awaiting requested review from annawen1 annawen1 was automatically assigned from carbon-design-system/carbon-for-ibm-com-members

@andysherman2121 andysherman2121 Awaiting requested review from andysherman2121 andysherman2121 was automatically assigned from carbon-design-system/carbon-for-ibm-com-members

Assignees

@emyarod emyarod

Labels
package: react Work necessary for the Carbon for IBM.com react components package Ready to merge Label for the pull requests that are ready to merge
Projects
None yet
Milestone
Sprint 21-23
Development

Successfully merging this pull request may close these issues.
3 participants
@emyarod @ibmdotcom-bot @jeffchew