Site Editor: Fix document actions label helper method (#52974)

* Site Editor: Fix document actions label helper method * Add missing useSelect dep * Fix e2e tests * Move the label map at the file level to avoid recreating the object on every render
WordPress · Aug 9, 2023 · da06123 · da06123
1 parent 223baa2
commit da06123
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 28 deletions.
diff --git a/packages/edit-site/src/components/header-edit-mode/document-actions/index.js b/packages/edit-site/src/components/header-edit-mode/document-actions/index.js
@@ -6,7 +6,7 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { sprintf, __, isRTL } from '@wordpress/i18n';
+import { __, isRTL } from '@wordpress/i18n';
 import { useSelect, useDispatch } from '@wordpress/data';
 import {
 	Button,
@@ -33,8 +33,18 @@ import { store as coreStore } from '@wordpress/core-data';
 import useEditedEntityRecord from '../../use-edited-entity-record';
 import { store as editSiteStore } from '../../../store';
 
+const typeLabels = {
+	wp_block: __( 'Editing pattern:' ),
+	wp_navigation: __( 'Editing navigation menu:' ),
+	wp_template: __( 'Editing template:' ),
+	wp_template_part: __( 'Editing template part:' ),
+};
+
 export default function DocumentActions() {
-	const isPage = useSelect( ( select ) => select( editSiteStore ).isPage() );
+	const isPage = useSelect(
+		( select ) => select( editSiteStore ).isPage(),
+		[]
+	);
 	return isPage ? <PageDocumentActions /> : <TemplateDocumentActions />;
 }
 
@@ -118,8 +128,6 @@ function TemplateDocumentActions( { className, onBack } ) {
 		);
 	}
 
-	const entityLabel = getEntityLabel( record.type );
-
 	let typeIcon = icon;
 	if ( record.type === 'wp_navigation' ) {
 		typeIcon = navigationIcon;
@@ -137,11 +145,7 @@ function TemplateDocumentActions( { className, onBack } ) {
 			onBack={ onBack }
 		>
 			<VisuallyHidden as="span">
-				{ sprintf(
-					/* translators: %s: the entity being edited, like "template"*/
-					__( 'Editing %s: ' ),
-					entityLabel
-				) }
+				{ typeLabels[ record.type ] ?? typeLabels.wp_template }
 			</VisuallyHidden>
 			{ getTitle() }
 		</BaseDocumentActions>
@@ -187,20 +191,3 @@ function BaseDocumentActions( { className, icon, children, onBack } ) {
 		</div>
 	);
 }
-
-function getEntityLabel( entityType ) {
-	let label = '';
-	switch ( entityType ) {
-		case 'wp_navigation':
-			label = 'navigation menu';
-			break;
-		case 'wp_template_part':
-			label = 'template part';
-			break;
-		default:
-			label = 'template';
-			break;
-	}
-
-	return label;
-}
diff --git a/test/e2e/specs/site-editor/title.spec.js b/test/e2e/specs/site-editor/title.spec.js
@@ -26,7 +26,7 @@ test.describe( 'Site editor title', () => {
 			'role=region[name="Editor top bar"i] >> role=heading[level=1]'
 		);
 
-		await expect( title ).toHaveText( 'Editing template: Index' );
+		await expect( title ).toHaveText( 'Editing template:Index' );
 	} );
 
 	test( 'displays the selected template name in the title for the header template', async ( {
@@ -43,6 +43,6 @@ test.describe( 'Site editor title', () => {
 			'role=region[name="Editor top bar"i] >> role=heading[level=1]'
 		);
 
-		await expect( title ).toHaveText( 'Editing template part: header' );
+		await expect( title ).toHaveText( 'Editing template part:header' );
 	} );
 } );