From 5fadae527b3a4ceef0876172a55b4217d2024f74 Mon Sep 17 00:00:00 2001
From: Aki Hamano <54422211+t-hamano@users.noreply.github.com>
Date: Mon, 17 Jul 2023 22:18:12 +0900
Subject: [PATCH] Site Editor: Don't allow creating template part on the
 Patterns page for non-block themes (#52656)

* Don't allow template part to be created on the Patterns page for non-block themes

* Remove unnecessary theme directory name in E2E test
---
 .../src/components/add-new-pattern/index.js   | 10 ++++-
 .../specs/site-editor/hybrid-theme.spec.js    | 41 +++++++++++++++++++
 2 files changed, 49 insertions(+), 2 deletions(-)
 create mode 100644 test/e2e/specs/site-editor/hybrid-theme.spec.js

diff --git a/packages/edit-site/src/components/add-new-pattern/index.js b/packages/edit-site/src/components/add-new-pattern/index.js
index 9a60c6555108d6..7a820558bc3acc 100644
--- a/packages/edit-site/src/components/add-new-pattern/index.js
+++ b/packages/edit-site/src/components/add-new-pattern/index.js
@@ -5,6 +5,7 @@ import { DropdownMenu } from '@wordpress/components';
 import { useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { plus, symbol, symbolFilled } from '@wordpress/icons';
+import { useSelect } from '@wordpress/data';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 
 /**
@@ -14,6 +15,7 @@ import CreatePatternModal from '../create-pattern-modal';
 import CreateTemplatePartModal from '../create-template-part-modal';
 import SidebarButton from '../sidebar-button';
 import { unlock } from '../../lock-unlock';
+import { store as editSiteStore } from '../../store';
 
 const { useHistory } = unlock( routerPrivateApis );
 
@@ -22,6 +24,10 @@ export default function AddNewPattern() {
 	const [ showPatternModal, setShowPatternModal ] = useState( false );
 	const [ showTemplatePartModal, setShowTemplatePartModal ] =
 		useState( false );
+	const isTemplatePartsMode = useSelect( ( select ) => {
+		const settings = select( editSiteStore ).getSettings();
+		return !! settings.supportsTemplatePartsMode;
+	}, [] );
 
 	function handleCreatePattern( { pattern, categoryId } ) {
 		setShowPatternModal( false );
@@ -55,7 +61,7 @@ export default function AddNewPattern() {
 		<>
 			<DropdownMenu
 				controls={ [
-					{
+					! isTemplatePartsMode && {
 						icon: symbolFilled,
 						onClick: () => setShowTemplatePartModal( true ),
 						title: __( 'Create template part' ),
@@ -65,7 +71,7 @@ export default function AddNewPattern() {
 						onClick: () => setShowPatternModal( true ),
 						title: __( 'Create pattern' ),
 					},
-				] }
+				].filter( Boolean ) }
 				toggleProps={ {
 					as: SidebarButton,
 				} }
diff --git a/test/e2e/specs/site-editor/hybrid-theme.spec.js b/test/e2e/specs/site-editor/hybrid-theme.spec.js
new file mode 100644
index 00000000000000..9d5def2caf71fc
--- /dev/null
+++ b/test/e2e/specs/site-editor/hybrid-theme.spec.js
@@ -0,0 +1,41 @@
+/**
+ * WordPress dependencies
+ */
+const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );
+
+test.describe( 'Hybrid theme', () => {
+	test.beforeAll( async ( { requestUtils } ) => {
+		await requestUtils.activateTheme( 'emptyhybrid' );
+	} );
+
+	test.afterAll( async ( { requestUtils } ) => {
+		await requestUtils.activateTheme( 'twentytwentyone' );
+	} );
+
+	test( 'should not show the Add Template Part button', async ( {
+		admin,
+		page,
+	} ) => {
+		await admin.visitAdminPage(
+			'/site-editor.php',
+			'postType=wp_template_part&path=/wp_template_part/all'
+		);
+
+		await expect(
+			page.locator( 'role=button[name="Add New Template Part"i]' )
+		).toBeHidden();
+
+		// Back to Patterns page.
+		await page.click(
+			'role=region[name="Navigation"i] >> role=button[name="Back"i]'
+		);
+
+		await page.click(
+			'role=region[name="Navigation"i] >> role=button[name="Create pattern"i]'
+		);
+
+		await expect(
+			page.locator( 'role=menuitem[name="Create template part"i]' )
+		).toBeHidden();
+	} );
+} );