Add WooCommerce > Subscriptions admin menu item and empty state offer screen #32957

james-allan · 2022-05-11T05:32:40Z

All Submissions:

Have you followed the WooCommerce Contributing guideline?
Does your code follow the WordPress' coding standards?
Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

Internal project: pdjTHR-Vi-p2

This PR adds a Subscriptions item to the WooCommerce admin menu for eligible stores * . This admin screen is part of an experiment to offer eligible merchants WooCommerce Payments built in Subscriptions functionality.

* eligible stores are stores without any subscriptions functionality plugin installed, are older than 6 months and have at least 1 sale in the last 30 days.

Closes #32682
Closes #32691
Closes #32694

This PR is made up of the following PRs:

How to test the changes in this Pull Request:

Checkout this branch and build assets by running pnpm nx watch woocommerce-admin or grab a zip of this PR here → woocommerce.zip
Plugin eligibility: Ensure the following plugins are not installed at all:
- WooCommerce Subscriptions
- WooCommerce Payments
- Sumo Subscriptions
- Yith Subscriptions
- Subscripto
- Subscriptions For WooCommerce
Store tracking eligibility: Your store allows tracking.
- This checkbox should be checked: WooCommerce → Settings → Advanced → WooCommerce.com → Enable tracking.
Store location eligibility: For the menu item to be displayed your store needs to based in the US.
- Go to WooCommerce > Settings and make sure your store is set to a US based address.
Store age criteria: To view the subscription menu item your store will need to have been active for more than 6 months - we're testing this experiment on established stores. If your store doesn't meet this criteria, you can use the following code snippet:
- update_option( 'woocommerce_admin_install_timestamp', strtotime( '-6 month' ) );
- or change the woocommerce_admin_install_timestamp option to 1620866357 (timestamp from ~1 year ago) via the /wp-admin/options.php page.
Paid order criteria: Only stores with at least 1 order in the last 30 days are eligible. If your store doesn't have an order in the last 30 days. Either:
1. Set any existing pending or failed order to processing or completed
2. If you don't have any order at all, you can just manually create one in WooCommerce > Orders > Add new and set it to processing or completed status
3. ⚠️ Note: this order sale query is cached and so you may need to delete the 'woocommerce-wcpay-subscriptions_recent_sales_eligibility' transient if this criteria failed previously.
If you meet all the criteria above you should see a WooCommerce > Subscriptions (new) menu item.
View the WooCommerce > Subscriptions (new) page.
- The 'new' badge should disappear on subsequent page loads.

The error scenario

If an error occurs during plugin installation and activation an error message will be displayed directing the user to install the WooCommerce Payments plugin manually.

To test this flow:

Add the following code snippet to your site.
Go to WooCommerce -> Subscriptions
Click "Get started"
An error should occur installing the plugin. See example below.

define( 'DISALLOW_FILE_MODS', true );

❗Note: The link takes the user to the WooCommerce Payments wp.org page.

The success scenario

Go to WooCommerce > Subscriptions
Click "Get started"
WooCommerce Payments will be installed and activated in the background
Once complete, you will be directed to the “Add new product” page or to the WCPay onboarding flow depending on which experiment treatment you were assigned to. Please see the "Testing the treatments" section below for more instructions.

The dismiss scenario

Go to WooCommerce > Subscriptions
Click "No thanks"
You should be redirected to the WooCommerce > Home screen and the subscriptions menu item should no longer be displayed.

Note: If you need to bring the menu item back, delete or change the woocommerce-wcpay-subscriptions_dismissed wp option.

Testing the treatments

Download, install and activate the WooCommerce Admin Test Helper plugin.

Navigate to Tools → WCA Test Helper → Experiments. This page should contain a row for the "woocommerce_wcpay_subscriptions_page_202207_v1" experiment.

Here you can toggle between the control (treatment A) and the treatment (treatment B).

Treatment A

Toggle to the control experience from Tools → WCA Test Helper → Experiments.
Navigate to WooCommerce → Subscriptions.
Observe the following step headers in the "You’re only steps away from selling subscriptions" section.
1. Create a subscription
2. Create and connect your account
3. Provide a few business details
Click the "Get started" button.
The WooCommerce Payments plugin will be installed & activated and you will be redirected to the “Add new product” page.

Treatment B

Toggle to the treatment experience from Tools → WCA Test Helper → Experiments.
Navigate to WooCommerce → Subscriptions.
Observe the following step headers in the "You’re only steps away from selling subscriptions" section.
1. Create and connect your account
2. Provide a few business details
3. Create subscriptions
Click the "Get started" button.
The WooCommerce Payments plugin will be installed & activated and you will be redirected to the WCPay onboarding flow.

--

Other information:

Have you added an explanation of what your changes do and why you'd like us to include them?
Have you written new tests for your changes, as applicable?
Have you successfully run tests with your changes locally?
Have you created a changelog file for each project being changed, ie pnpm nx changelog <project>?

FOR PR REVIEWER ONLY:

I have reviewed that everything is sanitized/escaped appropriately for any SQL or XSS injection possibilities. I made sure Linting is not ignored or disabled.

…ptions page

…eriment-subscriptions-admin-menu-1

…ll path

…ns-error-notice Display an error message when WC Payments fails to install via the Subscriptions menu item

…iment-subscriptions-admin-menu-1

…eriment-subscriptions-admin-new-design

Co-authored-by: James Allan <[email protected]>

…ns-admin-new-design Implement the new subscriptions page design

…steps component.

…ns-admin-menu-experiment-framework Add experiment functionality to the WooCommerce → Subscriptions page

botwoo · 2022-05-16T12:59:04Z

📊 Test reports for this pull request have been published and are accessible through the following links:

REST API Test Report
E2E Test Report (TBC)

Latest commit referenced in the reports: Introduce susbcriptions menu item slug constant 3cecb3d
This comment will automatically be updated with the latest referenced commit when you push new changes to this pull request.

Visit the WooCommerce Test Reports homepage to view all published reports. See the FAQs page if you're having problems accessing them.

botwoo · 2022-05-17T03:40:22Z

📊 Test reports for 0afc9dd Merge branch 'trunk' into add/experiment-subscriptions-admin-menu-1 have been published and are accessible through the following links:

REST API Test Report
E2E Test Report (TBC)

Visit the WooCommerce Test Reports homepage to view all published reports. See the FAQs page if you're having problems accessing them.

plugins/woocommerce-admin/client/subscriptions/index.tsx

plugins/woocommerce-admin/client/layout/controller.js

vedanshujain

Testing well, added a few questions, though. Thanks!

vedanshujain · 2022-05-18T07:09:47Z

plugins/woocommerce/src/Internal/Admin/WcPaySubscriptionsPage.php

+		add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
+
+		// Priority 50 to run after Automattic\WooCommerce\Internal\Admin\Homescreen::update_link_structure() which runs on 20.
+		add_action( 'admin_menu', array( $this, 'restructure_menu_order' ), 50 );


if this should always be called after Admin\Homescreen::update_link_structure, it might be better to call this directly. There could be other menu items interfering between priority 20 from update_link_structure and 50 here.

Just to clarify, you recommend we call our function to move the subscriptions menu item (WcPaySubscriptionsPage::restructure_menu_order()) to be called directly from within the (Admin\Homescreen::update_link_structure()) function?

We can definitely do that however the Admin\Homescreen class specifically handles the "Home" menu item and so it would be additional code clutter for it to also be calling a function directly to wrangle another menu item.

There could be other menu items interfering between priority 20 from update_link_structure and 50 here.

I don't think this is a big concern for us if this were to happen. We'd prefer that this "Subscriptions" menu item has consistant placement with the WooCommerce Subscriptions "subscriptions" menu item, however, if something was to interfere and move it further down or up we wouldn't be too concerned. I'd be more concerned about a less cleaner code separation tbh given this is an experiment.

plugins/woocommerce/src/Internal/Admin/WcPaySubscriptionsPage.php

vedanshujain · 2022-05-18T07:29:34Z

plugins/woocommerce/src/Internal/Admin/WcPaySubscriptionsPage.php

+			'title'      => _x( 'Subscriptions', 'Admin menu name', 'woocommerce' ),
+			'parent'     => 'woocommerce',
+			'path'       => '/subscriptions',
+			'capability' => 'manage_options',


should this be manage_woocommerce?

The new "Subscriptions" admin page has a "Get started" button that, when clicked, will install and activate the WooCommerce Payments plugin on the site. The user must then complete WCPay onboarding (Stripe KYC).

So this capability needs to be permissive enough to allow them to complete these actions.

I just checked the manage_woocommerce capability and I don't think it'll work here as it's granted to the Shop Manager role. This role does not have the required activate_plugins or install_plugins capabilities. (ref)

plugins/woocommerce/src/Internal/Admin/WcPaySubscriptionsPage.php

Using these two order properties instead of the paid_date field is more performance friendly as both fields are in the wp-posts table - not in the post_meta table. ref: https://github.com/woocommerce/woocommerce/pull/32957/files/71e9657e52d7d6c8bee863ca064bb2153ee11798#r875545984

aprea · 2022-05-19T01:58:29Z

Hi @vedanshujain, apologies for the late notice but we were hoping to have this PR merged in time for the WC 6.6. code freeze (Thursday 4pm UTC).

Would you be able to approve/merge this PR assuming there's no additional blocking feedback?

/cc @haszari

github-actions · 2022-05-19T03:02:33Z

Hi @vedanshujain, thanks for merging this pull request. Please take a look at these follow-up tasks you may need to perform:

Add the release: add testing instructions label

Chris Aprea and others added 30 commits April 22, 2022 16:11

Add plumbing to render the "Subscription" admin menu item and page.

b6bc8d5

Added placeholder content.

56ac948

Install WCPay on button click.

a289b11

Add tracking on button click.

49e754b

Hide the notifications badge when admin have viewed the WCPay Subscri…

2b9c926

…ptions page

Reorder the WC menu items to place subscriptions after orders

f9eb025

Merge branch 'add/experiment-subscriptions-admin-menu-2' into add/exp…

7b36d7f

…eriment-subscriptions-admin-menu-1

Enqueue an inline script.

0942a8b

Display an error message when WC Payments fails to install

a1aff10

Add method to check WcPaySubscriptionsPage eligibility

0947b40

Direct the user to the wp.org wcpayments page for a more direct insta…

6b7fd14

…ll path

Reword the error message to be more action -> outcome structure

b15cfd3

Add store activation date eligibility criteria

bfa9721

Replace translation domains from woocommerce-payments to woocommerce

49f5f78

Merge pull request #32852 from woocommerce/add/experiment-subscriptio…

9b7b574

…ns-error-notice Display an error message when WC Payments fails to install via the Subscriptions menu item

Fix recent sales query, restrict to completed orders

f9fd51e

Fix store base location eligibility check to limit to USA

b32a8f4

Change plugin eligibility to check for installed plugins

e36c5d3

Reduce recent sales query scope to improve performance

0eb8d95

Implement the new subscriptions page design

7add4dc

Merge branch 'add/experiment-subscriptions-admin-menu' into add/exper…

77cc1f6

…iment-subscriptions-admin-menu-1

Merge branch 'add/experiment-subscriptions-admin-menu-1' into add/exp…

c92bc4b

…eriment-subscriptions-admin-new-design

Add sumosubscriptions to plugin eligibility check

8beed46

Add subscriptio to plugin eligibility check

d77f000

Add xa-woocommerce-subscriptions to plugin eligibility check

dbe0f5f

Co-authored-by: James Allan <[email protected]>

Fix typo.

b223ed2

Fix font weight.

f34fcab

Fix recent sales query to allow orders without completed status

48ead02

Merge pull request #32875 from woocommerce/add/experiment-subscriptio…

0a5c10f

…ns-admin-new-design Implement the new subscriptions page design

Cache recent sales eligibility to reduce excessive DB queries

3d68850

james-allan assigned Jinksi and james-allan May 11, 2022

Chris Aprea added 5 commits May 11, 2022 17:04

Merge branch 'trunk' into add/experiment-subscriptions-admin-menu-1

aa8835b

Tidy up experiment code and conditional rendering for the onboarding …

022c60f

…steps component.

Hardcode experiment name.

c6836e2

Copy changes and remove console log

3e1d7ac

Merge pull request #32958 from woocommerce/add/experiment-subscriptio…

1fa3060

…ns-admin-menu-experiment-framework Add experiment functionality to the WooCommerce → Subscriptions page

Merge branch 'trunk' into add/experiment-subscriptions-admin-menu-1

0afc9dd

aprea added this to the 6.6.0 milestone May 17, 2022

aprea requested review from a team and vedanshujain and removed request for a team May 17, 2022 09:59

joshuatf reviewed May 17, 2022

View reviewed changes

Chris Aprea and others added 3 commits May 18, 2022 09:21

Only register the the subscriptions page if tracking is allowed

0cd63cf

Rename component class names with BEM standard names

9166928

Fix typo

71e9657

vedanshujain reviewed May 18, 2022

View reviewed changes

Chris Aprea and others added 3 commits May 19, 2022 10:11

Only add the inline script if the store is eligible for the experiment

98e23a8

Introduce susbcriptions menu item slug constant

3cecb3d

aprea approved these changes May 19, 2022

View reviewed changes

vedanshujain merged commit 5ab229d into trunk May 19, 2022

vedanshujain deleted the add/experiment-subscriptions-admin-menu-1 branch May 19, 2022 03:02

vedanshujain added the release: add testing instructions PRs that have not had testing instructions added to the wiki. [auto] label May 19, 2022

aprea mentioned this pull request Aug 11, 2022

Remove the WCPay Subscriptions offer page experiment code #34275

Closed

Jinksi mentioned this pull request Aug 15, 2022

Remove WCPay Subscriptions offer page experiment code #34317

Merged

8 tasks

Add WooCommerce > Subscriptions admin menu item and empty state offer screen #32957

Add WooCommerce > Subscriptions admin menu item and empty state offer screen #32957

Uh oh!

Conversation

james-allan commented May 11, 2022 • edited by aprea Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

All Submissions:

Changes proposed in this Pull Request:

How to test the changes in this Pull Request:

The error scenario

The success scenario

The dismiss scenario

Testing the treatments

Treatment A

Treatment B

Other information:

FOR PR REVIEWER ONLY:

Uh oh!

botwoo commented May 16, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

botwoo commented May 17, 2022

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

vedanshujain left a comment

Choose a reason for hiding this comment

Uh oh!

vedanshujain May 18, 2022

Choose a reason for hiding this comment

Uh oh!

james-allan May 19, 2022 • 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!

Uh oh!

vedanshujain May 18, 2022

Choose a reason for hiding this comment

Uh oh!

aprea May 18, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

aprea commented May 19, 2022

Uh oh!

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

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

james-allan commented May 11, 2022 •

edited by aprea

Loading

botwoo commented May 16, 2022 •

edited

Loading

james-allan May 19, 2022 •

edited

Loading

github-actions bot commented May 19, 2022 •

edited by vedanshujain

Loading