Make default payment block plan names dynamic #25397

dsas · 2022-08-05T12:46:04Z

Partly fixes #24074 but a similar change will be needed in Calypso

Changes proposed in this Pull Request:

When adding a new plan, the plan name will update depending upon the payment options selected - whether it's a donation and what the payment frequency is.

This aids users in naming their plans appropriately and reduces the likelihood of having umpteen plans called 'Monthly subscription' when they're nothing of the sort.

If the user explicitly chooses a name then that is respected and not overwritten.

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

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

No

Testing instructions:

Start a JN site or apply the wpcom generated diff from the message below
On a site with a paid plan, go to Gutenberg
Insert a Payment button block
Follow prompts to connect to Stripe
Select the payment button block
Click the plan
In the block inspector (sidebar on the right) fiddle around with the Interval and "Mark this payment plan as a donation" fields and watch the title change
Change the title manually
Fiddle with the fields again, and watch the title not change
Add the plan you created, watch the default plan title change back to be appropriate with the interval / donation fields

Demo

Screen.Capture.on.2022-08-05.at.13-46-55.mp4

When adding a new plan, the plan name will update depending upon the payment options selected - whether it's a donation and what the payment frequency is. This aids users in naming their plans appropriately and reduces the likelihood of having umpteen plans called 'Monthly subscription' when they're nothing of the sort. If the user explicitly chooses a name then that is respected and not overwritten.

matticbot · 2022-08-05T12:46:11Z

Caution: This PR has changes that must be merged to WordPress.com
Hello dsas! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer and confirm D85442-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-08-05T12:47:11Z

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.

Jetpack plugin:

Next scheduled release: September 6, 2022.
Scheduled code freeze: August 30, 2022.

dsas · 2022-08-05T12:50:44Z

...lugins/jetpack/extensions/shared/components/product-management-controls/inspector-control.js

@@ -83,6 +84,15 @@ export default function ProductManagementInspectorControl() {
 		);
 	};

+	useEffect( () => {
+		// If the user has manually selected a title then that should be left as-is, don't overwrite it
+		if ( isCustomTitle ) {


Maybe I could get rid of this state by checking if the current title from the state matches anything that getTitleByProps could return?

Yup, that could work, but it's fine to leave this as-is. The other benefit of getting rid of this state is that if the user undoes their changes and goes back to a default title, we'd be again changing the title according to the type/interval. In other words:

User changes title to "My Subscription"

User changes interval to "Yearly"

User changes title to "Yearly Subscription"

User changes type to "Donation"

The isCustomTitle check would keep the title as "Yearly Subscription", but if replace it with a check against the default values, the title will change to "Yearly Donation".

Anyway, this is an edge case, so feel free to ignore this!

mmtr

This tests well! I left a minor non-blocking comment, but this good to go.

mmtr · 2022-08-05T13:55:54Z

...lugins/jetpack/extensions/shared/components/product-management-controls/inspector-control.js

@@ -83,6 +84,15 @@ export default function ProductManagementInspectorControl() {
 		);
 	};

+	useEffect( () => {
+		// If the user has manually selected a title then that should be left as-is, don't overwrite it
+		if ( isCustomTitle ) {


Yup, that could work, but it's fine to leave this as-is. The other benefit of getting rid of this state is that if the user undoes their changes and goes back to a default title, we'd be again changing the title according to the type/interval. In other words:

User changes title to "My Subscription"

User changes interval to "Yearly"

User changes title to "Yearly Subscription"

User changes type to "Donation"

The isCustomTitle check would keep the title as "Yearly Subscription", but if replace it with a check against the default values, the title will change to "Yearly Donation".

Anyway, this is an edge case, so feel free to ignore this!

github-actions · 2022-08-05T14:28:16Z

Great news! One last step: head over to your WordPress.com diff, D85442-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!

dsas · 2022-08-05T14:32:51Z

Deployed r250190-wpcom

dsas added 2 commits August 5, 2022 13:35

changelog

c88a579

dsas added the [Status] Needs Team Review label Aug 5, 2022

dsas requested a review from a team August 5, 2022 12:46

dsas self-assigned this Aug 5, 2022

matticbot added the Touches WP.com Files label Aug 5, 2022

github-actions bot added the [Plugin] Jetpack Issues about the Jetpack plugin. https://wordpress.org/plugins/jetpack/ label Aug 5, 2022

dsas commented Aug 5, 2022

View reviewed changes

mmtr approved these changes Aug 5, 2022

View reviewed changes

mmtr added this to the jetpack/11.3 milestone Aug 5, 2022

mmtr added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Team Review labels Aug 5, 2022

Merge branch 'trunk' into update/payment-button-product-names

b81ac9c

dsas merged commit 28c2d61 into trunk Aug 5, 2022

dsas deleted the update/payment-button-product-names branch August 5, 2022 14:27

github-actions bot removed the [Status] Ready to Merge Go ahead, you can push that green button! label Aug 5, 2022

This was referenced Aug 5, 2022

Payments: Add visual clues for donation products #24074

Closed

Add default payment block plan name Automattic/wp-calypso#66338

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Make default payment block plan names dynamic #25397

Make default payment block plan names dynamic #25397

dsas commented Aug 5, 2022 •

edited

matticbot commented Aug 5, 2022

github-actions bot commented Aug 5, 2022 •

edited

dsas Aug 5, 2022

mmtr Aug 5, 2022

mmtr left a comment

mmtr Aug 5, 2022

github-actions bot commented Aug 5, 2022

dsas commented Aug 5, 2022

Make default payment block plan names dynamic #25397

Make default payment block plan names dynamic #25397

Conversation

dsas commented Aug 5, 2022 • edited

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:

Demo

matticbot commented Aug 5, 2022

github-actions bot commented Aug 5, 2022 • edited

dsas Aug 5, 2022

Choose a reason for hiding this comment

mmtr Aug 5, 2022

Choose a reason for hiding this comment

mmtr left a comment

Choose a reason for hiding this comment

mmtr Aug 5, 2022

Choose a reason for hiding this comment

github-actions bot commented Aug 5, 2022

dsas commented Aug 5, 2022

dsas commented Aug 5, 2022 •

edited

github-actions bot commented Aug 5, 2022 •

edited