Merge branch 'develop' into enhancement/9957-js-entry-point-for-block…

…-editor.

assets/js/components/KeyMetrics/hooks/useDisplayNewEventsCalloutAfterInitialDetection.js

@@ -26,7 +26,7 @@ import { MODULES_ANALYTICS_4 } from '../../../modules/analytics-4/datastore/cons
 /**
  * Determines whether the new events callout should be displayed.
  *
- * @since n.e.x.t
+ * @since 1.144.0
  *
  * @param {boolean} haveNewConversionEventsAfterDismiss If there are new events detected after callout was dismissed.
  * @return {boolean} Whether the new events callout should be displayed.

assets/js/components/KeyMetrics/hooks/useDisplayNewEventsCalloutForTailoredMetrics.js

@@ -26,7 +26,7 @@ import { MODULES_ANALYTICS_4 } from '../../../modules/analytics-4/datastore/cons
 /**
  * Determines whether the initial new events callout should be displayed.
  *
- * @since n.e.x.t
+ * @since 1.144.0
  *
  * @param {boolean} haveNewConversionEventsAfterDismiss If there are new events detected after callout was dismissed.
  * @return {boolean} Whether the initial new events callout should be displayed.

assets/js/components/KeyMetrics/hooks/useDisplayNewEventsCalloutForUserPickedMetrics.js

@@ -27,7 +27,7 @@ import { MODULES_ANALYTICS_4 } from '../../../modules/analytics-4/datastore/cons
 /**
  * Determines whether the initial new events callout should be displayed.
  *
- * @since n.e.x.t
+ * @since 1.144.0
  *
  * @param {boolean} haveNewConversionEventsAfterDismiss If there are new events detected after callout was dismissed.
  * @return {boolean} Whether the initial new events callout should be displayed.

assets/js/components/notifications/FirstPartyModeSetupBanner.js

@@ -19,7 +19,7 @@
 /**
  * WordPress dependencies
  */
-import { Fragment, useEffect } from '@wordpress/element';
+import { Fragment, useCallback, useEffect } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 
 /**
@@ -36,6 +36,7 @@ import {
 	NOTIFICATION_GROUPS,
 } from '../../googlesitekit/notifications/datastore/constants';
 import { CORE_SITE } from '../../googlesitekit/datastore/site/constants';
+import { CORE_USER } from '../../googlesitekit/datastore/user/constants';
 import { CORE_UI } from '../../googlesitekit/datastore/ui/constants';
 import Description from '../../googlesitekit/notifications/components/common/Description';
 import LearnMoreLink from '../../googlesitekit/notifications/components/common/LearnMoreLink';
@@ -50,8 +51,7 @@ import {
 	useBreakpoint,
 } from '../../hooks/useBreakpoint';
 import useViewContext from '../../hooks/useViewContext';
-import { CORE_USER } from '../../googlesitekit/datastore/user/constants';
-import { trackEvent } from '../../util';
+import { DAY_IN_SECONDS, trackEvent } from '../../util';
 
 export const FPM_SHOW_SETUP_SUCCESS_NOTIFICATION =
 	'fpm-show-setup-success-notification';
@@ -67,6 +67,10 @@ export default function FirstPartyModeSetupBanner( { id, Notification } ) {
 
 	const { isTooltipVisible } = useTooltipState( id );
 
+	const usingProxy = useSelect( ( select ) =>
+		select( CORE_SITE ).isUsingProxy()
+	);
+
 	const isItemDismissed = useSelect( ( select ) =>
 		select( CORE_NOTIFICATIONS ).isNotificationDismissed( id )
 	);
@@ -104,6 +108,13 @@ export default function FirstPartyModeSetupBanner( { id, Notification } ) {
 		dismissNotification( id );
 	};
 
+	const { triggerSurvey } = useDispatch( CORE_USER );
+	const handleView = useCallback( () => {
+		if ( usingProxy ) {
+			triggerSurvey( 'view_fpm_setup_cta', { ttl: DAY_IN_SECONDS } );
+		}
+	}, [ triggerSurvey, usingProxy ] );
+
 	const onDismiss = () => {
 		showTooltip();
 	};
@@ -147,7 +158,7 @@ export default function FirstPartyModeSetupBanner( { id, Notification } ) {
 	};
 
 	return (
-		<Notification>
+		<Notification onView={ handleView }>
 			<NotificationWithSVG
 				id={ id }
 				title={ __(

assets/js/googlesitekit/datastore/site/first-party-mode.js

@@ -33,9 +33,10 @@ import {
 	createReducer,
 } from 'googlesitekit-data';
 import { CORE_SITE } from './constants';
+import { CORE_USER } from '../user/constants';
+import { CORE_MODULES } from '../../modules/datastore/constants';
 import { createFetchStore } from '../../data/create-fetch-store';
 import { isFeatureEnabled } from '../../../features';
-import { CORE_MODULES } from '../../modules/datastore/constants';
 
 const SET_FIRST_PARTY_MODE_ENABLED = 'SET_FIRST_PARTY_MODE_ENABLED';
 const RESET_FIRST_PARTY_MODE_SETTINGS = 'RESET_FIRST_PARTY_MODE_SETTINGS';
@@ -103,16 +104,24 @@ const baseActions = {
 	 * Saves the first-party mode settings.
 	 *
 	 * @since 1.141.0
+	 * @since n.e.x.t Added the survey trigger.
 	 *
 	 * @return {Object} Object with `response` and `error`.
 	 */
 	*saveFirstPartyModeSettings() {
-		const { select } = yield commonActions.getRegistry();
+		const { dispatch, select } = yield commonActions.getRegistry();
 		const settings = select( CORE_SITE ).getFirstPartyModeSettings();
 
-		return yield fetchSaveFirstPartyModeSettingsStore.actions.fetchSaveFirstPartyModeSettings(
-			settings
-		);
+		const results =
+			yield fetchSaveFirstPartyModeSettingsStore.actions.fetchSaveFirstPartyModeSettings(
+				settings
+			);
+
+		if ( results?.response?.isEnabled ) {
+			dispatch( CORE_USER ).triggerSurvey( 'fpm_setup_completed' );
+		}
+
+		return results;
 	},
 
 	/**

assets/js/googlesitekit/datastore/site/first-party-mode.test.js

@@ -14,17 +14,26 @@
  * limitations under the License.
  */
 
+/**
+ * External dependencies
+ */
+import { waitFor } from '@testing-library/react';
+
 /**
  * Internal dependencies
  */
 import API from 'googlesitekit-api';
 import {
 	createTestRegistry,
 	muteFetch,
+	provideUserAuthentication,
 	subscribeUntil,
 	untilResolved,
+	waitForDefaultTimeouts,
 } from '../../../../../tests/js/utils';
 import { CORE_SITE } from './constants';
+import { surveyTriggerEndpoint } from '../../../../../tests/js/mock-survey-endpoints';
+import { CORE_USER } from '../user/constants';
 
 describe( 'core/site First-party Mode', () => {
 	let registry;
@@ -48,6 +57,15 @@ describe( 'core/site First-party Mode', () => {
 	describe( 'actions', () => {
 		describe( 'saveFirstPartyModeSettings', () => {
 			it( 'saves the settings and returns the response', async () => {
+				provideUserAuthentication( registry );
+
+				registry.dispatch( CORE_USER ).receiveGetSurveyTimeouts( [] );
+
+				fetchMock.postOnce( surveyTriggerEndpoint, {
+					status: 200,
+					body: {},
+				} );
+
 				const updatedSettings = {
 					isEnabled: true,
 					isFPMHealthy: false,
@@ -88,6 +106,8 @@ describe( 'core/site First-party Mode', () => {
 				);
 
 				expect( response ).toEqual( updatedSettings );
+
+				await waitForDefaultTimeouts();
 			} );
 
 			it( 'returns an error if the request fails', async () => {
@@ -134,6 +154,83 @@ describe( 'core/site First-party Mode', () => {
 
 				expect( console ).toHaveErrored();
 			} );
+
+			it( 'should trigger the FPM setup completed survey when FPM setting is enabled', async () => {
+				provideUserAuthentication( registry );
+
+				registry.dispatch( CORE_USER ).receiveGetSurveyTimeouts( [] );
+
+				fetchMock.postOnce( surveyTriggerEndpoint, {
+					status: 200,
+					body: { triggerID: 'fpm_setup_completed' },
+				} );
+
+				fetchMock.postOnce( firstPartyModeSettingsEndpointRegExp, {
+					body: {
+						isEnabled: true,
+						isFPMHealthy: true,
+						isScriptAccessEnabled: true,
+					},
+					status: 200,
+				} );
+
+				registry
+					.dispatch( CORE_SITE )
+					.receiveGetFirstPartyModeSettings( {
+						isEnabled: false,
+						isFPMHealthy: true,
+						isScriptAccessEnabled: true,
+					} );
+
+				registry.dispatch( CORE_SITE ).setFirstPartyModeEnabled( true );
+
+				await registry
+					.dispatch( CORE_SITE )
+					.saveFirstPartyModeSettings();
+
+				// Verify survey was triggered when FPM setting is set to true.
+				await waitFor( () =>
+					expect( fetchMock ).toHaveFetched( surveyTriggerEndpoint, {
+						body: {
+							data: { triggerID: 'fpm_setup_completed' },
+						},
+					} )
+				);
+			} );
+
+			it( 'should not trigger the FPM setup completed survey when FPM setting is disabled', async () => {
+				fetchMock.postOnce( firstPartyModeSettingsEndpointRegExp, {
+					body: {
+						isEnabled: false,
+						isFPMHealthy: true,
+						isScriptAccessEnabled: true,
+					},
+					status: 200,
+				} );
+
+				registry
+					.dispatch( CORE_SITE )
+					.receiveGetFirstPartyModeSettings( {
+						isEnabled: true,
+						isFPMHealthy: true,
+						isScriptAccessEnabled: true,
+					} );
+
+				registry
+					.dispatch( CORE_SITE )
+					.setFirstPartyModeEnabled( false );
+
+				await registry
+					.dispatch( CORE_SITE )
+					.saveFirstPartyModeSettings();
+
+				// Verify survey was not triggered when FPM setting is set to false.
+				expect( fetchMock ).not.toHaveFetched( surveyTriggerEndpoint, {
+					body: {
+						data: { triggerID: 'fpm_setup_completed' },
+					},
+				} );
+			} );
 		} );
 
 		describe( 'setFirstPartyModeEnabled', () => {
@@ -142,8 +239,8 @@ describe( 'core/site First-party Mode', () => {
 					.dispatch( CORE_SITE )
 					.receiveGetFirstPartyModeSettings( {
 						isEnabled: false,
-						isFPMHealthy: false,
-						isScriptAccessEnabled: false,
+						isFPMHealthy: true,
+						isScriptAccessEnabled: true,
 					} );
 
 				expect(

assets/js/googlesitekit/datastore/user/conversion-reporting-settings.js

@@ -87,7 +87,7 @@ const baseActions = {
 	/**
 	 * Saves the conversion reporting settings.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @param {Object} settings Optional. By default, this saves whatever there is in the store. Use this object to save additional settings.
 	 * @return {Object} Object with `response` and `error`.
@@ -125,7 +125,7 @@ const baseSelectors = {
 	/**
 	 * Gets the conversion reporting settings.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @param {Object} state Data store's state.
 	 * @return {(Object|undefined)} Conversion reporting settings; `undefined` if not loaded.
@@ -137,7 +137,7 @@ const baseSelectors = {
 	/**
 	 * Determines whether the conversion reporting settings are being saved or not.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @param {Object} state Data store's state.
 	 * @return {boolean} TRUE if the key metrics settings are being saved, otherwise FALSE.
@@ -153,7 +153,7 @@ const baseSelectors = {
 	/**
 	 * Determines whether the new events callout should be shown or not.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @return {boolean} TRUE if the there were new events detected after the callout was dismissed, otherwise FALSE.
 	 */
@@ -181,7 +181,7 @@ const baseSelectors = {
 	/**
 	 * Determines whether the lost events callout should be shown or not.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @return {boolean} TRUE if the there were lost events detected after the callout was dismissed, otherwise FALSE.
 	 */

assets/js/googlesitekit/modules/datastore/modules.js

@@ -1421,7 +1421,7 @@ const baseSelectors = {
 	 * Returns the module homepage by default. This can be overwritten by a
 	 * custom selector of the same name in the module store implementation.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @param {Object} state Data store's state.
 	 * @param {string} slug  Module slug.

assets/js/googlesitekit/modules/datastore/settings.js

@@ -126,7 +126,7 @@ export const selectors = {
 	/**
 	 * Checks whether settings edit dependencies are currently loading for a module.
 	 *
-	 * @since n.e.x.t
+	 * @since 1.144.0
 	 *
 	 * @param {string} slug Module slug.
 	 * @return {boolean?} Whether or not settings edit dependencies are currently loading for the module,

assets/js/googlesitekit/notifications/components/Notification/index.js

@@ -36,6 +36,7 @@ export default function Notification( {
 	className,
 	gaTrackingEventArgs,
 	children,
+	onView,
 } ) {
 	const ref = useRef();
 	const viewed = useHasBeenViewed( id );
@@ -53,9 +54,12 @@ export default function Notification( {
 				gaTrackingEventArgs?.label,
 				gaTrackingEventArgs?.value
 			);
+
+			onView?.();
+
 			setIsViewedOnce( true );
 		}
-	}, [ viewed, trackEvents, isViewedOnce, gaTrackingEventArgs ] );
+	}, [ viewed, trackEvents, isViewedOnce, gaTrackingEventArgs, onView ] );
 
 	return (
 		<section id={ id } ref={ ref } className={ className }>
@@ -81,4 +85,5 @@ Notification.propTypes = {
 		value: PropTypes.string,
 	} ),
 	children: PropTypes.node,
+	onView: PropTypes.func,
 };