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

[ChoiceList] Disable all choices at once #1758

Merged
merged 1 commit into from
Jul 2, 2019
Merged

Conversation

jtrollia
Copy link
Contributor

@jtrollia jtrollia commented Jun 28, 2019

WHY are these changes introduced?

It can be tedious to pass down a disable prop to each choice of a <ChoiceList />, especially when the component is wrapped, or when the list of choices is long.

Mentioned in #114.

WHAT is this pull request doing?

📹 https://www.youtube.com/watch?v=r6gPRukvCbQ&feature=youtu.be

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:
import * as React from 'react';
import {Page} from '../src';
import {ChoiceList, Button} from '../src';

interface State {
  choice: string;
  massDisable: boolean;
}

export default class Playground extends React.Component<{}, State> {
  state: State = {
    choice: 'enabled',
    massDisable: false,
  };

  render() {
    const {choice, massDisable} = this.state;
    return (
      <Page title="Playground">
        <ChoiceList
          choices={[
            {
              value: 'disabled',
              label: 'Disabled',
            },
            {
              value: 'enabled',
              label: 'Enabled',
            },
            {
              value: 'pepsi',
              label: 'Pepsi',
              disabled: true,
            },
          ]}
          title="Some funky ChoiceList"
          selected={[choice]}
          onChange={(newVal) => {
            this.setState({choice: newVal[0]});
          }}
          disabled={massDisable}
        />
        <br />
        <Button onClick={() => this.setState({massDisable: !massDisable})}>
          {massDisable ? 'Enable' : 'Disable'} all choices
        </Button>
      </Page>
    );
  }
}

🎩 checklist

@jtrollia jtrollia self-assigned this Jun 28, 2019
@ghost
Copy link

ghost commented Jun 28, 2019

👋 Thanks for opening your first pull request. A contributor should give feedback soon. If you haven’t already, please check out the contributing guidelines. You can also join #polaris on the Shopify Partners Slack.

@BPScott BPScott temporarily deployed to polaris-react-pr-1758 June 28, 2019 22:11 Inactive
Copy link
Member

@chloerice chloerice left a comment

Choose a reason for hiding this comment

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

Changes and 🎩 look solid 🏅 Thanks for contributing Jean-Loup! Just add the following entry to the UNRELEASED.md under Enhancements and you're good 🚢

Added support for disabling all choices in `ChoiceList` ((1758)[https://github.com/Shopify/polaris-react/pull/1758])

@BPScott BPScott requested a deployment to polaris-react-pr-1758 July 2, 2019 15:10 Abandoned
@jtrollia jtrollia merged commit add1996 into master Jul 2, 2019
@ghost
Copy link

ghost commented Jul 2, 2019

🎉 Thanks for your contribution to Polaris React!

@jtrollia jtrollia deleted the disable-choicelist branch July 2, 2019 15:21
@dleroux dleroux temporarily deployed to production July 9, 2019 15:19 Inactive
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.

4 participants