From 68cc4320c5b8b3765db730f72f8de091dbcd19b2 Mon Sep 17 00:00:00 2001
From: Jorge Costa <jorge.costa@developer.pt>
Date: Wed, 29 Nov 2023 20:33:09 +0000
Subject: [PATCH] add selection label functionality

---
 .../src/components/dataviews/dataviews.js       |  2 ++
 .../src/components/dataviews/view-list.js       | 17 +++++++++++------
 .../src/components/page-pages/index.js          | 15 ++++++++++++++-
 3 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/packages/edit-site/src/components/dataviews/dataviews.js b/packages/edit-site/src/components/dataviews/dataviews.js
index a75a1a53e5268f..95f3529fcd5812 100644
--- a/packages/edit-site/src/components/dataviews/dataviews.js
+++ b/packages/edit-site/src/components/dataviews/dataviews.js
@@ -48,6 +48,7 @@ export default function DataViews( {
 	supportedLayouts,
 	selection,
 	setSelection,
+	getSelectionLabel,
 } ) {
 	const ViewComponent = viewTypeMap[ view.type ];
 	const _fields = useMemo( () => {
@@ -92,6 +93,7 @@ export default function DataViews( {
 					isLoading={ isLoading }
 					selection={ selection }
 					setSelection={ setSelection }
+					getSelectionLabel={ getSelectionLabel }
 				/>
 
 				<div>
diff --git a/packages/edit-site/src/components/dataviews/view-list.js b/packages/edit-site/src/components/dataviews/view-list.js
index a488051bfd0203..7fcaad11c445cf 100644
--- a/packages/edit-site/src/components/dataviews/view-list.js
+++ b/packages/edit-site/src/components/dataviews/view-list.js
@@ -241,6 +241,7 @@ function ViewList( {
 	paginationInfo,
 	selection,
 	setSelection,
+	getSelectionLabel,
 } ) {
 	const areAllSelected = selection && selection.length === data.length;
 	const columns = useMemo( () => {
@@ -280,15 +281,19 @@ function ViewList( {
 					const item = props.row.original;
 					const isSelected = selection.includes( item.id );
 					//console.log({ item, isSelected });
+					let selectionLabel;
+					if ( getSelectionLabel ) {
+						selectionLabel = getSelectionLabel( isSelected, item );
+					} else {
+						selectionLabel = isSelected
+							? __( 'Deselect item' )
+							: __( 'Select a new item' );
+					}
 					return (
 						<CheckboxControl
 							__nextHasNoMarginBottom
 							checked={ isSelected }
-							label={
-								isSelected
-									? __( 'Deselect item' )
-									: __( 'Select a new item' )
-							}
+							label={ selectionLabel }
 							onChange={ () => {
 								if ( ! isSelected ) {
 									const newSelection = [
@@ -309,7 +314,7 @@ function ViewList( {
 				},
 				enableHiding: false,
 				width: 40,
-				className: 'dataviews-list-view__selection-column'
+				className: 'dataviews-list-view__selection-column',
 			} );
 		}
 		if ( actions?.length ) {
diff --git a/packages/edit-site/src/components/page-pages/index.js b/packages/edit-site/src/components/page-pages/index.js
index 99c9998440adf0..a4c70c37131075 100644
--- a/packages/edit-site/src/components/page-pages/index.js
+++ b/packages/edit-site/src/components/page-pages/index.js
@@ -5,7 +5,7 @@ import {
 	__experimentalHeading as Heading,
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { useEntityRecords, store as coreStore } from '@wordpress/core-data';
 import { decodeEntities } from '@wordpress/html-entities';
 import { useState, useMemo, useCallback, useEffect } from '@wordpress/element';
@@ -326,6 +326,19 @@ export default function PagePages() {
 					onChangeView={ onChangeView }
 					selection={ selection }
 					setSelection={ setSelection }
+					getSelectionLabel={ ( isSelected, item ) =>
+						isSelected
+							? sprintf(
+									// translators: %s: The title of the page.
+									__( 'Deselect page: %s' ),
+									item.title?.rendered || item.slug
+							  )
+							: sprintf(
+									// translators: %s: The title of the page.
+									__( 'Select page: %s' ),
+									item.title?.rendered || item.slug
+							  )
+					}
 				/>
 			</Page>
 			{ viewTypeSupportsMap[ view.type ].preview && (