Skip to content

RecordMeterBar Component: Adds a prop to display legend count after label #24474

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
Merged
jeherve merged 7 commits into from
May 25, 2022
Merged

RecordMeterBar Component: Adds a prop to display legend count after label #24474

jeherve merged 7 commits into from
May 25, 2022

Conversation

@annacmc
Copy link
Contributor

@annacmc annacmc commented May 23, 2022 •
edited by bluefuton
Loading

This PR alters the RecordMeterBar component to take an optional legend formatting prop. When passed in as true, the legend displays with the count after the label instead of before.

image

Does this pull request change what data or activity we track or use?

no

Testing instructions:

  • Run cd projects/js-packages/storybook && npm run storybook:dev and confirm that you see RecordMeterBar component in Storybook.
  • Under RecordMeterBar, choose the story 'Label Before Count'.

You can also run the unit tests for js-packages/components by running jetpack test.

@matticbot
Copy link
Contributor

matticbot commented May 23, 2022

Caution: This PR has changes that must be merged to WordPress.com
Hello annacmc! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer and confirm D81297-code works as expected before merging this PR. Once this PR is merged, please commit the changes to WP.com. Thank you!
This revision will be updated with each commit to this PR

@github-actions
Copy link
Contributor

github-actions bot commented May 23, 2022 •
edited
Loading

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

  • ✅ Include a description of your PR changes.
  • ⚠️ All commits were linted before commit.
  • ✅ Add a "[Status]" label (In Progress, Needs Team Review, ...).
  • ✅ Add testing instructions.
  • ✅ Specify whether this PR includes any changes to data or privacy.
  • ✅ Add changelog entries to affected projects

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

The e2e test report can be found here. Please note that it can take a few minutes after the e2e tests checks are complete for the report to be available.

Once your PR is ready for review, check one last time that all required checks (other than "Required review") appearing at the bottom of this PR are passing or skipped.
Then, add the "[Status] Needs Team review" label and ask someone from your team review the code.
Once you’ve done so, switch to the "[Status] Needs Review" label; someone from Jetpack Crew will then review this PR and merge it to be included in the next Jetpack release.

@github-actions github-actions bot added the [Status] Needs Author Reply We need more details from you. This label will be auto-added until the PR meets all requirements. label May 23, 2022
@annacmc annacmc force-pushed the update/record-meter-bar-legend-format branch from bad7743 to 6aa5c4a Compare May 24, 2022 14:14
@annacmc annacmc marked this pull request as ready for review May 24, 2022 17:41
@bluefuton bluefuton added [Status] Needs Team Review Obsolete. Use Needs Review instead. and removed [Status] Needs Author Reply We need more details from you. This label will be auto-added until the PR meets all requirements. labels May 25, 2022
@bluefuton bluefuton force-pushed the update/record-meter-bar-legend-format branch from 1b0415e to f14112f Compare May 25, 2022 03:01
@bluefuton
Copy link
Contributor

bluefuton commented May 25, 2022 •
edited
Loading

Added a Storybook story to make testing easier:

Screen Shot 2022-05-25 at 15 06 02

bluefuton
bluefuton previously approved these changes May 25, 2022
View reviewed changes
Copy link
Contributor

@bluefuton bluefuton left a comment •
edited
Loading

Choose a reason for hiding this comment

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

Looks good! Marking for wider review.

@bluefuton bluefuton added [Status] Needs Review This PR is ready for review. and removed [Status] Needs Team Review Obsolete. Use Needs Review instead. labels May 25, 2022
bluefuton
bluefuton reviewed May 25, 2022
View reviewed changes
manzoorwanijk
manzoorwanijk approved these changes May 25, 2022
View reviewed changes
Copy link
Member

@manzoorwanijk manzoorwanijk left a comment

Choose a reason for hiding this comment

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

Looks great.

@jeherve jeherve enabled auto-merge (squash) May 25, 2022 09:59
@jeherve jeherve merged commit 178f257 into master May 25, 2022
@jeherve jeherve added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Review This PR is ready for review. labels May 25, 2022
@jeherve jeherve deleted the update/record-meter-bar-legend-format branch May 25, 2022 09:59
@github-actions
Copy link
Contributor

github-actions bot commented May 25, 2022

Great news! One last step: head over to your WordPress.com diff, D81297-code, and deploy it.
Once you've done so, come back to this PR and add a comment with your changeset ID.

Thank you!

@github-actions github-actions bot removed the [Status] Ready to Merge Go ahead, you can push that green button! label May 25, 2022
manzoorwanijk
manzoorwanijk reviewed May 26, 2022
View reviewed changes
projects/js-packages/components/components/record-meter-bar/index.tsx
/**
* The formatting style for legend item display. If not provided, it defaults to showing legend label after count
*/
showLegendLabelBeforeCount: boolean;
Copy link
Member

@manzoorwanijk manzoorwanijk May 26, 2022 •
edited
Loading

Choose a reason for hiding this comment

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

This should have been marked as optional for backward compatibility. It breaks TS types for existing consumer components.

Screenshot 2022-05-26 at 10 43 51 AM

@anomiex another reason to ship #24329

Copy link
Contributor

@bluefuton bluefuton May 26, 2022

Choose a reason for hiding this comment

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

Sorry we both missed this in review @manzoorwanijk!

Would you like us to spin up a PR to address this specifically or are you happy to cover it in #24329?

Copy link
Member

@manzoorwanijk manzoorwanijk May 26, 2022

Choose a reason for hiding this comment

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

Sorry we both missed this in review @manzoorwanijk!

Yeah, that's why there are those CI checks in place to eliminate human error.

Would you like us to spin up a PR to address this specifically or are you happy to cover it in #24329?

I already added a fix for it in #24329. Thank you.

manzoorwanijk added a commit that referenced this pull request May 26, 2022
@manzoorwanijk
Fix the types broken in #24474
addd965
@manzoorwanijk manzoorwanijk mentioned this pull request May 26, 2022
Merged
manzoorwanijk added a commit that referenced this pull request May 26, 2022
@manzoorwanijk
Add TS check to build process (#24329)
eb821d5 
* Add TS check to build step for js-packages/components

* Use tsconfig in order to use tsc

* Add TS check to build step for plugins/jetpack

* Fix TS errors

* Add changelog files

* Tell TS that we are not passing 'external-link' as variant to WPButton

* [not verified] Revert "Tell TS that we are not passing 'external-link' as variant to WPButton"

This reverts commit 36b7295.

* Add global declaration file to avoid adding it at too many places

* Remove unused module that results in TS error

* Add TS check to build step for plugins/boost

* Fix versions

* Fix the types broken in #24474
@jeherve
Copy link
Member

jeherve commented May 31, 2022

r246578-wpcom

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@bluefuton bluefuton bluefuton approved these changes

@manzoorwanijk manzoorwanijk manzoorwanijk approved these changes

@jeherve jeherve jeherve approved these changes

Assignees

@annacmc annacmc

Labels

[JS Package] Components RNA Touches WP.com Files

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

6 participants

@annacmc @matticbot @bluefuton @jeherve @manzoorwanijk