Skip to content

feat(ToggleGroup): support disabling all items under the parent#6700

Merged
tlabaj merged 6 commits intopatternfly:mainfrom
boaz0:closes_6359
Jan 11, 2022
Merged

feat(ToggleGroup): support disabling all items under the parent#6700
tlabaj merged 6 commits intopatternfly:mainfrom
boaz0:closes_6359

Conversation

@boaz0
Copy link
Copy Markdown
Member

@boaz0 boaz0 commented Dec 14, 2021

What: Closes #6359

Signed-off-by: Boaz Shuster <boaz.shuster.github@gmail.com>
@patternfly-build
Copy link
Copy Markdown
Collaborator

patternfly-build commented Dec 14, 2021

@tlabaj tlabaj requested a review from mcoker December 20, 2021 14:37
Copy link
Copy Markdown
Contributor

@mcoker mcoker left a comment

Choose a reason for hiding this comment

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

L👍TM!

Comment thread packages/react-core/src/components/ToggleGroup/ToggleGroup.tsx Outdated
Comment thread packages/react-core/src/components/ToggleGroup/ToggleGroup.tsx Outdated
Comment thread packages/react-core/src/components/ToggleGroup/ToggleGroup.tsx Outdated
Use React.Children.toArray and map instead of forEach
Copy link
Copy Markdown
Contributor

@nicolethoen nicolethoen left a comment

Choose a reason for hiding this comment

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

LGTM! Thank you!!

Comment thread packages/react-core/src/components/ToggleGroup/ToggleGroup.tsx Outdated
Change ToggleGroup to toggle group in disableAll description
Comment thread packages/react-core/src/components/ToggleGroup/ToggleGroup.tsx Outdated
const childCompName = (child as any).type.name;
return childCompName !== ToggleGroupItem.name
? child
: React.cloneElement(child as React.ReactElement, disableAll ? { isDisabled: true } : {});
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

We try and avoid cloneElement when we can. Can we do this with a render prop instead?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

In the current state, I don't think so. The closest we can do is to create ToggleGroupContext which will pass this to other ToggleGroupItems through its context.
What do you think?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Hmmm. That might be a better option @boaz0 consumers have asked we avoid cloneElement as it can be problematic.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

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

So you want me to do go with the context idea and revert the current changes I've made?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

I think either method works in this case because we're type checking the child before cloning

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

@boaz0 I think your approach is fine for this use case.

@tlabaj tlabaj merged commit a60c8f3 into patternfly:main Jan 11, 2022
@patternfly-build
Copy link
Copy Markdown
Collaborator

Your changes have been released in:

  • eslint-plugin-patternfly-react@4.25.0
  • @patternfly/react-catalog-view-extension@4.37.0
  • @patternfly/react-charts@6.39.0
  • @patternfly/react-code-editor@4.27.0
  • @patternfly/react-console@4.37.0
  • @patternfly/react-core@4.186.0
  • @patternfly/react-docs@5.47.0
  • @patternfly/react-icons@4.37.0
  • @patternfly/react-inline-edit-extension@4.31.0
  • demo-app-ts@4.146.0
  • @patternfly/react-integration@4.148.0
  • @patternfly/react-log-viewer@4.31.0
  • @patternfly/react-styles@4.36.0
  • @patternfly/react-table@4.55.0
  • @patternfly/react-tokens@4.38.0
  • @patternfly/react-topology@4.33.0
  • @patternfly/react-virtualized-extension@4.33.0
  • transformer-cjs-imports@4.24.0

Thanks for your contribution! 🎉

@boaz0 boaz0 deleted the closes_6359 branch January 12, 2022 18:14
@boaz0
Copy link
Copy Markdown
Member Author

boaz0 commented Jan 12, 2022

Thank you all! @nicolethoen @wise-king-sullyman @tlabaj @mcoker @kmcfaul

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.

Add optional disable prop to ToggleGroup component.

7 participants