From 1f8ba758f3b9651d762f2188f57dc627b8a23b97 Mon Sep 17 00:00:00 2001
From: Ankit Gade <ankit.gade@10up.com>
Date: Thu, 25 Jul 2024 21:45:51 +0530
Subject: [PATCH] Fix: Add publication ID in publicationSelect component.

---
 .../components/common/PublicationSelect.js             | 10 ++++++++--
 .../components/common/PublicationSelect.test.js        |  5 +++++
 .../components/setup/SetupMain.js                      |  6 ++++--
 .../components/setup/SetupMain.test.js                 |  2 +-
 4 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.js b/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.js
index 7f920f2c053..efb10706ce5 100644
--- a/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.js
+++ b/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.js
@@ -25,7 +25,7 @@ import PropTypes from 'prop-types';
 /**
  * WordPress dependencies
  */
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { useCallback } from '@wordpress/element';
 
 /**
@@ -130,7 +130,13 @@ export default function PublicationSelect( props ) {
 				( { publicationId, displayName } ) => (
 					// eslint-disable-next-line sitekit/acronym-case
 					<Option key={ publicationId } value={ publicationId }>
-						{ displayName }
+						{ sprintf(
+							/* translators: 1: Publication display name, 2: Publication ID */
+							__( '%1$s (%2$s)', 'google-site-kit' ),
+							displayName,
+							// eslint-disable-next-line sitekit/acronym-case
+							publicationId
+						) }
 					</Option>
 				)
 			) }
diff --git a/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.test.js b/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.test.js
index 881d6d8c4b1..3ce2239bdcc 100644
--- a/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.test.js
+++ b/assets/js/modules/reader-revenue-manager/components/common/PublicationSelect.test.js
@@ -85,6 +85,11 @@ describe( 'PublicationSelect', () => {
 				// eslint-disable-next-line sitekit/acronym-case
 				publications[ index ].publicationId
 			);
+
+			expect( listItem.textContent ).toEqual(
+				// eslint-disable-next-line sitekit/acronym-case
+				`${ publications[ index ].displayName } (${ publications[ index ].publicationId })`
+			);
 		} );
 	} );
 
diff --git a/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.js b/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.js
index 48435bfb33c..9f83e70f3cf 100644
--- a/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.js
+++ b/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.js
@@ -45,8 +45,10 @@ export default function SetupMain() {
 
 			<div>
 				<p>
-					This is just added as a placeholder component to assist with
-					testing.
+					{ __(
+						'Select your preferred publication to connect with Site Kit',
+						'google-site-kit'
+					) }
 				</p>
 				<PublicationSelect />
 			</div>
diff --git a/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.test.js b/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.test.js
index ff1b0c1b194..f31dfd28bbe 100644
--- a/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.test.js
+++ b/assets/js/modules/reader-revenue-manager/components/setup/SetupMain.test.js
@@ -70,7 +70,7 @@ describe( 'SetupMain', () => {
 		// TODO: Adjust the tests once #8800 is implemented.
 		expect(
 			getByText(
-				/This is just added as a placeholder component to assist with testing./i
+				/Select your preferred publication to connect with Site Kit/i
 			)
 		).toBeInTheDocument();
 	} );