From d44a08240d47b24267e00a33ac00831cb3e792aa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?D=C3=A1vid=20Szab=C3=B3?= <david.szabo97@gmail.com>
Date: Mon, 23 Nov 2020 18:51:21 +0100
Subject: [PATCH] Navigation panel: Hide empty menus (#27141)

Hides empty menus in the navigation panel. Namely Templates -> Pages and Templates -> Posts.
---
 .../navigation-panel/menus/templates-pages.js      |  6 +++---
 .../navigation-panel/menus/templates-posts.js      | 14 ++++++++------
 .../navigation-panel/menus/templates.js            |  2 ++
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-pages.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-pages.js
index 1b000d83e12f0..d4816219a0239 100644
--- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-pages.js
+++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-pages.js
@@ -20,15 +20,15 @@ import { MENU_TEMPLATES, MENU_TEMPLATES_PAGES } from '../constants';
 
 export default function TemplatesPagesMenu( { templates } ) {
 	const defaultTemplate = templates?.find( ( { slug } ) => slug === 'page' );
-	const specificTemplates = templates?.filter( ( { slug } ) =>
-		slug.startsWith( 'page-' )
-	);
+	const specificTemplates =
+		templates?.filter( ( { slug } ) => slug.startsWith( 'page-' ) ) ?? [];
 
 	return (
 		<NavigationMenu
 			menu={ MENU_TEMPLATES_PAGES }
 			title={ __( 'Pages' ) }
 			parentMenu={ MENU_TEMPLATES }
+			isEmpty={ ! defaultTemplate && specificTemplates.length === 0 }
 		>
 			<NavigationGroup title={ _x( 'Specific', 'specific templates' ) }>
 				{ map( specificTemplates, ( template ) => (
diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-posts.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-posts.js
index 5af56fe7a58d0..02225ee5bfb24 100644
--- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-posts.js
+++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates-posts.js
@@ -23,18 +23,20 @@ import {
 } from '../constants';
 
 export default function TemplatesPostsMenu( { templates } ) {
-	const generalTemplates = templates?.filter( ( { slug } ) =>
-		TEMPLATES_POSTS.includes( slug )
-	);
-	const specificTemplates = templates?.filter( ( { slug } ) =>
-		slug.startsWith( 'post-' )
-	);
+	const generalTemplates =
+		templates?.filter( ( { slug } ) => TEMPLATES_POSTS.includes( slug ) ) ??
+		[];
+	const specificTemplates =
+		templates?.filter( ( { slug } ) => slug.startsWith( 'post-' ) ) ?? [];
 
 	return (
 		<NavigationMenu
 			menu={ MENU_TEMPLATES_POSTS }
 			title={ __( 'Posts' ) }
 			parentMenu={ MENU_TEMPLATES }
+			isEmpty={
+				generalTemplates.length === 0 && specificTemplates.length === 0
+			}
 		>
 			<NavigationGroup title={ _x( 'Specific', 'specific templates' ) }>
 				{ map( specificTemplates, ( template ) => (
diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js
index f1f188b6d7a3b..e96aaef7f8d99 100644
--- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js
+++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/menus/templates.js
@@ -65,10 +65,12 @@ export default function TemplatesMenu() {
 			<NavigationItem
 				navigateToMenu={ MENU_TEMPLATES_PAGES }
 				title={ __( 'Pages' ) }
+				hideIfTargetMenuEmpty
 			/>
 			<NavigationItem
 				navigateToMenu={ MENU_TEMPLATES_POSTS }
 				title={ __( 'Posts' ) }
+				hideIfTargetMenuEmpty
 			/>
 			<TemplatesPostsMenu templates={ templates } />
 			<TemplatesPagesMenu templates={ templates } />