Merge branch 'enhance/#7932-replace-analytics-with-analytics-4' into …

…enhance/#7843-remove-analytics-module.

assets/js/components/adminbar/AdminBarSessionsGA4.js

@@ -32,8 +32,8 @@ import { CORE_USER } from '../../googlesitekit/datastore/user/constants';
 import { CORE_SITE } from '../../googlesitekit/datastore/site/constants';
 import { calculateChange } from '../../util';
 import {
-	MODULES_ANALYTICS_4,
 	DATE_RANGE_OFFSET,
+	MODULES_ANALYTICS_4,
 } from '../../modules/analytics-4/datastore/constants';
 const { useSelect } = Data;
 

assets/js/components/adminbar/common-GA4.stories.js

@@ -225,6 +225,11 @@ export const setupAnalytics4GatheringData = (
 	} );
 };
 
+export const setupSearchConsoleAnalytics4GatheringData = ( registry ) => {
+	setupSearchConsoleGatheringData( registry );
+	setupAnalytics4GatheringData( registry );
+};
+
 export const setupSearchConsoleZeroData = ( registry ) => {
 	registry.dispatch( MODULES_SEARCH_CONSOLE ).receiveGetReport(
 		[
@@ -303,3 +308,8 @@ export const setupAnalytics4Error = (
 			.finishResolution( 'getReport', [ options ] );
 	} );
 };
+
+export const setupSearchConsoleAnalytics4ZeroData = ( registry ) => {
+	setupSearchConsoleZeroData( registry );
+	setupAnalytics4ZeroData( registry );
+};

assets/js/components/notifications/GA4AdSenseLinkedNotification.js

@@ -28,8 +28,8 @@ import { __ } from '@wordpress/i18n';
 import Data from 'googlesitekit-data';
 import { CORE_USER } from '../../googlesitekit/datastore/user/constants';
 import {
-	MODULES_ANALYTICS_4,
 	DATE_RANGE_OFFSET,
+	MODULES_ANALYTICS_4,
 } from '../../modules/analytics-4/datastore/constants';
 import CheckFill from '../../../svg/icons/check-fill.svg';
 import { Button } from 'googlesitekit-components';

assets/js/components/notifications/UnsatisfiedScopesAlert.js

@@ -46,6 +46,7 @@ const { useSelect } = Data;
 const scopeIDToSlug = {
 	siteverification: 'site-verification',
 	webmasters: 'search-console',
+	analytics: 'analytics-4',
 };
 const MESSAGE_MULTIPLE = 'multiple';
 const MESSAGE_SINGULAR = 'single';
@@ -67,13 +68,7 @@ function mapScopesToModuleNames( scopes, modules ) {
 				)
 			)
 			// Map each match into a module slug, if any.
-			.map( ( [ , id ] ) => {
-				// Exception for analytics to map to analytics-4
-				if ( id === 'analytics' ) {
-					return 'analytics-4';
-				}
-				return scopeIDToSlug[ id ] || id;
-			} )
+			.map( ( [ , id ] ) => scopeIDToSlug[ id ] || id )
 			// Map module slugs into module names. If there is no matched module, set to `false`.
 			.map( ( slug ) => modules[ slug ]?.name || false )
 	);

assets/js/components/notifications/WebDataStreamNotAvailableNotification.js

@@ -83,7 +83,7 @@ export default function WebDataStreamNotAvailableNotification() {
 				),
 				measurementID
 			) }
-			ctaLink={ `${ settingsURL }#connected-services/analytics/edit` }
+			ctaLink={ `${ settingsURL }#connected-services/analytics-4/edit` }
 			ctaLabel={ __( 'Update Analytics settings', 'google-site-kit' ) }
 			dismiss={ __( 'Maybe later', 'google-site-kit' ) }
 			// This is arbitrarily set to 55 minutes to ensure that the notification

assets/js/components/settings/SettingsModules.test.js

@@ -118,12 +118,12 @@ describe( 'SettingsModules', () => {
 	} );
 
 	it( 'should redirect from #settings/:moduleSlug/view to #/connected-services/:moduleSlug', () => {
-		history.push( '/settings/analytics/view' );
+		history.push( '/settings/analytics-4/view' );
 
 		render( <SettingsModules />, { history, registry } );
 
 		expect( global.location.hash ).toEqual(
-			'#/connected-services/analytics'
+			'#/connected-services/analytics-4'
 		);
 	} );
 

assets/js/components/wp-dashboard/WPDashboardUniqueVisitorsChartGA4.js

@@ -31,8 +31,8 @@ import Data from 'googlesitekit-data';
 import { CORE_UI } from '../../googlesitekit/datastore/ui/constants';
 import { CORE_USER } from '../../googlesitekit/datastore/user/constants';
 import {
-	MODULES_ANALYTICS_4,
 	DATE_RANGE_OFFSET,
+	MODULES_ANALYTICS_4,
 } from '../../modules/analytics-4/datastore/constants';
 import GoogleChart from '../GoogleChart';
 import { UNIQUE_VISITORS_CHART_OPTIONS } from './chart-options';

assets/js/components/wp-dashboard/WPDashboardWidgets.stories.js

@@ -32,12 +32,12 @@ import {
 } from '../../../../tests/js/utils';
 import {
 	setupAnalytics4ZeroData,
+	setupSearchConsoleZeroData,
 	provideAnalytics4ReportTitles,
 	setupSearchConsoleMockReports,
 	setupAnalytics4MockReports,
 	setupSearchConsoleGatheringData,
 	setupAnalytics4GatheringData,
-	setupSearchConsoleZeroData,
 	widgetDecorators,
 } from './common-GA4.stories';
 import { VIEW_CONTEXT_WP_DASHBOARD_VIEW_ONLY } from '../../googlesitekit/constants';
@@ -119,7 +119,7 @@ ReadyWithCompleteAnalyticsActivationCTA.args = {
 			{
 				active: true,
 				connected: false,
-				slug: 'analytics',
+				slug: 'analytics-4',
 			},
 		] );
 		provideSiteInfo( registry );

assets/js/components/wp-dashboard/common-GA4.stories.js

@@ -23,6 +23,7 @@ import { provideModules, provideSiteInfo } from '../../../../tests/js/utils';
 import WithRegistrySetup from '../../../../tests/js/WithRegistrySetup';
 import { CORE_USER } from '../../googlesitekit/datastore/user/constants';
 import { MODULES_ANALYTICS_4 } from '../../modules/analytics-4/datastore/constants';
+import { MODULES_SEARCH_CONSOLE } from '../../modules/search-console/datastore/constants';
 import {
 	STRATEGY_ZIP,
 	getAnalytics4MockResponse,
@@ -32,7 +33,6 @@ import { replaceValuesInAnalytics4ReportWithZeroData } from '../../../../.storyb
 import { DAY_IN_SECONDS } from '../../util';
 import * as __fixtures__ from '../../modules/analytics-4/datastore/__fixtures__';
 import { provideSearchConsoleMockReport } from '../../modules/search-console/util/data-mock';
-import { MODULES_SEARCH_CONSOLE } from '../../modules/search-console/datastore/constants';
 
 const wpDashboardSearchConsoleOptions = {
 	startDate: '2020-12-03',
@@ -140,6 +140,30 @@ const pageTitlesReportOptions = {
 	limit: 25,
 };
 
+export const setupBaseRegistry = ( registry, args ) => {
+	// Set up the search console and analytics modules stores but provide no data.
+	provideModules( registry, [
+		{
+			slug: 'search-console',
+			active: true,
+			connected: true,
+		},
+		{
+			slug: 'analytics-4',
+			active: true,
+			connected: true,
+		},
+	] );
+
+	// Set some site information.
+	provideSiteInfo( registry );
+
+	// Call story-specific setup.
+	if ( typeof args?.setupRegistry === 'function' ) {
+		args.setupRegistry( registry );
+	}
+};
+
 export const provideAnalytics4ReportTitles = (
 	registry,
 	options = pageTitlesReportOptions
@@ -189,13 +213,59 @@ export const setupSearchConsoleMockReports = ( registry, data ) => {
 	}
 };
 
+export const widgetDecorators = [
+	( Story ) => (
+		<div id="dashboard-widgets">
+			<div id="google_dashboard_widget" style={ { maxWidth: '600px' } }>
+				<div className="inside">
+					<div className="googlesitekit-wp-dashboard">
+						<div className="googlesitekit-widget">
+							<div className="googlesitekit-widget__body">
+								<Story />
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	),
+	( Story, { args } ) => {
+		const setupRegistry = ( registry ) => {
+			setupBaseRegistry( registry, args );
+		};
+
+		return (
+			<WithRegistrySetup func={ setupRegistry }>
+				<Story />
+			</WithRegistrySetup>
+		);
+	},
+];
+
 export const setupSearchConsoleGatheringData = ( registry ) => {
 	registry.dispatch( CORE_USER ).setReferenceDate( '2021-01-28' );
 	registry.dispatch( MODULES_SEARCH_CONSOLE ).receiveGetReport( [], {
 		options: wpDashboardSearchConsoleOptions,
 	} );
 };
 
+export const setupSearchConsoleZeroData = ( registry ) => {
+	registry.dispatch( MODULES_SEARCH_CONSOLE ).receiveGetReport(
+		[
+			{
+				clicks: 0,
+				ctr: 0,
+				impressions: 0,
+				keys: [ '2021-08-18' ],
+				position: 0,
+			},
+		],
+		{
+			options: wpDashboardSearchConsoleOptions,
+		}
+	);
+};
+
 export const setupAnalytics4GatheringData = ( registry ) => {
 	registry.dispatch( CORE_USER ).setReferenceDate( '2021-01-28' );
 
@@ -220,6 +290,11 @@ export function setupAnalytics4ZeroData(
 	setupAnalytics4Property( registry );
 }
 
+export const setupSearchConsoleAnalytics4ZeroData = ( registry ) => {
+	setupSearchConsoleZeroData( registry );
+	setupAnalytics4ZeroData( registry );
+};
+
 export function setupAnalytics4Loading(
 	registry,
 	mockOptionSets = wpDashboardAnalytics4OptionSets

assets/js/modules/adsense/components/dashboard/DashboardTopEarningPagesWidgetGA4.js

@@ -36,8 +36,8 @@ import Data from 'googlesitekit-data';
 import { ADSENSE_GA4_TOP_EARNING_PAGES_NOTICE_DISMISSED_ITEM_KEY as DISMISSED_KEY } from '../../constants';
 import { CORE_USER } from '../../../../googlesitekit/datastore/user/constants';
 import {
-	MODULES_ANALYTICS_4,
 	DATE_RANGE_OFFSET,
+	MODULES_ANALYTICS_4,
 } from '../../../analytics-4/datastore/constants';
 import { generateDateRangeArgs } from '../../../analytics-4/utils/report-date-range-args';
 import whenActive from '../../../../util/when-active';
@@ -80,7 +80,7 @@ function DashboardTopEarningPagesWidgetGA4( {
 	const args = {
 		startDate,
 		endDate,
-		dimensions: [ 'pageTitle', 'pagePath', 'adSourceName' ],
+		dimensions: [ 'pagePath', 'adSourceName' ],
 		metrics: [ { name: 'totalAdRevenue' } ],
 		filter: {
 			fieldName: 'adSourceName',
@@ -103,12 +103,19 @@ function DashboardTopEarningPagesWidgetGA4( {
 		] )
 	);
 
+	const titles = useInViewSelect( ( select ) =>
+		! error
+			? select( MODULES_ANALYTICS_4 ).getPageTitles( data, args )
+			: undefined
+	);
+
 	const loading = useSelect(
 		( select ) =>
 			! select( MODULES_ANALYTICS_4 ).hasFinishedResolution(
 				'getReport',
 				[ args ]
-			)
+			) ||
+			( ! error && titles === undefined )
 	);
 
 	const isDismissed = useSelect( ( select ) =>
@@ -239,8 +246,9 @@ function DashboardTopEarningPagesWidgetGA4( {
 			tooltip: __( 'Top Earning Pages', 'google-site-kit' ),
 			primary: true,
 			Component( { row } ) {
-				const [ { value: title }, { value: url } ] =
-					row.dimensionValues;
+				const [ { value: url } ] = row.dimensionValues;
+				const title = titles[ url ];
+
 				const serviceURL = useSelect( ( select ) => {
 					return ! viewOnlyDashboard
 						? select( MODULES_ANALYTICS_4 ).getServiceReportURL(