Merge branch 'develop' into enhancement/11722-ga-event-analytics-setup.

Author: ankitrox

.gitignore

@@ -6,6 +6,7 @@
 !.github
 !.vscode
 .vscode/*
+!.wordpress-org/
 !.vscode/extensions.json
 !.vscode/settings.json
 !.editorconfig

.wordpress-org/banner-1544x500.png

@@ -187,7 +187,6 @@ SelectionPanelFooter.propTypes = {
 	selectedItemSlugs: PropTypes.array,
 	saveSettings: PropTypes.func,
 	saveError: PropTypes.object,
-	itemLimitError: PropTypes.string,
 	minSelectedItemCount: PropTypes.number,
 	maxSelectedItemCount: PropTypes.number,
 	isBusy: PropTypes.bool,

.wordpress-org/banner-772x250.png

@@ -27,6 +27,7 @@ import { uniqWith } from 'lodash';
  */
 import { Fragment } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
+import { removeQueryArgs } from '@wordpress/url';
 
 /**
  * Internal dependencies
@@ -92,7 +93,12 @@ export default function ReportError( { moduleSlug, error } ) {
 		errors.map( ( err ) => ( {
 			...err,
 			message: getMessage( err ),
-			reconnectURL: err.data?.reconnectURL,
+			// The `code` parameter contains a session ID which can vary
+			// between requests, so we ignore it for comparison below.
+			// To use the original `reconnectURL` elsewhere, use `err.data.reconnectURL`.
+			reconnectURL: err.data?.reconnectURL
+				? removeQueryArgs( err.data.reconnectURL, 'code' )
+				: undefined,
 		} ) ),
 		( errorA, errorB ) =>
 			errorA.message === errorB.message &&

.wordpress-org/icon-128x128.png

@@ -571,6 +571,59 @@ describe( 'ReportError', () => {
 		expect( invalidateResolutionSpy ).toHaveBeenCalledTimes( 4 );
 	} );
 
+	it( 'should not list error descriptions with the same `reconnectURL`s', async () => {
+		const { container, waitForRegistry } = render(
+			<ReportError
+				moduleSlug={ moduleName }
+				error={ [
+					{
+						code: 'test_error',
+						message: 'Test error message',
+						data: {
+							reason: '',
+							reconnectURL: 'https://example.com/page?code=1',
+							status: 401,
+						},
+					},
+					{
+						code: 'test_error',
+						message: 'Test error message',
+						data: {
+							reason: '',
+							reconnectURL: 'https://example.com/page?code=2',
+							status: 401,
+						},
+					},
+					{
+						code: 'test_error',
+						message: 'Test error message 2',
+						data: {
+							reason: '',
+							reconnectURL: 'https://example.com/page2?code=1',
+							status: 401,
+						},
+					},
+				] }
+			/>,
+			{
+				registry,
+			}
+		);
+
+		await waitForRegistry();
+
+		const errorDescriptionElement = container.querySelectorAll(
+			'.googlesitekit-cta__description'
+		);
+
+		// Verify the child element count for the error description element is two.
+		// However, the passed error array has three repetitive error objects.
+		// The second error is not listed because it has the same `message` and `reconnectURL`
+		// as the first one. Note that the `code` query parameter in the `reconnectURL` is
+		// ignored for comparison, as it is expected to be different for each URL.
+		expect( errorDescriptionElement[ 0 ].childElementCount ).toBe( 2 );
+	} );
+
 	it( 'should render `Get help` link without prefix text on non-retryable error', async () => {
 		await registry.dispatch( MODULES_ANALYTICS_4 ).receiveError(
 			{

.wordpress-org/icon-256x256.png

@@ -42,13 +42,11 @@ import { Button, SpinnerButton } from 'googlesitekit-components';
 import { safelySort } from '@/js/util';
 import { MODULES_ANALYTICS_4 } from '@/js/modules/analytics-4/datastore/constants';
 import PreviewBlock from '@/js/components/PreviewBlock';
-import Notice from '@/js/components/Notice';
 
 export default function SelectionPanelFooter( {
 	savedItemSlugs = [],
 	selectedItemSlugs = [],
 	saveSettings = () => {},
-	itemLimitError,
 	minSelectedItemCount = 0,
 	maxSelectedItemCount = 0,
 	isBusy,
@@ -150,14 +148,7 @@ export default function SelectionPanelFooter( {
 	return (
 		<footer className="googlesitekit-selection-panel-footer">
 			<div className="googlesitekit-selection-panel-footer__content">
-				{ haveSettingsChanged && itemLimitError ? (
-					<Notice
-						type={ Notice.TYPES.ERROR }
-						description={ itemLimitError }
-					/>
-				) : (
-					itemCountElement
-				) }
+				{ itemCountElement }
 				<div className="googlesitekit-selection-panel-footer__actions">
 					<Button
 						onClick={ onCancelClick }
@@ -188,7 +179,6 @@ SelectionPanelFooter.propTypes = {
 	savedItemSlugs: PropTypes.array,
 	selectedItemSlugs: PropTypes.array,
 	saveSettings: PropTypes.func,
-	itemLimitError: PropTypes.string,
 	minSelectedItemCount: PropTypes.number,
 	maxSelectedItemCount: PropTypes.number,
 	isBusy: PropTypes.bool,

assets/js/components/KeyMetrics/MetricsSelectionPanel/SelectionPanelFooter.js

@@ -257,7 +257,7 @@ exports[`ModuleSetup Analytics 4 initial setup flow should match the snapshot 1`
                                     for="googlesitekit-select-17"
                                     style=""
                                   >
-                                    Web Data Stream
+                                    Web data stream
                                   </label>
                                 </div>
                                 <div
@@ -708,7 +708,7 @@ exports[`ModuleSetup Analytics 4 not initial setup flow should match the snapsho
                                     for="googlesitekit-select-38"
                                     style=""
                                   >
-                                    Web Data Stream
+                                    Web data stream
                                   </label>
                                 </div>
                                 <div