Merge pull request #2187 from woocommerce/release/2.5.14

Release 2.5.14

.github/workflows/php-unit-tests.yml

@@ -50,19 +50,16 @@ jobs:
       WP_TESTS_DIR: "/tmp/wordpress/tests/phpunit"
     strategy:
       matrix:
-        php: [ 8.0 ]
+        php: [ 8.2 ]
         wp-version: [ latest ]
         wc-versions: ${{ fromJson(needs.GetMatrix.outputs.wc-versions) }}
         include:
-          - php: 8.2
+          - php: 8.3
             wp-version: latest
             wc-versions: latest
           - php: 7.4
             wp-version: ${{ fromJson(needs.GetMatrix.outputs.wp-versions)[2] }} # L-2 WP Version support
             wc-versions: ${{ fromJson(needs.GetMatrix.outputs.wc-versions)[2] }} # L-2 WC Version support
-          - php: 8.1
-            wp-version: latest
-            wc-versions: latest
 
     steps:
       - name: Checkout repository
@@ -79,7 +76,7 @@ jobs:
       - name: Install WP tests
         run: ./bin/install-wp-tests.sh wordpress_test root root localhost ${{ matrix.wp-version }} ${{ matrix.wc-versions }}
 
-      - if: matrix.wc-versions == needs.GetMatrix.outputs.latest-wc-version && matrix.php == 8.0
+      - if: matrix.wc-versions == needs.GetMatrix.outputs.latest-wc-version && matrix.php == 8.2
         name: Set condition to generate coverage report (only on latest versions)
         run: echo "generate_coverage=true" >> $GITHUB_ENV
 

changelog.txt

@@ -1,5 +1,12 @@
 *** WooCommerce Google Listings and Ads Changelog ***
 
+= 2.5.14 - 2023-12-18 =
+* Dev - Include PHP 8.3 in tested versions for PHPunit.
+* Fix - Item price in purchase event.
+* Tweak - Track Budgets and Audience in Onboarding.
+* Tweak - WC 8.4 compatibility.
+* Update - Change to require Google Ads connection during the onboarding.
+
 = 2.5.13 - 2023-12-06 =
 * Fix - Change Budget Recommendations values.
 * Tweak - Use a single daily budget instead of a range.

google-listings-and-ads.php

@@ -3,7 +3,7 @@
  * Plugin Name: Google Listings and Ads
  * Plugin URL: https://wordpress.org/plugins/google-listings-and-ads/
  * Description: Native integration with Google that allows merchants to easily display their products across Google’s network.
- * Version: 2.5.13
+ * Version: 2.5.14
  * Author: WooCommerce
  * Author URI: https://woo.com/
  * Text Domain: google-listings-and-ads
@@ -13,7 +13,7 @@
  * Requires PHP Architecture: 64 bits
  *
  * WC requires at least: 6.9
- * WC tested up to: 8.3
+ * WC tested up to: 8.4
  * Woo:
  *
  * @package WooCommerce\Admin
@@ -30,7 +30,7 @@
 
 defined( 'ABSPATH' ) || exit;
 
-define( 'WC_GLA_VERSION', '2.5.13' ); // WRCS: DEFINED_VERSION.
+define( 'WC_GLA_VERSION', '2.5.14' ); // WRCS: DEFINED_VERSION.
 define( 'WC_GLA_MIN_PHP_VER', '7.4' );
 define( 'WC_GLA_MIN_WC_VER', '6.9' );
 

js/src/components/paid-ads/campaign-preview/mockup-search.js

@@ -48,7 +48,7 @@ export default function MockupSearch( { product } ) {
 					</ScaledText>
 					<Placeholder stroke="thinner" width="79" color="blue" />
 				</div>
-				<Flex justfy="space-between" align="stretch">
+				<Flex align="stretch">
 					<div className="gla-ads-mockup__search-card-placeholders">
 						<Placeholder width="100" />
 						<Placeholder width="97" />

js/src/hooks/useGoogleAdsAccount.js

@@ -9,6 +9,7 @@ import { useCallback } from '@wordpress/element';
  */
 import { STORE_KEY } from '.~/data/constants';
 import { useAppDispatch } from '.~/data';
+import { GOOGLE_ADS_ACCOUNT_STATUS } from '.~/constants';
 import useGoogleAccount from './useGoogleAccount';
 
 const googleAdsAccountSelector = 'getGoogleAdsAccount';
@@ -36,13 +37,23 @@ const useGoogleAdsAccount = () => {
 				googleAdsAccountSelector
 			);
 
+			// The "incomplete" status means there is a connected account but billing is not yet set
+			// so it's considered as `true`.
+			// The main reason for not using a naming like `isGoogleAdsConnected` here is to make
+			// a slight distinction from the "connected" status.
+			const hasGoogleAdsConnection = [
+				GOOGLE_ADS_ACCOUNT_STATUS.CONNECTED,
+				GOOGLE_ADS_ACCOUNT_STATUS.INCOMPLETE,
+			].includes( acc?.status );
+
 			return {
 				googleAdsAccount: acc,
 				isResolving: isResolvingGoogleAdsAccount,
 				refetchGoogleAdsAccount,
 				hasFinishedResolution: selector.hasFinishedResolution(
 					googleAdsAccountSelector
 				),
+				hasGoogleAdsConnection,
 			};
 		},
 		[ google, isResolving, refetchGoogleAdsAccount ]

js/src/setup-mc/setup-stepper/setup-paid-ads/paid-ads-features-section.js

@@ -15,7 +15,7 @@ import AppDocumentationLink from '.~/components/app-documentation-link';
 import CampaignPreview from '.~/components/paid-ads/campaign-preview';
 import './paid-ads-features-section.scss';
 
-function FeatureList() {
+function FeatureList( { hideBudgetContent } ) {
 	const featuresItems = [
 		{
 			Icon: GridiconCheckmark,
@@ -24,22 +24,27 @@ function FeatureList() {
 				'google-listings-and-ads'
 			),
 		},
-		{
-			Icon: GridiconCheckmark,
-			content: __(
-				'Set a daily budget, and only pay when someone clicks.',
-				'google-listings-and-ads'
-			),
-		},
-		{
-			Icon: GridiconGift,
-			content: __(
-				'Claim $500 in ads credit when you spend your first $500 with Google Ads. Terms and conditions apply.',
-				'google-listings-and-ads'
-			),
-		},
 	];
 
+	if ( ! hideBudgetContent ) {
+		featuresItems.push(
+			{
+				Icon: GridiconCheckmark,
+				content: __(
+					'Set a daily budget, and only pay when someone clicks.',
+					'google-listings-and-ads'
+				),
+			},
+			{
+				Icon: GridiconGift,
+				content: __(
+					'Claim $500 in ads credit when you spend your first $500 with Google Ads. Terms and conditions apply.',
+					'google-listings-and-ads'
+				),
+			}
+		);
+	}
+
 	return (
 		<div className="gla-paid-ads-features-section__feature-list">
 			{ featuresItems.map( ( { Icon, content }, idx ) => (
@@ -61,11 +66,13 @@ function FeatureList() {
  * for the next actions: skip or continue the paid ads setup.
  *
  * @param {Object} props React props.
+ * @param {boolean} props.hideBudgetContent Whether to hide the content about the ad budget.
  * @param {boolean} props.hideFooterButtons Whether to hide the buttons at the card footer.
  * @param {JSX.Element} props.skipButton Button to skip paid ads setup.
  * @param {JSX.Element} props.continueButton Button to continue paid ads setup.
  */
 export default function PaidAdsFeaturesSection( {
+	hideBudgetContent,
 	hideFooterButtons,
 	skipButton,
 	continueButton,
@@ -120,7 +127,9 @@ export default function PaidAdsFeaturesSection( {
 									'google-listings-and-ads'
 								) }
 							</div>
-							<FeatureList />
+							<FeatureList
+								hideBudgetContent={ hideBudgetContent }
+							/>
 							<cite className="gla-paid-ads-features-section__cite">
 								{ __(
 									'Source: Google Internal Data, July 2020',

js/src/setup-mc/setup-stepper/setup-paid-ads/paid-ads-setup-sections.js

@@ -11,16 +11,14 @@ import { Form } from '@woocommerce/components';
 import useGoogleAdsAccount from '.~/hooks/useGoogleAdsAccount';
 import useTargetAudienceFinalCountryCodes from '.~/hooks/useTargetAudienceFinalCountryCodes';
 import useGoogleAdsAccountBillingStatus from '.~/hooks/useGoogleAdsAccountBillingStatus';
-import GoogleAdsAccountSection from './google-ads-account-section';
 import AudienceSection from '.~/components/paid-ads/audience-section';
 import BudgetSection from '.~/components/paid-ads/budget-section';
 import BillingCard from '.~/components/paid-ads/billing-card';
+import SpinnerCard from '.~/components/spinner-card';
+import Section from '.~/wcdl/section';
 import validateCampaign from '.~/components/paid-ads/validateCampaign';
 import clientSession from './clientSession';
-import {
-	GOOGLE_ADS_ACCOUNT_STATUS,
-	GOOGLE_ADS_BILLING_STATUS,
-} from '.~/constants';
+import { GOOGLE_ADS_BILLING_STATUS } from '.~/constants';
 
 /**
  * @typedef { import(".~/data/actions").CountryCode } CountryCode
@@ -77,7 +75,7 @@ function resolveInitialPaidAds( paidAds, targetAudience ) {
  * @param {(onStatesReceived: PaidAdsData)=>void} props.onStatesReceived Callback to receive the data for setting up paid ads when initial and also when the audience, budget, and billing are updated.
  */
 export default function PaidAdsSetupSections( { onStatesReceived } ) {
-	const { googleAdsAccount } = useGoogleAdsAccount();
+	const { hasGoogleAdsConnection } = useGoogleAdsAccount();
 	const { data: targetAudience } = useTargetAudienceFinalCountryCodes();
 	const { billingStatus } = useGoogleAdsAccountBillingStatus();
 
@@ -135,7 +133,11 @@ export default function PaidAdsSetupSections( { onStatesReceived } ) {
 	}, [ targetAudience ] );
 
 	if ( ! targetAudience || ! billingStatus ) {
-		return <GoogleAdsAccountSection />;
+		return (
+			<Section>
+				<SpinnerCard />
+			</Section>
+		);
 	}
 
 	const initialValues = {
@@ -153,16 +155,12 @@ export default function PaidAdsSetupSections( { onStatesReceived } ) {
 		>
 			{ ( formProps ) => {
 				const { countryCodes } = formProps.values;
-				const disabledAudience = ! [
-					GOOGLE_ADS_ACCOUNT_STATUS.CONNECTED,
-					GOOGLE_ADS_ACCOUNT_STATUS.INCOMPLETE,
-				].includes( googleAdsAccount?.status );
+				const disabledAudience = ! hasGoogleAdsConnection;
 				const disabledBudget =
 					disabledAudience || countryCodes.length === 0;
 
 				return (
 					<>
-						<GoogleAdsAccountSection />
 						<AudienceSection
 							formProps={ formProps }
 							disabled={ disabledAudience }

js/src/setup-mc/setup-stepper/setup-paid-ads/setup-paid-ads.js

@@ -13,13 +13,15 @@ import { noop, merge } from 'lodash';
  */
 import useAdminUrl from '.~/hooks/useAdminUrl';
 import useDispatchCoreNotices from '.~/hooks/useDispatchCoreNotices';
+import useGoogleAdsAccount from '.~/hooks/useGoogleAdsAccount';
 import useAdsSetupCompleteCallback from '.~/hooks/useAdsSetupCompleteCallback';
 import StepContent from '.~/components/stepper/step-content';
 import StepContentHeader from '.~/components/stepper/step-content-header';
 import StepContentFooter from '.~/components/stepper/step-content-footer';
 import FaqsSection from '.~/components/paid-ads/faqs-section';
 import AppButton from '.~/components/app-button';
 import ProductFeedStatusSection from './product-feed-status-section';
+import GoogleAdsAccountSection from './google-ads-account-section';
 import PaidAdsFeaturesSection from './paid-ads-features-section';
 import PaidAdsSetupSections from './paid-ads-setup-sections';
 import { getProductFeedUrl } from '.~/utils/urls';
@@ -40,6 +42,8 @@ const ACTION_SKIP = 'skip-ads';
  * Clicking on the "Complete setup" button to complete the onboarding flow with paid ads.
  *
  * @event gla_onboarding_complete_with_paid_ads_button_click
+ * @property {number} budget The budget for the campaign
+ * @property {string} audiences The targeted audiences for the campaign
  */
 
 /**
@@ -51,7 +55,7 @@ const ACTION_SKIP = 'skip-ads';
  *
  * @event gla_onboarding_complete_button_click
  * @property {string} opened_paid_ads_setup Whether the paid ads setup is opened, e.g. 'yes', 'no'
- * @property {string} google_ads_account_status The connection status of merchant's Google Ads addcount, e.g. 'unknown', 'connected', 'disconnected', 'incomplete'
+ * @property {string} google_ads_account_status The connection status of merchant's Google Ads addcount, e.g. 'connected', 'disconnected', 'incomplete'
  * @property {string} billing_method_status aaa, The status of billing method of merchant's Google Ads addcount e.g. 'unknown', 'pending', 'approved', 'cancelled'
  * @property {string} campaign_form_validation Whether the entered paid campaign form data are valid, e.g. 'unknown', 'valid', 'invalid'
  */
@@ -67,6 +71,7 @@ const ACTION_SKIP = 'skip-ads';
 export default function SetupPaidAds() {
 	const adminUrl = useAdminUrl();
 	const { createNotice } = useDispatchCoreNotices();
+	const { googleAdsAccount, hasGoogleAdsConnection } = useGoogleAdsAccount();
 	const [ handleSetupComplete ] = useAdsSetupCompleteCallback();
 	const [ showPaidAdsSetup, setShowPaidAdsSetup ] = useState( () =>
 		clientSession.getShowPaidAdsSetup( false )
@@ -121,31 +126,32 @@ export default function SetupPaidAds() {
 	function createSkipButton( text ) {
 		const eventProps = {
 			opened_paid_ads_setup: 'no',
-			google_ads_account_status: 'unknown',
+			google_ads_account_status: googleAdsAccount?.status,
 			billing_method_status: 'unknown',
 			campaign_form_validation: 'unknown',
 		};
 
 		if ( showPaidAdsSetup ) {
 			const selector = select( STORE_KEY );
-			const account = selector.getGoogleAdsAccount();
 			const billing = selector.getGoogleAdsAccountBillingStatus();
 
 			merge( eventProps, {
 				opened_paid_ads_setup: 'yes',
-				google_ads_account_status: account?.status,
 				billing_method_status: billing?.status,
 				campaign_form_validation: paidAds.isValid ? 'valid' : 'invalid',
 			} );
 		}
 
+		const disabledSkip =
+			completing === ACTION_COMPLETE || ! hasGoogleAdsConnection;
+
 		return (
 			<AppButton
 				isTertiary
 				data-action={ ACTION_SKIP }
 				text={ text }
 				loading={ completing === ACTION_SKIP }
-				disabled={ completing === ACTION_COMPLETE }
+				disabled={ disabledSkip }
 				onClick={ finishOnboardingSetup }
 				eventName="gla_onboarding_complete_button_click"
 				eventProps={ eventProps }
@@ -166,8 +172,12 @@ export default function SetupPaidAds() {
 				) }
 			/>
 			<ProductFeedStatusSection />
+			<GoogleAdsAccountSection />
 			<PaidAdsFeaturesSection
-				hideFooterButtons={ showPaidAdsSetup }
+				hideBudgetContent={ ! hasGoogleAdsConnection }
+				hideFooterButtons={
+					! hasGoogleAdsConnection || showPaidAdsSetup
+				}
 				skipButton={ createSkipButton(
 					__( 'Skip this step for now', 'google-listings-and-ads' )
 				) }
@@ -207,6 +217,10 @@ export default function SetupPaidAds() {
 						disabled={ disabledComplete }
 						onClick={ handleCompleteClick }
 						eventName="gla_onboarding_complete_with_paid_ads_button_click"
+						eventProps={ {
+							budget: paidAds.amount,
+							audiences: paidAds.countryCodes?.join( ',' ),
+						} }
 					/>
 				</Flex>
 			</StepContentFooter>

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "google-listings-and-ads",
 	"title": "Google Listings and Ads",
-	"version": "2.5.13",
+	"version": "2.5.14",
 	"description": "google-listings-and-ads",
 	"author": "Automattic",
 	"license": "GPL-3.0-or-later",