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(filter-panel): prevent accordion state resetting on input selection #7452

Merged
merged 6 commits into from
Oct 20, 2021
Merged

fix(filter-panel): prevent accordion state resetting on input selection #7452

merged 6 commits into from
Oct 20, 2021

Conversation

emyarod
Copy link
Member

@emyarod emyarod commented Oct 20, 2021 •
edited
Loading

Related Ticket(s)

#6677

Description

This PR resolves an issue with the filter panel where panel groups would unexpectedly collapse on selection of filter items. It also addresses the issue of inconsistent filter panel headings, so it now reflects the number of selections in the standalone filter panel (matching the filter panel modal)

Screen.Recording.2021-10-20.at.8.34.03.AM.mov

It looks like the light DOM controls the filter panel modal and the shadow DOM controls the standalone filter panel. I'm a bit iffy on changing light DOM attributes after iterating through the shadow DOM but I think this approach is required given the current construction of the component (need some more feedback on that)

While looking into this, I noticed that the storybook knobs would not update the filter panel heading as expected (#7441), so it seems that the props and internal state need to be reconciled for this to be resolved. Resolving this should also improve support for translated strings, as the "Filter" heading is currently hard coded. The component may be due for a refactor but that can probably be done separately from the work for #6677

Changelog

Changed

  • making selections in the standalone filter panel (large viewport widths) should no longer collapse filter groups
  • filter panel heading now matches filter panel modal

Removed

  • unused component methods

@emyarod emyarod added the package: web components Work necessary for the IBM.com Library web components package label Oct 20, 2021
@emyarod emyarod added this to the Sprint 21-21 milestone Oct 20, 2021
@emyarod emyarod changed the title 6677 fix/filter panel accordion state resetting fix(filter-panel): prevent accordion state resetting on input selection Oct 20, 2021
@emyarod emyarod force-pushed the 6677-fix/filter-panel-accordion-state-resetting branch from 2919fd8 to dc2d775 Compare October 20, 2021 12:56
@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 20, 2021 •
edited
Loading

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

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 20, 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/7452/index.html

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 20, 2021 •
edited
Loading

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

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 20, 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/7452/index.html

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@ibmdotcom-bot
Copy link
Contributor

ibmdotcom-bot commented Oct 20, 2021 •
edited
Loading

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

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@emyarod emyarod marked this pull request as ready for review October 20, 2021 14:01
@emyarod emyarod requested a review from a team as a code owner October 20, 2021 14:01
jeffchew
jeffchew approved these changes Oct 20, 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 Oct 20, 2021
@jeffchew jeffchew mentioned this pull request Oct 20, 2021
Closed
@ibmdotcom-bot
Copy link
Contributor

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

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@kodiakhq kodiakhq bot merged commit 0a41071 into carbon-design-system:master Oct 20, 2021
@emyarod emyarod deleted the 6677-fix/filter-panel-accordion-state-resetting branch October 20, 2021 16:30
@ibmdotcom-bot
Copy link
Contributor

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

Built with commit: 5cf4b51d78da9c99c87c1e3bb8d1ae0339877d5a

@ariellalgilmore ariellalgilmore mentioned this pull request Oct 22, 2021
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ariellalgilmore ariellalgilmore ariellalgilmore approved these changes

@jeffchew jeffchew jeffchew approved these changes

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

@andysherman2121 andysherman2121 Awaiting requested review from andysherman2121

Assignees
No one assigned
Labels
package: web components Work necessary for the IBM.com Library web components package Ready to merge Label for the pull requests that are ready to merge
Projects
None yet
Milestone
Sprint 21-21
Development

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