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

Plans: Add a plan billing period toggle #13600

Merged
merged 4 commits into from
Oct 1, 2019
Merged

Conversation

tyxla
Copy link
Member

@tyxla tyxla commented Sep 30, 2019

This PR adds a plan billing period toggle to the plans screens. This will allow users to switch between monthly and yearly plans before upgrading to a plan from wp-admin.

Changes proposed in this Pull Request:

  • Plans: Add a plan billing period toggle

Preview

Yearly plans (default):

Monthly plans:

Is this a new feature or does it add/remove features to an existing part of Jetpack?

  • Part of the p1HpG7-7nj-p2 project.

Testing instructions:

  • Apply this patch to your WP.com sandbox, and follow the instructions there (if you haven't yet): D33376-code
  • Checkout this branch on your connected Jetpack site (ideally, on a free plan).
  • Run yarn build or yarn watch.
  • Go to /wp-admin/admin.php?page=jetpack#/plans
  • Verify the loading placeholder plan boxes align with the plan boxes once they load.
  • Verify you landed on the yearly plans view.
  • Verify the toggle looks and works well, and it updates the price accordingly.
  • Test on tablet and verify it works and looks good.
  • Test on mobile and verify the toggle isn't visible there.
  • Test also on /wp-admin/admin.php?page=jetpack#/plans-prompt
  • Bonus: verify that we record a tracks event when we toggle the billing period:
    • Type localStorage.setItem('debug', 'dops:analytics'); in your browser console.
    • Refresh the page.
    • Click a toggle that's not currently active.
    • Verify it records an adequate tracks event with the period of the toggle that was clicked.

Proposed changelog entry for your changes:

  • Plans: Add a plan billing period toggle

@tyxla tyxla added this to the 7.9 milestone Sep 30, 2019
@tyxla tyxla requested a review from a team September 30, 2019 14:04
@tyxla tyxla self-assigned this Sep 30, 2019
@jetpackbot
Copy link

jetpackbot commented Sep 30, 2019

Thank you for the great PR description!

When this PR is ready for review, please apply the [Status] Needs Review label. If you are an a11n, please have someone from your team review the code if possible. The Jetpack team will also review this PR and merge it to be included in the next Jetpack release.

Scheduled Jetpack release: November 5, 2019.
Scheduled code freeze: October 29, 2019

Generated by 🚫 dangerJS against 38c71dc

@tyxla tyxla added [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. [Status] Needs Design Review Design has been added. Needs a review! and removed [Status] In Progress labels Oct 1, 2019
@tyxla tyxla requested a review from a team October 1, 2019 10:50
@tyxla
Copy link
Member Author

tyxla commented Oct 1, 2019

Ready for design and code review! 😉

Copy link
Contributor

@keoshi keoshi left a comment

Choose a reason for hiding this comment

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

Looking good, @tyxla !

jp-plans-toggle

@keoshi keoshi removed the [Status] Needs Design Review Design has been added. Needs a review! label Oct 1, 2019
@enejb
Copy link
Member

enejb commented Oct 1, 2019

The design and the code looks great. The one that that I wish we also did was url persistance.
For example if I switch to the monthly view and refresh the page it takes me back to the yearly view.

I think this can also be fixed in a different PR. :shipit:

@tyxla tyxla added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Review To request a review from fellow Jetpack developers. Label will be renamed soon. labels Oct 1, 2019
@tyxla tyxla merged commit 11d0600 into master Oct 1, 2019
@tyxla tyxla deleted the add/plans-period-toggle branch October 1, 2019 12:54
@matticbot matticbot added [Status] Needs Changelog and removed [Status] Ready to Merge Go ahead, you can push that green button! labels Oct 1, 2019
jeherve added a commit that referenced this pull request Oct 23, 2019
jeherve added a commit that referenced this pull request Oct 29, 2019
* 7.9: Changelog

* Update version number

* Update stable tag and tested up to

* Changelog: add #13530

* changelog: add #13578

* Changelog: add #13598

* Changelog: add entry for numerous block preview changes

* Changelog: add #13599

* changelog: add #13541

* Changelog: add #13542

* Changelog: add #13331

* Changelog: add #13558

* Changelog: add #13409

* Changelog: add #13582

* Changelog: add #13600

* Changelog: add #13601

* Changelog: add #13595

* Changelog: add #12695

* Changelog: add #13009

* Changelog: add #13649

* Changelog: add #13450

* Changelog: add #13507

* Changelog: add #13658

* Changelog: add #13687

* changelog: add #13683

* Changelog: add #9323

* Changelog: add #13681

* Fix typos in readme

* Add link to WordPress Beta Tester plugin

* Changelog: add #13630

* Changelog: add #13695

* Changelog: add #13659

* Changelog: add #13716

* Changelog: add #13664

* Changelog: add #13682

* Changelog: add #13362

* Changelog: add #13563

* Add testing list for #13563

* Changelog: add #13735

* Changelog: add #13752

* Changelog: add #13624

* Changelog: add #13756

* Changelog: add #13745

* Changelog: add #13728

* Changelog: add #13779

* Changelog: add #13699

* Changelog: add #13804

* Changelog: add #13761

* Changelog: add #13637

* Changelog: add #13517

* Changelog: add #13521

* Changelog: add #13729

* Testing list: add testing instructions for #13729

* Changelog: add sync changes

* Changelog: add #13807

* Changelog: add #13654

* Changelog: add #13795

* Changelog: add #13801

* Changelog: add #13818

* Changelog: add #13725

* Changelog: add #13831

* Changelog: add #13516

* Testing list: add Twenty Twenty instructions

* Changelog: add #13799

* Changelog: add #13805

* Changelog: add #13688

* Changelog: add #13830
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Connect Flow Connection banners, buttons, ... Plans [Pri] Normal
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants