From 7305ed33dc6909d05b31145314204ad500b930b2 Mon Sep 17 00:00:00 2001
From: Matt Wiebe <wiebe@automattic.com>
Date: Tue, 3 Nov 2020 08:52:43 -0600
Subject: [PATCH] Site Editor: reorder template creation dropdown (#26610)

The items were previously in alphabetical order by slug, as with any keyed JS object.
This allowed '404' to be first, which is not a very important template.
---
 .../navigation-panel/new-template-dropdown.js | 10 +--
 .../src/utils/get-template-info/constants.js  | 65 ++++++++++---------
 .../src/utils/get-template-info/index.js      |  7 +-
 3 files changed, 48 insertions(+), 34 deletions(-)

diff --git a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js
index 8ecfce1a18b75e..1248d2948d9d63 100644
--- a/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js
+++ b/packages/edit-site/src/components/navigation-sidebar/navigation-panel/new-template-dropdown.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { map, omit } from 'lodash';
+import { map, filter, includes } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -46,9 +46,11 @@ export default function NewTemplateDropdown() {
 		} );
 	};
 
-	const missingTemplates = omit(
+	const existingTemplateSlugs = map( templates, 'slug' );
+
+	const missingTemplates = filter(
 		TEMPLATES_DEFAULT_DETAILS,
-		map( templates, 'slug' )
+		( template ) => ! includes( existingTemplateSlugs, template.slug )
 	);
 
 	return (
@@ -70,7 +72,7 @@ export default function NewTemplateDropdown() {
 					<MenuGroup label={ __( 'Add Template' ) }>
 						{ map(
 							missingTemplates,
-							( { title, description }, slug ) => (
+							( { title, description, slug } ) => (
 								<MenuItem
 									info={ description }
 									key={ slug }
diff --git a/packages/edit-site/src/utils/get-template-info/constants.js b/packages/edit-site/src/utils/get-template-info/constants.js
index c6facdbce79fea..0b0ccee1ecd262 100644
--- a/packages/edit-site/src/utils/get-template-info/constants.js
+++ b/packages/edit-site/src/utils/get-template-info/constants.js
@@ -3,48 +3,55 @@
  */
 import { __, _x } from '@wordpress/i18n';
 
-export const TEMPLATES_DEFAULT_DETAILS = {
-	// General
-	'front-page': {
+/**
+ * Default template details, ordered by perceived importance
+ */
+export const TEMPLATES_DEFAULT_DETAILS = [
+	{
+		slug: 'front-page',
 		title: _x( 'Front Page', 'template name' ),
 		description: __(
 			'Front page template, whether it displays the blog posts index or a static page'
 		),
 	},
-	archive: {
-		title: _x( 'Archive', 'template name' ),
-		description: __( 'Generic archive template' ),
-	},
-	singular: {
-		title: _x( 'Singular', 'template name' ),
-		description: __( 'Default template for both single posts and pages' ),
-	},
-	index: {
+	{
+		slug: 'index',
 		title: _x( 'Index', 'template name' ),
 		description: __( 'Default template' ),
 	},
-	search: {
-		title: _x( 'Search Results', 'template name' ),
-		description: __( 'Search results template' ),
-	},
-	'404': {
-		title: _x( '404 (Not Found)', 'template name' ),
-		description: __( 'Template for "not found" errors' ),
+	{
+		slug: 'home',
+		title: __( 'Home Page' ),
+		description: __( 'Template for the latest blog posts' ),
 	},
-
-	// Pages
-	page: {
+	{
+		slug: 'page',
 		title: __( 'Single Page' ),
 		description: __( 'Template for single pages' ),
 	},
-
-	// Posts
-	home: {
-		title: __( 'Home Page' ),
-		description: __( 'Template for the latest blog posts' ),
+	{
+		slug: 'singular',
+		title: _x( 'Singular', 'template name' ),
+		description: __( 'Default template for both single posts and pages' ),
 	},
-	single: {
+	{
+		slug: 'single',
 		title: __( 'Single Post' ),
 		description: __( 'Template for single posts' ),
 	},
-};
+	{
+		slug: 'archive',
+		title: _x( 'Archive', 'template name' ),
+		description: __( 'Generic archive template' ),
+	},
+	{
+		slug: 'search',
+		title: _x( 'Search Results', 'template name' ),
+		description: __( 'Search results template' ),
+	},
+	{
+		slug: '404',
+		title: _x( '404 (Not Found)', 'template name' ),
+		description: __( 'Template for "not found" errors' ),
+	},
+];
diff --git a/packages/edit-site/src/utils/get-template-info/index.js b/packages/edit-site/src/utils/get-template-info/index.js
index 71b7bd602931e5..b397237d65831a 100644
--- a/packages/edit-site/src/utils/get-template-info/index.js
+++ b/packages/edit-site/src/utils/get-template-info/index.js
@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import { find } from 'lodash';
+
 /**
  * Internal dependencies
  */
@@ -15,7 +20,7 @@ export default function getTemplateInfo( template ) {
 		return {};
 	}
 	const { title: defaultTitle, description: defaultDescription } =
-		TEMPLATES_DEFAULT_DETAILS[ template.slug ] ?? {};
+		find( TEMPLATES_DEFAULT_DETAILS, { slug: template?.slug } ) ?? {};
 
 	let title = template?.title?.rendered ?? template.slug;
 	if ( title !== template.slug ) {