FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

fix(switch): backward compatibility in case labelOff is not set by boaz0 · Pull Request #2816 · patternfly/patternfly-react · GitHub

fix(switch): backward compatibility in case labelOff is not set - #2816

Merged
tlabaj merged 1 commit into
patternfly:masterfrom
boaz0:closes_2814
Sep 18, 2019
Merged

fix(switch): backward compatibility in case labelOff is not set#2816
tlabaj merged 1 commit into
patternfly:masterfrom
boaz0:closes_2814

Conversation

boaz0 commented Sep 2, 2019

Copy link
Copy Markdown
Member

What:

Add a check if label is set but not labelOff - in that case display label on both labels.
if both label and labelOff are set display in the new format
Otherwise - display switch without labels.

Added tests to verify that if labelOff not given the label is shown.

fixes #2814

//cc @spytec

Copy link
Copy Markdown
Collaborator

PatternFly-React preview: https://patternfly-react-pr-2816.surge.sh

boaz0 commented Sep 16, 2019

Copy link
Copy Markdown
Member Author

fixed merge conflicts

Copy link
Copy Markdown
Contributor

Hi @boaz0 , what i meant is that we don't need to code duplication, we can simply fix the conditionals.
Before:

        {label !== '' || labelOff !== '' ? (
          <React.Fragment>
            <span className={css(styles.switchToggle)} />
            <span
              className={css(styles.switchLabel, styles.modifiers.on)}
              id={isAriaLabelledBy ? `${this.id}-on` : null}
              aria-hidden="true"
            >
              {label}
            </span>
            <span
              className={css(styles.switchLabel, styles.modifiers.off)}
              id={isAriaLabelledBy ? `${this.id}-off` : null}
              aria-hidden="true"
            >
              {labelOff}
            </span>
          </React.Fragment>
        ) : (
          <span className={css(styles.switchToggle)}>
            <div className={css(styles.switchToggleIcon)} aria-hidden="true">
              <CheckIcon noVerticalAlign />
            </div>
          </span>
        )}

After:

        {label !== '' ? (
          <React.Fragment>
            <span className={css(styles.switchToggle)} />
            <span
              className={css(styles.switchLabel, styles.modifiers.on)}
              id={isAriaLabelledBy ? `${this.id}-on` : null}
              aria-hidden="true"
            >
              {label}
            </span>
            <span
              className={css(styles.switchLabel, styles.modifiers.off)}
              id={isAriaLabelledBy ? `${this.id}-off` : null}
              aria-hidden="true"
            >
              {labelOff || label}
            </span>
          </React.Fragment>
        ) : (
          <span className={css(styles.switchToggle)}>
            <div className={css(styles.switchToggleIcon)} aria-hidden="true">
              <CheckIcon noVerticalAlign />
            </div>
          </span>
        )}

boaz0 commented Sep 17, 2019

Copy link
Copy Markdown
Member Author

@jschuler I got it.

Signed-off-by: Boaz Shuster <boaz.shuster.github@gmail.com>

tlabaj left a comment

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.

Choose a reason Spam Abuse Off Topic Outdated Duplicate Resolved Low Quality

LGTM

tlabaj merged commit f2d0969 into patternfly:master Sep 18, 2019
boaz0 deleted the closes_2814 branch April 24, 2020 06:40
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
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.

[PF4] Switch label prop does not show when Switch is off

4 participants


Back | FazBrowse Home | New Git URL