From 80740460e831877b3fbff8bf2675b1c758fdb425 Mon Sep 17 00:00:00 2001
From: Robert Anderson <robert@noisysocks.com>
Date: Fri, 9 Jun 2023 14:55:19 +1000
Subject: [PATCH 1/2] Add 'Edit template' and 'Back to page' commands

Add commands specific to editing a page in the site editor to the
command centre.
---
 .../hooks/commands/use-edit-mode-commands.js  | 56 +++++++++++++++----
 1 file changed, 46 insertions(+), 10 deletions(-)

diff --git a/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js b/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js
index 67953b293b2aa..4dd7221fe1fd4 100644
--- a/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js
+++ b/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js
@@ -1,9 +1,9 @@
 /**
  * WordPress dependencies
  */
-import { useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
-import { trash, backup } from '@wordpress/icons';
+import { trash, backup, layout, page } from '@wordpress/icons';
 import { useCommandLoader } from '@wordpress/commands';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 
@@ -19,16 +19,25 @@ import { unlock } from '../../lock-unlock';
 const { useHistory } = unlock( routerPrivateApis );
 
 function useEditModeCommandLoader() {
-	const { removeTemplate, revertTemplate } = useDispatch( editSiteStore );
-	const history = useHistory();
 	const { isLoaded, record: template } = useEditedEntityRecord();
-	const isRemovable =
-		isLoaded && !! template && isTemplateRemovable( template );
-	const isRevertable =
-		isLoaded && !! template && isTemplateRevertable( template );
+	const { removeTemplate, revertTemplate, setHasPageContentFocus } =
+		useDispatch( editSiteStore );
+	const history = useHistory();
+	const { isPage, hasPageContentFocus } = useSelect(
+		( select ) => ( {
+			isPage: select( editSiteStore ).isPage(),
+			hasPageContentFocus: select( editSiteStore ).hasPageContentFocus(),
+		} ),
+		[]
+	);
+
+	if ( ! isLoaded ) {
+		return { isLoading: true, commands: [] };
+	}
 
 	const commands = [];
-	if ( isRemovable ) {
+
+	if ( isTemplateRemovable( template ) && ! hasPageContentFocus ) {
 		const label =
 			template.type === 'wp_template'
 				? __( 'Delete template' )
@@ -48,7 +57,8 @@ function useEditModeCommandLoader() {
 			},
 		} );
 	}
-	if ( isRevertable ) {
+
+	if ( isTemplateRevertable( template ) && ! hasPageContentFocus ) {
 		const label =
 			template.type === 'wp_template'
 				? __( 'Reset template' )
@@ -64,6 +74,32 @@ function useEditModeCommandLoader() {
 		} );
 	}
 
+	if ( isPage ) {
+		if ( hasPageContentFocus ) {
+			commands.push( {
+				name: 'core/switch-to-template-focus',
+				label: __( 'Edit template' ),
+				icon: layout,
+				context: 'site-editor-edit',
+				callback: ( { close } ) => {
+					setHasPageContentFocus( false );
+					close();
+				},
+			} );
+		} else {
+			commands.push( {
+				name: 'core/switch-to-page-focus',
+				label: __( 'Back to page' ),
+				icon: page,
+				context: 'site-editor-edit',
+				callback: ( { close } ) => {
+					setHasPageContentFocus( true );
+					close();
+				},
+			} );
+		}
+	}
+
 	return {
 		isLoading: ! isLoaded,
 		commands,

From b39b7f28a9334f64c8c0ee3bbb9808d66fd22072 Mon Sep 17 00:00:00 2001
From: Robert Anderson <robert@noisysocks.com>
Date: Tue, 13 Jun 2023 10:28:24 +1000
Subject: [PATCH 2/2] Re-order template commands

---
 .../hooks/commands/use-edit-mode-commands.js  | 74 +++++++++----------
 1 file changed, 37 insertions(+), 37 deletions(-)

diff --git a/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js b/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js
index 4dd7221fe1fd4..16414eb1cc98f 100644
--- a/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js
+++ b/packages/edit-site/src/hooks/commands/use-edit-mode-commands.js
@@ -37,43 +37,6 @@ function useEditModeCommandLoader() {
 
 	const commands = [];
 
-	if ( isTemplateRemovable( template ) && ! hasPageContentFocus ) {
-		const label =
-			template.type === 'wp_template'
-				? __( 'Delete template' )
-				: __( 'Delete template part' );
-		commands.push( {
-			name: 'core/remove-template',
-			label,
-			icon: trash,
-			context: 'site-editor-edit',
-			callback: ( { close } ) => {
-				removeTemplate( template );
-				// Navigate to the template list
-				history.push( {
-					path: '/' + template.type,
-				} );
-				close();
-			},
-		} );
-	}
-
-	if ( isTemplateRevertable( template ) && ! hasPageContentFocus ) {
-		const label =
-			template.type === 'wp_template'
-				? __( 'Reset template' )
-				: __( 'Reset template part' );
-		commands.push( {
-			name: 'core/reset-template',
-			label,
-			icon: backup,
-			callback: ( { close } ) => {
-				revertTemplate( template );
-				close();
-			},
-		} );
-	}
-
 	if ( isPage ) {
 		if ( hasPageContentFocus ) {
 			commands.push( {
@@ -100,6 +63,43 @@ function useEditModeCommandLoader() {
 		}
 	}
 
+	if ( isTemplateRevertable( template ) && ! hasPageContentFocus ) {
+		const label =
+			template.type === 'wp_template'
+				? __( 'Reset template' )
+				: __( 'Reset template part' );
+		commands.push( {
+			name: 'core/reset-template',
+			label,
+			icon: backup,
+			callback: ( { close } ) => {
+				revertTemplate( template );
+				close();
+			},
+		} );
+	}
+
+	if ( isTemplateRemovable( template ) && ! hasPageContentFocus ) {
+		const label =
+			template.type === 'wp_template'
+				? __( 'Delete template' )
+				: __( 'Delete template part' );
+		commands.push( {
+			name: 'core/remove-template',
+			label,
+			icon: trash,
+			context: 'site-editor-edit',
+			callback: ( { close } ) => {
+				removeTemplate( template );
+				// Navigate to the template list
+				history.push( {
+					path: '/' + template.type,
+				} );
+				close();
+			},
+		} );
+	}
+
 	return {
 		isLoading: ! isLoaded,
 		commands,