From f6e3ec436f0d551918b11a27e1e05587eb69bae2 Mon Sep 17 00:00:00 2001
From: Lourens Schep <lourensschep@gmail.com>
Date: Tue, 10 Dec 2024 16:35:17 +0100
Subject: [PATCH] All template usage for bulk editing

---
 packages/fields/src/fields/template/index.ts  |  1 -
 .../src/fields/template/template-edit.tsx     | 43 ++++++++++++-------
 2 files changed, 27 insertions(+), 17 deletions(-)

diff --git a/packages/fields/src/fields/template/index.ts b/packages/fields/src/fields/template/index.ts
index 825c17b40dd067..c419adedb537dd 100644
--- a/packages/fields/src/fields/template/index.ts
+++ b/packages/fields/src/fields/template/index.ts
@@ -16,7 +16,6 @@ const templateField: Field< BasePost > = {
 	label: __( 'Template' ),
 	Edit: TemplateEdit,
 	enableSorting: false,
-	supportsBulkEditing: false,
 };
 
 /**
diff --git a/packages/fields/src/fields/template/template-edit.tsx b/packages/fields/src/fields/template/template-edit.tsx
index a9fb052edffcb0..4df0ab62f4d42e 100644
--- a/packages/fields/src/fields/template/template-edit.tsx
+++ b/packages/fields/src/fields/template/template-edit.tsx
@@ -6,7 +6,7 @@ import { useCallback, useMemo, useState } from '@wordpress/element';
 import { parse } from '@wordpress/blocks';
 import type { WpTemplate } from '@wordpress/core-data';
 import { store as coreStore } from '@wordpress/core-data';
-import type { DataFormControlPropsWithoutBulkEditing } from '@wordpress/dataviews';
+import type { DataFormControlProps } from '@wordpress/dataviews';
 
 /**
  * Internal dependencies
@@ -33,12 +33,10 @@ export const TemplateEdit = ( {
 	field,
 	onChange,
 	value,
-}: DataFormControlPropsWithoutBulkEditing< BasePost, string > ) => {
+}: DataFormControlProps< BasePost, string > ) => {
 	const { id } = field;
-	const postType = data.type;
-	const postId =
-		typeof data.id === 'number' ? data.id : parseInt( data.id, 10 );
-	const slug = data.slug;
+	const postType = Array.isArray( data ) ? data[ 0 ].type : data.type;
+	const slug = Array.isArray( data ) ? '' : data.slug;
 
 	const { availableTemplates, templates } = useSelect(
 		( select ) => {
@@ -56,11 +54,18 @@ export const TemplateEdit = ( {
 				select( coreStore )
 			);
 
-			const isPostsPage = +getPostsPageId() === postId;
-			const isFrontPage =
-				postType === 'page' && +getHomePage()?.postId === postId;
+			const posts = Array.isArray( data ) ? data : [ data ];
 
-			const allowSwitchingTemplate = ! isPostsPage && ! isFrontPage;
+			const allowSwitchingTemplate = posts.every( ( post ) => {
+				const postId =
+					typeof post.id === 'number'
+						? post.id
+						: parseInt( post.id, 10 );
+				const isPostsPage = +getPostsPageId() === postId;
+				const isFrontPage =
+					postType === 'page' && +getHomePage()?.postId === postId;
+				return ! isPostsPage && ! isFrontPage;
+			} );
 
 			return {
 				templates: allTemplates,
@@ -74,7 +79,7 @@ export const TemplateEdit = ( {
 					: [],
 			};
 		},
-		[ value, postId, postType ]
+		[ value, postType, data ]
 	);
 
 	const templatesAsPatterns = useMemo(
@@ -140,6 +145,13 @@ export const TemplateEdit = ( {
 		[ id, onChange ]
 	);
 
+	let buttonLabel = '';
+	if ( typeof value === 'symbol' ) {
+		buttonLabel = __( 'Mixed' );
+	} else if ( currentTemplate ) {
+		buttonLabel = getItemTitle( currentTemplate );
+	}
+
 	return (
 		<fieldset className="fields-controls__template">
 			<Dropdown
@@ -152,12 +164,11 @@ export const TemplateEdit = ( {
 						onClick={ onToggle }
 						accessibleWhenDisabled
 						disabled={
-							availableTemplates.length === 0 && value === ''
+							availableTemplates.length === 0 &&
+							( value === '' || typeof value === 'symbol' )
 						}
 					>
-						{ currentTemplate
-							? getItemTitle( currentTemplate )
-							: '' }
+						{ buttonLabel }
 					</Button>
 				) }
 				renderContent={ ( { onToggle } ) => (
@@ -174,7 +185,7 @@ export const TemplateEdit = ( {
 						) }
 						{
 							// The default template in a post is indicated by an empty string
-							value !== '' && (
+							value !== '' && typeof value !== 'symbol' && (
 								<MenuItem
 									onClick={ () => {
 										onChangeControl( '' );