From b5cf9826d7a23daeee2c3cce90989d82590acdee Mon Sep 17 00:00:00 2001 From: Vlad Olaru Date: Tue, 2 Jul 2024 18:45:27 +0300 Subject: [PATCH] Update WCPay Tracks events props (#48901) * Add path and source props to incentive CTA clicked Tracks event * Minor inline docs fixes * Fix wording mistake * Add from param to Payments settings CTA URL * Add from param to incentive CTA URL * refact: Clearer logic for incentive page tracking * Add changelog * Fix incentives page tests --- .../client/payments-welcome/index.tsx | 33 +++++++++++++++++-- .../test/connect-account-page.test.tsx | 3 ++ .../components/WCPay/Suggestion.js | 4 +-- .../task-lists/fills/woocommerce-payments.tsx | 2 +- .../update-wcpay-tracks-events-props | 5 +++ .../class-wc-settings-payment-gateways.php | 13 +++++--- 6 files changed, 49 insertions(+), 11 deletions(-) create mode 100644 plugins/woocommerce/changelog/update-wcpay-tracks-events-props diff --git a/plugins/woocommerce-admin/client/payments-welcome/index.tsx b/plugins/woocommerce-admin/client/payments-welcome/index.tsx index 9876e50d53f..92f9377a597 100644 --- a/plugins/woocommerce-admin/client/payments-welcome/index.tsx +++ b/plugins/woocommerce-admin/client/payments-welcome/index.tsx @@ -37,10 +37,29 @@ const ConnectAccountPage = () => { 'admin.php?wcpay-connect=1&promo=' + encodeURIComponent( incentive.id ) + '&_wpnonce=' + - getAdminSetting( 'wcpay_welcome_page_connect_nonce' ), + getAdminSetting( 'wcpay_welcome_page_connect_nonce' ) + + '&from=WCADMIN_PAYMENT_INCENTIVE', }; } ); + const determineTrackingSource = () => { + const urlParams = new URLSearchParams( window.location.search ); + const from = urlParams.get( 'from' ) || ''; + + // Determine where the user came from. + let source = 'wcadmin'; + switch ( from ) { + case 'WCADMIN_PAYMENT_TASK': + source = 'wcadmin-payment-task'; + break; + case 'WCADMIN_PAYMENT_SETTINGS': + source = 'wcadmin-settings-page'; + break; + } + + return source; + }; + /** * Record page view and save viewed timestamp. */ @@ -48,6 +67,7 @@ const ConnectAccountPage = () => { recordEvent( 'page_view', { path: 'payments_connect_core_test', incentive_id: incentive.id, + source: determineTrackingSource(), } ); updateOptions( { wcpay_welcome_page_viewed_timestamp: Math.floor( @@ -68,12 +88,19 @@ const ConnectAccountPage = () => { } }; - const handleSetup = async () => { - setSubmitted( true ); + const trackConnectAccountClicked = () => { recordEvent( 'wcpay_connect_account_clicked', { wpcom_connection: isJetpackConnected ? 'Yes' : 'No', incentive_id: incentive.id, + path: 'payments_connect_core_test', + source: determineTrackingSource(), } ); + }; + + const handleSetup = async () => { + setSubmitted( true ); + + trackConnectAccountClicked(); const pluginsToInstall = [ ...enabledApms ].map( ( apm ) => apm.extension diff --git a/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx b/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx index 8bd05af1190..a92d7abcc7e 100644 --- a/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx +++ b/plugins/woocommerce-admin/client/payments-welcome/test/connect-account-page.test.tsx @@ -61,6 +61,7 @@ describe( 'Connect Account Page', () => { expect( recordEvent ).toHaveBeenCalledWith( 'page_view', { path: 'payments_connect_core_test', incentive_id: 'incentiveId', + source: 'wcadmin', } ); } ); @@ -73,6 +74,8 @@ describe( 'Connect Account Page', () => { { wpcom_connection: 'Yes', incentive_id: 'incentiveId', + path: 'payments_connect_core_test', + source: 'wcadmin', } ); } ); diff --git a/plugins/woocommerce-admin/client/task-lists/fills/PaymentGatewaySuggestions/components/WCPay/Suggestion.js b/plugins/woocommerce-admin/client/task-lists/fills/PaymentGatewaySuggestions/components/WCPay/Suggestion.js index 42c22ae871c..8e9115dc593 100644 --- a/plugins/woocommerce-admin/client/task-lists/fills/PaymentGatewaySuggestions/components/WCPay/Suggestion.js +++ b/plugins/woocommerce-admin/client/task-lists/fills/PaymentGatewaySuggestions/components/WCPay/Suggestion.js @@ -31,10 +31,10 @@ export const Suggestion = ( { paymentGateway, onSetupCallback = null } ) => { const isWooPayEligible = getAdminSetting( 'isWooPayEligible' ); const { createNotice } = useDispatch( 'core/notices' ); - // When the WC Pay is installed and onSetupCallback is null + // When WCPay is installed and onSetupCallback is null // Overwrite onSetupCallback to redirect to the setup page // when the user clicks on the "Finish setup" button. - // WC Pay doesn't need to be configured in WCA. + // WCPay doesn't need to be configured in WCA. // It should be configured in its onboarding flow. if ( installed && onSetupCallback === null ) { onSetupCallback = () => { diff --git a/plugins/woocommerce-admin/client/task-lists/fills/woocommerce-payments.tsx b/plugins/woocommerce-admin/client/task-lists/fills/woocommerce-payments.tsx index c5bf53e71cc..336c60e0cc8 100644 --- a/plugins/woocommerce-admin/client/task-lists/fills/woocommerce-payments.tsx +++ b/plugins/woocommerce-admin/client/task-lists/fills/woocommerce-payments.tsx @@ -30,7 +30,7 @@ const WoocommercePaymentsTaskItem = () => { } ) => JSX.Element; } ) => ( { return new Promise( ( resolve, reject ) => { return installActivateAndConnectWcpay( diff --git a/plugins/woocommerce/changelog/update-wcpay-tracks-events-props b/plugins/woocommerce/changelog/update-wcpay-tracks-events-props new file mode 100644 index 00000000000..9e65194d5d1 --- /dev/null +++ b/plugins/woocommerce/changelog/update-wcpay-tracks-events-props @@ -0,0 +1,5 @@ +Significance: patch +Type: tweak +Comment: Minor updates to WooPayments incentives page tracking props. + + diff --git a/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php b/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php index c1a87f08210..eab842d6f16 100644 --- a/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php +++ b/plugins/woocommerce/includes/admin/settings/class-wc-settings-payment-gateways.php @@ -189,17 +189,20 @@ class WC_Settings_Payment_Gateways extends WC_Settings_Page { break; case 'action': $setup_url = admin_url( 'admin.php?page=wc-settings&tab=checkout§ion=' . strtolower( $gateway->id ) ); - // Override the behaviour for WooPayments plugin. + // Override the behaviour for the WooPayments plugin. if ( // Keep old brand name for backwards compatibility. ( 'WooCommerce Payments' === $method_title || 'WooPayments' === $method_title ) && class_exists( 'WC_Payments_Account' ) ) { if ( ! WooCommercePayments::is_connected() || WooCommercePayments::is_account_partially_onboarded() ) { - // The CTA text and label is "Finish set up" if the account is not connected or not completely onboarded. - $setup_url = WC_Payments_Account::get_connect_url(); // Plugin will handle the redirection to the connect page or directly to the provider (e.g. Stripe). + // The CTA text and label is "Finish setup" if the account is not connected or not completely onboarded. + // Plugin will handle the redirection to the connect page or directly to the provider (e.g. Stripe). + $setup_url = WC_Payments_Account::get_connect_url(); + // Add the `from` parameter to the URL, so we know where the user came from. + $setup_url = add_query_arg( 'from', 'WCADMIN_PAYMENT_SETTINGS', $setup_url ); /* Translators: %s Payment gateway name. */ - echo '' . esc_html__( 'Finish set up', 'woocommerce' ) . ''; + echo '' . esc_html__( 'Finish setup', 'woocommerce' ) . ''; } else { // If the account is fully onboarded, the CTA text and label is "Manage" regardless gateway is enabled or not. /* Translators: %s Payment gateway name. */ @@ -210,7 +213,7 @@ class WC_Settings_Payment_Gateways extends WC_Settings_Page { echo '' . esc_html__( 'Manage', 'woocommerce' ) . ''; } else { /* Translators: %s Payment gateway name. */ - echo '' . esc_html__( 'Finish set up', 'woocommerce' ) . ''; + echo '' . esc_html__( 'Finish setup', 'woocommerce' ) . ''; } break; case 'status':