Patterns: Add editing of pattern categories to site editor (#54640)

--------- Co-authored-by: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com>
WordPress · Sep 20, 2023 · da7c28d · da7c28d · github-actions · Sep 20, 2023
1 parent 481783b
commit da7c28d
Show file tree

Hide file tree

Showing 3 changed files with 317 additions and 38 deletions.
diff --git a/packages/edit-site/src/components/sidebar-edit-mode/template-panel/index.js b/packages/edit-site/src/components/sidebar-edit-mode/template-panel/index.js
@@ -2,11 +2,10 @@
  * WordPress dependencies
  */
 import { useSelect } from '@wordpress/data';
-import { PanelRow, PanelBody } from '@wordpress/components';
+import { PanelBody } from '@wordpress/components';
 import { store as editorStore } from '@wordpress/editor';
 import { store as coreStore } from '@wordpress/core-data';
 import { decodeEntities } from '@wordpress/html-entities';
-import { __ } from '@wordpress/i18n';
 import { navigation, symbol } from '@wordpress/icons';
 
 /**
@@ -17,31 +16,38 @@ import TemplateActions from './template-actions';
 import TemplateAreas from './template-areas';
 import LastRevision from './last-revision';
 import SidebarCard from '../sidebar-card';
+import PatternCategories from './pattern-categories';
+import { PATTERN_TYPES } from '../../../utils/constants';
 
 const CARD_ICONS = {
 	wp_block: symbol,
 	wp_navigation: navigation,
 };
 
 export default function TemplatePanel() {
-	const { title, description, icon, record } = useSelect( ( select ) => {
-		const { getEditedPostType, getEditedPostId } = select( editSiteStore );
-		const { getEditedEntityRecord } = select( coreStore );
-		const { __experimentalGetTemplateInfo: getTemplateInfo } =
-			select( editorStore );
+	const { title, description, icon, record, postType } = useSelect(
+		( select ) => {
+			const { getEditedPostType, getEditedPostId } =
+				select( editSiteStore );
+			const { getEditedEntityRecord } = select( coreStore );
+			const { __experimentalGetTemplateInfo: getTemplateInfo } =
+				select( editorStore );
 
-		const postType = getEditedPostType();
-		const postId = getEditedPostId();
-		const _record = getEditedEntityRecord( 'postType', postType, postId );
-		const info = getTemplateInfo( _record );
+			const type = getEditedPostType();
+			const postId = getEditedPostId();
+			const _record = getEditedEntityRecord( 'postType', type, postId );
+			const info = getTemplateInfo( _record );
 
-		return {
-			title: info.title,
-			description: info.description,
-			icon: info.icon,
-			record: _record,
-		};
-	}, [] );
+			return {
+				title: info.title,
+				description: info.description,
+				icon: info.icon,
+				record: _record,
+				postType: type,
+			};
+		},
+		[]
+	);
 
 	if ( ! title && ! description ) {
 		return null;
@@ -58,12 +64,10 @@ export default function TemplatePanel() {
 			>
 				<TemplateAreas />
 			</SidebarCard>
-			<PanelRow
-				header={ __( 'Editing history' ) }
-				className="edit-site-template-revisions"
-			>
-				<LastRevision />
-			</PanelRow>
+			<LastRevision />
+			{ postType === PATTERN_TYPES.user && (
+				<PatternCategories post={ record } />
+			) }
 		</PanelBody>
 	);
 }
diff --git a/packages/edit-site/src/components/sidebar-edit-mode/template-panel/last-revision.js b/packages/edit-site/src/components/sidebar-edit-mode/template-panel/last-revision.js
@@ -1,8 +1,8 @@
 /**
  * WordPress dependencies
  */
-import { Button } from '@wordpress/components';
-import { sprintf, _n } from '@wordpress/i18n';
+import { Button, PanelRow } from '@wordpress/components';
+import { sprintf, _n, __ } from '@wordpress/i18n';
 import { backup } from '@wordpress/icons';
 import { addQueryArgs } from '@wordpress/url';
 import { PostTypeSupportCheck } from '@wordpress/editor';
@@ -47,19 +47,24 @@ const PostLastRevision = () => {
 
 	return (
 		<PostLastRevisionCheck>
-			<Button
-				href={ addQueryArgs( 'revision.php', {
-					revision: lastRevisionId,
-				} ) }
-				className="edit-site-template-last-revision__title"
-				icon={ backup }
+			<PanelRow
+				header={ __( 'Editing history' ) }
+				className="edit-site-template-revisions"
 			>
-				{ sprintf(
-					/* translators: %d: number of revisions */
-					_n( '%d Revision', '%d Revisions', revisionsCount ),
-					revisionsCount
-				) }
-			</Button>
+				<Button
+					href={ addQueryArgs( 'revision.php', {
+						revision: lastRevisionId,
+					} ) }
+					className="edit-site-template-last-revision__title"
+					icon={ backup }
+				>
+					{ sprintf(
+						/* translators: %d: number of revisions */
+						_n( '%d Revision', '%d Revisions', revisionsCount ),
+						revisionsCount
+					) }
+				</Button>
+			</PanelRow>
 		</PostLastRevisionCheck>
 	);
 };