Site Editor: Only mark the 'Site' menu item active when editing a hom…

…e template (#42807) * Site Editor: Only mark the 'Site' menu item active when editing a home template * Account for front-page * Fix comment
WordPress · Oct 25, 2022 · 7200d0c · 7200d0c
1 parent a498b86
commit 7200d0c
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/packages/edit-site/src/components/app/index.js b/packages/edit-site/src/components/app/index.js
@@ -17,7 +17,7 @@ import List from '../list';
 import NavigationSidebar from '../navigation-sidebar';
 import getIsListPage from '../../utils/get-is-list-page';
 
-export default function EditSiteApp( { reboot } ) {
+export default function EditSiteApp( { reboot, homeTemplate } ) {
 	const { createErrorNotice } = useDispatch( noticesStore );
 
 	function onPluginAreaError( name ) {
@@ -40,6 +40,13 @@ export default function EditSiteApp( { reboot } ) {
 				{ ( { params } ) => {
 					const isListPage = getIsListPage( params );
 
+					// The existence of a 'front-page' supersedes every other setting.
+					const homeTemplateType =
+						params.postId?.includes( 'front-page' ) ||
+						params.postId === homeTemplate?.postId
+							? 'site-editor'
+							: undefined;
+
 					return (
 						<>
 							{ isListPage ? (
@@ -54,7 +61,9 @@ export default function EditSiteApp( { reboot } ) {
 								// Open the navigation sidebar by default when in the list page.
 								isDefaultOpen={ !! isListPage }
 								activeTemplateType={
-									isListPage ? params.postType : undefined
+									isListPage
+										? params.postType
+										: homeTemplateType
 								}
 							/>
 						</>

diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/index.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/index.js
@@ -39,7 +39,7 @@ function NavLink( { params, replace, ...props } ) {
 	return <NavigationItem { ...linkProps } { ...props } />;
 }
 
-const NavigationPanel = ( { activeItem = SITE_EDITOR_KEY } ) => {
+const NavigationPanel = ( { activeItem } ) => {
 	const { homeTemplate, isNavigationOpen, isTemplatePartsMode, siteTitle } =
 		useSelect( ( select ) => {
 			const { getEntityRecord } = select( coreDataStore );

diff --git a/packages/edit-site/src/index.js b/packages/edit-site/src/index.js
@@ -132,7 +132,13 @@ export function reinitializeEditor( target, settings ) {
 	window.addEventListener( 'dragover', ( e ) => e.preventDefault(), false );
 	window.addEventListener( 'drop', ( e ) => e.preventDefault(), false );
 
-	render( <EditSiteApp reboot={ reboot } />, target );
+	render(
+		<EditSiteApp
+			reboot={ reboot }
+			homeTemplate={ settings.__unstableHomeTemplate }
+		/>,
+		target
+	);
 }
 
 /**