Site Editor: tidy up the generation of the site editor page title (#4…

…8053)

* Tidy up the generation of the edit site page title

* Remove isReady as doesn't seem to add anything above the isLoaded from useEditedEntityRecord

packages/edit-site/src/components/editor/index.js

@@ -4,7 +4,7 @@
 import { useMemo } from '@wordpress/element';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { Notice } from '@wordpress/components';
-import { EntityProvider, store as coreStore } from '@wordpress/core-data';
+import { EntityProvider } from '@wordpress/core-data';
 import { store as preferencesStore } from '@wordpress/preferences';
 import {
 	BlockContextProvider,
@@ -17,7 +17,7 @@ import {
 	store as interfaceStore,
 } from '@wordpress/interface';
 import { EditorNotices, EditorSnackbars } from '@wordpress/editor';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
@@ -35,6 +35,7 @@ import { GlobalStylesProvider } from '../global-styles/global-styles-provider';
 import useTitle from '../routes/use-title';
 import CanvasSpinner from '../canvas-spinner';
 import { unlock } from '../../private-apis';
+import useEditedEntityRecord from '../use-edited-entity-record';
 
 const interfaceLabels = {
 	/* translators: accessibility text for the editor content landmark region. */
@@ -49,11 +50,15 @@ const interfaceLabels = {
 
 export default function Editor() {
 	const {
-		editedPostId,
-		editedPostType,
-		editedPost,
+		record: editedPost,
+		getTitle,
+		isLoaded: hasLoadedPost,
+	} = useEditedEntityRecord();
+
+	const { id: editedPostId, type: editedPostType } = editedPost;
+
+	const {
 		context,
-		hasLoadedPost,
 		editorMode,
 		canvasMode,
 		blockEditorMode,
@@ -63,36 +68,19 @@ export default function Editor() {
 		showIconLabels,
 	} = useSelect( ( select ) => {
 		const {
-			getEditedPostType,
-			getEditedPostId,
 			getEditedPostContext,
 			getEditorMode,
 			getCanvasMode,
 			isInserterOpened,
 			isListViewOpened,
 		} = unlock( select( editSiteStore ) );
-		const { hasFinishedResolution, getEntityRecord } = select( coreStore );
 		const { __unstableGetEditorMode } = select( blockEditorStore );
 		const { getActiveComplementaryArea } = select( interfaceStore );
-		const postType = getEditedPostType();
-		const postId = getEditedPostId();
 
 		// The currently selected entity to display.
 		// Typically template or template part in the site editor.
 		return {
-			editedPostId: postId,
-			editedPostType: postType,
-			editedPost: postId
-				? getEntityRecord( 'postType', postType, postId )
-				: null,
 			context: getEditedPostContext(),
-			hasLoadedPost: postId
-				? hasFinishedResolution( 'getEntityRecord', [
-						'postType',
-						postType,
-						postId,
-				  ] )
-				: false,
 			editorMode: getEditorMode(),
 			canvasMode: getCanvasMode(),
 			blockEditorMode: __unstableGetEditorMode(),
@@ -134,26 +122,28 @@ export default function Editor() {
 					} ),
 			],
 		} ),
-		[ context ]
+		[ context, setEditedPostContext ]
 	);
-	const isReady = editedPostType !== undefined && editedPostId !== undefined;
 
 	let title;
-	if ( isReady && editedPost ) {
+	if ( hasLoadedPost ) {
 		const type =
 			editedPostType === 'wp_template'
 				? __( 'Template' )
 				: __( 'Template Part' );
-		title = `${ editedPost.title?.rendered } ‹ ${ type } ‹ ${ __(
-			'Editor (beta)'
-		) }`;
+		title = sprintf(
+			// translators: A breadcrumb trail in browser tab. %1$s: title of template being edited, %2$s: type of template (Template or Template Part).
+			__( '%1$s ‹ %2$s ‹ Editor' ),
+			getTitle(),
+			type
+		);
 	}
 
 	// Only announce the title once the editor is ready to prevent "Replace"
 	// action in <URlQueryController> from double-announcing.
-	useTitle( isReady && title );
+	useTitle( hasLoadedPost && title );
 
-	if ( ! isReady ) {
+	if ( ! hasLoadedPost ) {
 		return <CanvasSpinner />;
 	}