feat(ia): audience checkout/payment and donations wizard #3564

miguelpeixe · 2024-11-21T20:06:19Z

All Submissions:

Have you followed the Newspack Contributing guideline?
Does your code follow the WordPress' coding standards and VIP Go 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:

Implements:

Audience Setup Checkout & Payment tab
Audience Donations wizard

Most of the effort around this PR is decoupling logic from the existing "Reader Revenue" wizard and placing in different sections of the Audience wizard:

Salesforce settings have moved to the Audience Setup tab and should now only render if the publisher already have configured keys for it
Payment gateway configuration and checkout billing fields have moved to the Audience Checkout & Payment tab
Transaction fees have moved to Audience Donation
The Donate block has been updated to use the new API endpoints (see fix(ia): endpoint updates newspack-blocks#1974)

How to test the changes in this Pull Request:

Reset your RAS setup (CLI: wp option delete newspack_reader_activation_enabled)
Navigate to "Audience -> Setup" and confirm the wizard renders as in the image above
Go through each setup step and confirm they work as expected
On the "Reader Revenue" step, confirm that clicking the "Update Reader Revenue settings" button redirects to the Checkout & Payment view with a notification to return to the RAS setup:

Complete the RAS setup
In "Audience -> Setup", scroll down and confirm the Salesforce settings do not render (if you don't have Salesforce settings already)
Add a Salesforce client ID to the database (CLI: wp option update newspack_salesforce_client_id 123), refresh and confirm the Salesforce settings render
Navigate to the Checkout & Payment tab, switch platforms and confirm it behaves as expected
For each platform, tweak the settings, save and refresh the page to confirm the options persist
Navigate to Audience -> Donations and confirm the wizard renders as expected
Tweak the donation options, save and confirm it behaves as expected
Click to edit the donation page (make sure you have fix(ia): endpoint updates newspack-blocks#1974)
Confirm the Donate block render correctly in the editor and you are able to tweak its options
Back to the Audience -> Donations wizard, click the "Revenue" tab and confirm the link redirects to WC's reports admin page

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 ran tests with your changes locally?

miguelpeixe · 2024-11-27T19:14:05Z

includes/class-donations.php

+
+	/**
+	 * Prevent rendering of Donate block if Reader Revenue platform is set to 'other.
+	 *
+	 * @param string $block_content The block content about to be rendered.
+	 * @param array  $block The data of the block about to be rendered.
+	 */
+	public static function prevent_rendering_donate_block( $block_content, $block ) {
+		if (
+			isset( $block['blockName'] )
+			&& 'newspack-blocks/donate' === $block['blockName']
+			&& self::is_platform_other()
+		) {
+			return '';
+		}
+		return $block_content;
+	}


I moved this from the wizard class because it's not relevant for the wizard, it makes more sense to live in the more general Donations class.

miguelpeixe · 2024-11-27T19:16:38Z

src/components/src/handoff-message/index.js

-		// Clean up the notification when unmounting.
-		return () => window.localStorage.removeItem( HANDOFF_KEY );


This was removed because it instantly removed the handoff message when redirecting from a different tab in the same wizard. That happens because it unmounts the component from the origin tab, given it's a rerender on the same react app.

miguelpeixe · 2024-11-27T19:20:14Z

src/components/src/wizard/store/utils.js

-export const useWizardData = ( wizardName, defaultValue = {} ) =>
-	useSelect( select =>
-		select( WIZARD_STORE_NAMESPACE ).getWizardAPIData( `newspack-${ wizardName }-wizard` )
+export const useWizardData = ( wizardName, defaultValue = {} ) => {
+	return useSelect( select =>
+		select( WIZARD_STORE_NAMESPACE ).getWizardAPIData( wizardName )
 	) || defaultValue;
+};


I refactored this util so wizards can have different slugs outside newspack-{slug}-wizard, which is the case across the IA project.

It should now receive the same argument as updateWizardSettings() and saveWizardSettings(), standardizing it when using the store inside components.

miguelpeixe · 2024-11-27T19:21:14Z

src/wizards/audience/components/payment-methods/index.js

-			{ hasPaymentGateway && (
-				<AdditionalSettings
-					settings={ settings }
-				/>
-			) }


Moved to the Audience Donations wizard

miguelpeixe · 2024-11-27T19:22:16Z

src/wizards/audience/views/donations/configuration/index.tsx

@@ -42,43 +43,8 @@ const FREQUENCIES: {
 };
 const FREQUENCY_SLUGS: FrequencySlug[] = Object.keys( FREQUENCIES ) as FrequencySlug[];

-type WizardData = {


Moved to src/wizards/types/hooks.d.ts

miguelpeixe · 2024-11-27T19:23:53Z

src/wizards/syndication/views/intro/index.js

@@ -10,7 +10,7 @@ import { useDispatch } from '@wordpress/data';
 import { PluginToggle, ActionCard, Wizard } from '../../../../components/src';

 const Intro = () => {
-	const settingsData = Wizard.useWizardData( 'settings' );
+	const settingsData = Wizard.useWizardData( 'newspack-settings-wizard' );


This was the only wizard, other than "Reader Revenue", that used the wizard store and had to update to the new useWizardData()

miguelpeixe · 2024-11-27T19:24:31Z

tests/unit-tests/api-wizards-controller.php

-	protected $api_route = '/newspack/v1/wizards/reader-revenue';
+	protected $api_route = '/newspack/v1/wizards/site-design';


Had to change to a different one because reader-revenue no longer exists

jaredrethman

@miguelpeixe thank you for this, a ton of effort went into it.

Functionally it works as described in "How to test the changes in this Pull Request:". I tested+reviewed as thoroughly as I could. Made a few suggestions throughout, nothing too scary.

jaredrethman · 2024-11-27T18:26:12Z

includes/wizards/audience/class-audience-donations.php

+		$wc_configuration_manager = Configuration_Managers::configuration_manager_class_for_plugin_slug( 'woocommerce' );
+		$wc_installed             = 'active' === Plugin_Manager::get_managed_plugin_status( 'woocommerce' );
+		$stripe_data              = Stripe_Connection::get_stripe_data();


Last 3 declarations are unused, can we remove?

Suggested change

$wc_configuration_manager = Configuration_Managers::configuration_manager_class_for_plugin_slug( 'woocommerce' );

$wc_installed = 'active' === Plugin_Manager::get_managed_plugin_status( 'woocommerce' );

$stripe_data = Stripe_Connection::get_stripe_data();

jaredrethman · 2024-11-27T18:36:47Z

includes/wizards/audience/class-audience-donations.php

+ * @package Newspack
+ */
+
+namespace Newspack;


Suggested change

namespace Newspack;

namespace Newspack;

use WP_Error;

jaredrethman · 2024-11-27T19:24:01Z

includes/wizards/audience/class-audience-wizard.php

+	public function get_payment_data() {
+		$platform                 = Donations::get_platform_slug();
+		$wc_configuration_manager = Configuration_Managers::configuration_manager_class_for_plugin_slug( 'woocommerce' );
+		$wc_installed             = 'active' === Plugin_Manager::get_managed_plugin_status( 'woocommerce' );


Is unused.

Suggested change

$wc_installed = 'active' === Plugin_Manager::get_managed_plugin_status( 'woocommerce' );

jaredrethman · 2024-11-27T20:49:38Z

src/wizards/audience/views/donations/index.js

+import { AUDIENCE_DONATIONS_WIZARD_SLUG, NEWSPACK, OTHER } from '../../constants';
+
+const AudienceDonations = () => {
+	const { platform_data, donation_data } = Wizard.useWizardData( 'newspack-audience-donations' );


Suggested change

const { platform_data, donation_data } = Wizard.useWizardData( 'newspack-audience-donations' );

const { platform_data, donation_data } = Wizard.useWizardData( AUDIENCE_DONATIONS_WIZARD_SLUG );

jaredrethman · 2024-11-27T21:39:32Z

src/wizards/audience/components/salesforce/index.js


 const Salesforce = () => {
-	const { salesforce_redirect_url: redirectUrl } = window?.newspack_reader_revenue || {};
+	const { salesforce_redirect_url: redirectUrl } = window?.newspackAudienceDonations || {};


Suggested change

const { salesforce_redirect_url: redirectUrl } = window?.newspackAudienceDonations || {};

const { salesforce_redirect_url: redirectUrl } = window?.newspackAudience || {};

miguelpeixe · 2024-11-28T12:14:22Z

Thank you for the review, @jaredrethman! Quite the diff you went through 🙇

Applied all your suggestions in 8b92d15

jaredrethman

Nice work here @miguelpeixe 🎉 , approved!

feat(ia): audience checkout/payment and donations wizard

dda3a11

miguelpeixe mentioned this pull request Nov 21, 2024

feat(ia): audience donations #3556

Closed

6 tasks

miguelpeixe added 25 commits November 21, 2024 17:17

feat: improve billing fields section integration

832b88d

fix: remove "Emails" and start "Revenue " tab

8419faf

chore: remove unused import

4b02093

feat: move "cover fees"

3244a02

fix: improve NRH settings wizard ui

bcdb00b

chore: move donate block rendering block filter

c0751d6

chore: remove RR wizard

e04818b

chore: remove RR wizard

bc8994d

chore: update and standardize wizard slugs

bac1ac8

fix: css selector

8bd413e

Merge branch 'epic/ia' into feat/ia-audience-donations-2

818c2cf

fix: decouple methods and tweak wizard store

5749aaa

fix: billing fields api endpoint

620dd67

fix: donations configuration wizard

3509fb7

fix: salesforce settings

e3d1a66

fix: payment gatways endpoints

02b79d8

chore: update constant

33e6fa8

chore: update donation wizard data type

8a933f1

feat: revenue tab

0a88421

test: change wizard to test

7d21b9a

fix: campaign wizard regressions

835e0cc

fix: typo

10a45f4

fix: handle wizard loading on wizard tab

136b27e

Merge branch 'epic/ia' into feat/ia-audience-donations-2

9c9c1c8

fix: deprecate Salesforce

c1e5ae7

miguelpeixe mentioned this pull request Nov 27, 2024

fix(ia): endpoint updates Automattic/newspack-blocks#1974

Open

6 tasks

miguelpeixe marked this pull request as ready for review November 27, 2024 13:40

miguelpeixe requested a review from a team as a code owner November 27, 2024 13:40

miguelpeixe self-assigned this Nov 27, 2024

miguelpeixe requested a review from jaredrethman November 27, 2024 13:40

miguelpeixe added the [Status] Needs Review The issue or pull request needs to be reviewed label Nov 27, 2024

miguelpeixe commented Nov 27, 2024

View reviewed changes

jaredrethman requested changes Nov 27, 2024

View reviewed changes

fix: remove unused code and minor tweaks

8b92d15

miguelpeixe requested a review from jaredrethman November 28, 2024 12:14

jaredrethman reviewed Nov 28, 2024

View reviewed changes

miguelpeixe merged commit f8ca397 into epic/ia Nov 29, 2024
8 checks passed

miguelpeixe deleted the feat/ia-audience-donations-2 branch November 29, 2024 11:37

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(ia): audience checkout/payment and donations wizard #3564

feat(ia): audience checkout/payment and donations wizard #3564

miguelpeixe commented Nov 21, 2024 •

edited

Loading

miguelpeixe Nov 27, 2024

miguelpeixe Nov 27, 2024

miguelpeixe Nov 27, 2024

miguelpeixe Nov 27, 2024

miguelpeixe Nov 27, 2024

miguelpeixe Nov 27, 2024

miguelpeixe Nov 27, 2024

jaredrethman left a comment

jaredrethman Nov 27, 2024

jaredrethman Nov 27, 2024

jaredrethman Nov 27, 2024

jaredrethman Nov 27, 2024

jaredrethman Nov 27, 2024

miguelpeixe commented Nov 28, 2024

jaredrethman left a comment

		// Clean up the notification when unmounting.
		return () => window.localStorage.removeItem( HANDOFF_KEY );

		protected $api_route = '/newspack/v1/wizards/reader-revenue';
		protected $api_route = '/newspack/v1/wizards/site-design';

	$wc_configuration_manager = Configuration_Managers::configuration_manager_class_for_plugin_slug( 'woocommerce' );
	$wc_installed = 'active' === Plugin_Manager::get_managed_plugin_status( 'woocommerce' );
	$stripe_data = Stripe_Connection::get_stripe_data();

	const { platform_data, donation_data } = Wizard.useWizardData( 'newspack-audience-donations' );
	const { platform_data, donation_data } = Wizard.useWizardData( AUDIENCE_DONATIONS_WIZARD_SLUG );

	const { salesforce_redirect_url: redirectUrl } = window?.newspackAudienceDonations \|\| {};
	const { salesforce_redirect_url: redirectUrl } = window?.newspackAudience \|\| {};

feat(ia): audience checkout/payment and donations wizard #3564

feat(ia): audience checkout/payment and donations wizard #3564

Conversation

miguelpeixe commented Nov 21, 2024 • edited Loading

All Submissions:

Changes proposed in this Pull Request:

How to test the changes in this Pull Request:

Other information:

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

jaredrethman left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

miguelpeixe commented Nov 28, 2024

jaredrethman left a comment

Choose a reason for hiding this comment

miguelpeixe commented Nov 21, 2024 •

edited

Loading