Search: Update upsell page for pricing change #26408

dognose24 · 2022-09-23T21:25:05Z

Fixes #25915

Changes proposed in this Pull Request:

Expose the offset option of the IconTooltip component to the Popover component and fix the relative position
Modify PricingTable component styles adapting to the design and refactor the type of tooltipInfo to ReactNode for HTML syntax
Introduce PricingTable to complete the upsell page for the new pricing change
-------------------------------------- updated --------------------------------------
Introduce the URL parameter new_pricing_202208=1 to determine when the new pricing table shows.

Other information:

Have you written new tests for your changes, if applicable?
Have you checked the E2E test CI results, and verified that your changes do not break them?

Jetpack product discussion

p1HpG7-hEH-p2

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

N/A

Testing instructions:

Go to a site with Jetpack connected but did not purchase Jetpack Search
Navigate to the url /wp-admin/admin.php?page=jetpack-search
Ensure there is the existing upsell page with a pricing card
Navigate to the url /wp-admin/admin.php?page=jetpack-search&new_pricing_202208=1
Ensure there is a brand new upsell page

Before	After

Ensure the new upsell page conforms to the design

matticbot · 2022-09-23T21:25:13Z

Caution: This PR has changes that must be merged to WordPress.com
Hello dognose24! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer and confirm D88440-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 · 2022-09-23T21:25:59Z

Are you an Automattician? You can now test your Pull Request on WordPress.com. On your sandbox, run bin/jetpack-downloader test jetpack update/upsell_page to get started. More details: p9dueE-5Nn-p2

github-actions · 2022-09-23T21:26:23Z

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.

Search plugin:

Next scheduled release: October 4, 2022.
Scheduled code freeze: September 26, 2022.

jsnmoon

Unfortunately, this PR removes the existing upsell interface before the new pricing tier goes live. I commented inline on how to ship this code while preserving our current onboarding flow.

jsnmoon · 2022-09-23T22:34:19Z

projects/packages/search/src/dashboard/components/pages/upsell-page.jsx

+		],
+	};
+
+	const pricingTable = (


We can spin this off into a functional component (e.g. SearchPricingTable) in this file. Let's tackle this in a follow-up PR.

projects/js-packages/components/components/product-price/index.tsx

projects/packages/search/src/dashboard/components/pages/upsell-page.jsx

jsnmoon

Works as described.

I noticed that the links within the tooltips aren't clickable since the tooltips despawn when we stop mousing over the icon. Let's address this in a follow-up PR 🙂

oskosk

Approving again to see if it stops being stuck

github-actions · 2022-09-26T20:29:15Z

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

Thank you!

jsnmoon · 2022-09-26T21:00:53Z

🚢 r253223-wpcom

jsnmoon · 2022-09-26T22:35:48Z

I noticed that the links within the tooltips aren't clickable since the tooltips despawn when we stop mousing over the icon. Let's address this in a follow-up PR 🙂

Fix for this tooltip bug is proposed here.

dognose24 added 10 commits September 24, 2022 03:28

Expose offset option of the IconTooltip to Popover

7f98284

Fix relative position of Popover to the icon

9ae1c57

Add children prop to support HTML for leyend

5408089

Fix PricingTable styles for usage in Upsell page

eec67ab

Support HTML syntax to TooltipInfo in PricingTable

f80f8bc

Introduce PricingTable to Upsell page

53293af

changelog

ec60b2a

Modify tooltipInfo type in PricingTable for HTML

08cc3c5

Merge branch 'trunk' into update/upsell_page

b3c7e78

Fix styles and ProductPrice leyend

3df8372

dognose24 requested a review from a team as a code owner September 23, 2022 21:25

matticbot added the Touches WP.com Files label Sep 23, 2022

dognose24 added the [Package] Search Contains core Search functionality for Jetpack and Search plugins label Sep 23, 2022

github-actions bot added [JS Package] Components RNA labels Sep 23, 2022

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 Sep 23, 2022

jsnmoon suggested changes Sep 23, 2022

View reviewed changes

jsnmoon added [Status] Needs Author Reply We need more details from you. This label will be auto-added until the PR meets all requirements. and removed [Status] Needs Team Review Obsolete. Use Needs Review instead. labels Sep 23, 2022

dognose24 added 2 commits September 26, 2022 15:38

Tackle upsell page compatible with old pricing

7017e1b

Fix condition with children in ProductPrice

4b8c663

dognose24 requested a review from jsnmoon September 26, 2022 08:12

dognose24 removed the [Status] Needs Author Reply We need more details from you. This label will be auto-added until the PR meets all requirements. label Sep 26, 2022

dognose24 added the [Status] Needs Team Review Obsolete. Use Needs Review instead. label Sep 26, 2022

Merge branch 'trunk' into update/upsell_page

1acf65b

jsnmoon approved these changes Sep 26, 2022

View reviewed changes

jsnmoon enabled auto-merge (squash) September 26, 2022 19:48

oskosk mentioned this pull request Sep 26, 2022

Search: Factor out OldPricingComponent and NewPricingComponent out of UpsellPage component #26453

Merged

2 tasks

oskosk approved these changes Sep 26, 2022

View reviewed changes

jsnmoon merged commit a96a700 into trunk Sep 26, 2022

jsnmoon deleted the update/upsell_page branch September 26, 2022 20:16

github-actions bot removed the [Status] Needs Team Review Obsolete. Use Needs Review instead. label Sep 26, 2022

github-actions bot added this to the search/1.3.0 milestone Sep 26, 2022

jsnmoon mentioned this pull request Sep 26, 2022

JS Components: Use clicks to summon IconTooltip #26457

Merged

2 tasks

dognose24 self-assigned this Sep 27, 2022

jsnmoon mentioned this pull request Oct 3, 2022

Search: Text added to the new pricing table needs to be marked for translation #26594

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Search: Update upsell page for pricing change #26408

Search: Update upsell page for pricing change #26408

Uh oh!

dognose24 commented Sep 23, 2022 •

edited

Loading

Uh oh!

matticbot commented Sep 23, 2022

Uh oh!

github-actions bot commented Sep 23, 2022 •

edited

Loading

Uh oh!

github-actions bot commented Sep 23, 2022 •

edited

Loading

Uh oh!

jsnmoon left a comment

Uh oh!

jsnmoon Sep 23, 2022

Uh oh!

Uh oh!

Uh oh!

jsnmoon left a comment

Uh oh!

oskosk left a comment •

edited

Loading

Uh oh!

github-actions bot commented Sep 26, 2022

Uh oh!

jsnmoon commented Sep 26, 2022

Uh oh!

jsnmoon commented Sep 26, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Search: Update upsell page for pricing change #26408

Search: Update upsell page for pricing change #26408

Uh oh!

Conversation

dognose24 commented Sep 23, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changes proposed in this Pull Request:

Other information:

Jetpack product discussion

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

Testing instructions:

Uh oh!

matticbot commented Sep 23, 2022

Uh oh!

github-actions bot commented Sep 23, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Sep 23, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jsnmoon left a comment

Choose a reason for hiding this comment

Uh oh!

jsnmoon Sep 23, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

jsnmoon left a comment

Choose a reason for hiding this comment

Uh oh!

oskosk left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Sep 26, 2022

Uh oh!

jsnmoon commented Sep 26, 2022

Uh oh!

jsnmoon commented Sep 26, 2022

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

dognose24 commented Sep 23, 2022 •

edited

Loading

github-actions bot commented Sep 23, 2022 •

edited

Loading

github-actions bot commented Sep 23, 2022 •

edited

Loading

oskosk left a comment •

edited

Loading