Issue / 10272 Update PAX Success "Show Me" CTA Link

.github/workflows/compressed-size.yml

@@ -39,6 +39,12 @@ jobs:
           node-version-file: '.nvmrc'
           cache: 'npm'
 
+      # nvm@7 is the minimum version required for npm workspace support.
+      # This is needed to prevent js lint failures due to module resolution to the workspace packages.
+      # This can be removed once our node base version comes with nvm@7 or greater.
+      - name: Install npm Globally
+        run: npm run install-global-npm
+
       - uses: preactjs/compressed-size-action@v2
         with:
           repo-token: '${{ secrets.GITHUB_TOKEN }}'

assets/js/modules/ads/components/notifications/PAXSetupSuccessSubtleNotification.js

@@ -25,48 +25,48 @@ import PropTypes from 'prop-types';
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
+import { useSelect } from '@wordpress/data';
+import { useCallback } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { useDispatch } from 'googlesitekit-data';
 import { CORE_NOTIFICATIONS } from '../../../../googlesitekit/notifications/datastore/constants';
-import { getNavigationalScrollTop } from '../../../../util/scroll';
+import { MODULES_ADS } from '../../datastore/constants';
+import { CORE_USER } from '../../../../googlesitekit/datastore/user/constants';
 import SubtleNotification from '../../../../googlesitekit/notifications/components/layout/SubtleNotification';
 import useQueryArg from '../../../../hooks/useQueryArg';
-import { useBreakpoint } from '../../../../hooks/useBreakpoint';
 import Dismiss from '../../../../googlesitekit/notifications/components/common/Dismiss';
 import CTALinkSubtle from '../../../../googlesitekit/notifications/components/common/CTALinkSubtle';
 
 export default function PAXSetupSuccessSubtleNotification( {
 	id,
 	Notification,
 } ) {
-	const breakpoint = useBreakpoint();
-
 	const { dismissNotification } = useDispatch( CORE_NOTIFICATIONS );
 
 	const [ , setNotification ] = useQueryArg( 'notification' );
 
-	const dismissNotice = () => {
+	const dismissNotice = useCallback( () => {
 		setNotification( undefined );
-	};
-
-	const scrollToWidget = ( event ) => {
-		event.preventDefault();
+	}, [ setNotification ] );
 
-		setTimeout( () => {
-			const widgetClass = '.googlesitekit-widget--partnerAdsPAX';
+	const accountSelectorWrappedAccountOverviewURL = useSelect( ( select ) => {
+		const accountOverviewURL =
+			select( MODULES_ADS ).getAccountOverviewURL();
 
-			global.scrollTo( {
-				top: getNavigationalScrollTop( widgetClass, breakpoint ),
-				behavior: 'smooth',
-			} );
+		if ( !! accountOverviewURL ) {
+			return select( CORE_USER ).getAccountChooserURL(
+				accountOverviewURL
+			);
+		}
+	} );
 
-			dismissNotice();
-			dismissNotification( id );
-		}, 50 );
-	};
+	const onPrimaryCTAClickCallback = useCallback( () => {
+		dismissNotice();
+		dismissNotification( id );
+	}, [ dismissNotice, dismissNotification, id ] );
 
 	return (
 		<Notification>
@@ -91,7 +91,9 @@ export default function PAXSetupSuccessSubtleNotification( {
 					<CTALinkSubtle
 						id={ id }
 						ctaLabel={ __( 'Show me', 'google-site-kit' ) }
-						onCTAClick={ scrollToWidget }
+						ctaLink={ accountSelectorWrappedAccountOverviewURL }
+						onCTAClick={ onPrimaryCTAClickCallback }
+						isCTALinkExternal
 					/>
 				}
 			/>

assets/js/modules/ads/components/setup/SetupMainPAX.js

@@ -100,8 +100,15 @@ export default function SetupMainPAX( { finishSetup } ) {
 	} );
 
 	const { navigateTo } = useDispatch( CORE_LOCATION );
-	const { setPaxConversionID, setExtCustomerID, submitChanges } =
-		useDispatch( MODULES_ADS );
+	const {
+		setPaxConversionID,
+		setCustomerID,
+		setExtCustomerID,
+		setFormattedExtCustomerID,
+		setUserID,
+		setAccountOverviewURL,
+		submitChanges,
+	} = useDispatch( MODULES_ADS );
 
 	useMount( () => {
 		if ( PAX_SETUP_STEP.FINISHED === showPaxAppStep ) {
@@ -128,6 +135,7 @@ export default function SetupMainPAX( { finishSetup } ) {
 		const { accountService, conversionTrackingIdService } =
 			paxAppRef.current.getServices();
 		const customerData = await accountService.getAccountId( {} );
+		const googleAdsURLData = await accountService.getGoogleAdsUrl( {} );
 		const conversionTrackingData =
 			await conversionTrackingIdService.getConversionTrackingId( {} );
 
@@ -138,8 +146,12 @@ export default function SetupMainPAX( { finishSetup } ) {
 			return;
 		}
 
+		setUserID( customerData.userId );
+		setCustomerID( customerData.customerId );
 		setExtCustomerID( customerData.externalCustomerId );
+		setFormattedExtCustomerID( customerData.formattedExternalCustomerId );
 		setPaxConversionID( conversionTrackingData.conversionTrackingId );
+		setAccountOverviewURL( googleAdsURLData.accountOverviewUrl );
 		/* eslint-enable sitekit/acronym-case */
 
 		// Here we save settings right away but leave final navigation to `onSetupComplete`.

assets/js/modules/ads/datastore/base.js

@@ -29,13 +29,23 @@ import {
 } from './settings';
 
 const baseModuleStore = Modules.createModuleStore( 'ads', {
-	ownedSettingsSlugs: [ 'conversionID', 'paxConversionID', 'extCustomerID' ],
+	ownedSettingsSlugs: [
+		'conversionID',
+		'paxConversionID',
+		'extCustomerID',
+		'customerID',
+		'userID',
+	],
 	storeName: MODULES_ADS,
 	settingSlugs: [
 		'conversionID',
 		'ownerID',
 		'paxConversionID',
+		'customerID',
 		'extCustomerID',
+		'formattedExtCustomerID',
+		'userID',
+		'accountOverviewURL',
 	],
 	requiresSetup: true,
 	submitChanges,

includes/Modules/Ads.php

@@ -184,7 +184,7 @@ protected function setup_assets() {
 					'googlesitekit-ads-pax-integrator',
 					array(
 						// When updating, mirror the fixed version for google-pax-sdk in package.json.
-						'src'          => 'https://www.gstatic.com/pax/1.1.0/pax_integrator.js',
+						'src'          => 'https://www.gstatic.com/pax/1.1.3/pax_integrator.js',
 						'execution'    => 'async',
 						'dependencies' => array(
 							'googlesitekit-ads-pax-config',

includes/Modules/Ads/Settings.php

@@ -42,14 +42,19 @@ public function register() {
 	 *
 	 * @since 1.122.0
 	 * @since 1.126.0 Added new settings fields for PAX.
+	 * @since n.e.x.t Added new settings fields for PAX.
 	 *
 	 * @return array An array of default settings values.
 	 */
 	protected function get_default() {
 		return array(
-			'conversionID'    => '',
-			'paxConversionID' => '',
-			'extCustomerID'   => '',
+			'conversionID'           => '',
+			'paxConversionID'        => '',
+			'customerID'             => '',
+			'extCustomerID'          => '',
+			'formattedExtCustomerID' => '',
+			'userID'                 => '',
+			'accountOverviewURL'     => '',
 		);
 	}
 
@@ -58,6 +63,7 @@ protected function get_default() {
 	 *
 	 * @since 1.122.0
 	 * @since 1.126.0 Added new settings fields for PAX.
+	 * @since n.e.x.t Added customerID & userID settings fields for PAX.
 	 *
 	 * @return array An array of keys for owned settings.
 	 */
@@ -66,6 +72,8 @@ public function get_owned_keys() {
 			'conversionID',
 			'paxConversionID',
 			'extCustomerID',
+			'customerID',
+			'userID',
 		);
 	}
 }

package.json

@@ -202,7 +202,7 @@
 		"fs-extra": "^9.0.1",
 		"git-repo-info": "^2.1.1",
 		"glob-to-regexp": "^0.4.1",
-		"google-pax-sdk": "1.1.0",
+		"google-pax-sdk": "1.1.2",
 		"husky": "^3.1.0",
 		"jest": "^26.6.3",
 		"jest-localstorage-mock": "^2.4.2",

tests/phpunit/integration/Modules/Ads/SettingsTest.php

@@ -27,9 +27,13 @@ public function test_get_default() {
 
 		$this->assertEqualSetsWithIndex(
 			array(
-				'conversionID'    => '',
-				'paxConversionID' => '',
-				'extCustomerID'   => '',
+				'conversionID'           => '',
+				'paxConversionID'        => '',
+				'customerID'             => '',
+				'extCustomerID'          => '',
+				'formattedExtCustomerID' => '',
+				'userID'                 => '',
+				'accountOverviewURL'     => '',
 			),
 			get_option( Settings::OPTION )
 		);