Use registered template part areas to display area detail

WordPress · Jul 20, 2023 · d7a1b4e · d7a1b4e
1 parent c729480
commit d7a1b4e
Showing 1 changed file with 11 additions and 8 deletions.
diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-pattern/use-pattern-details.js b/packages/edit-site/src/components/sidebar-navigation-screen-pattern/use-pattern-details.js
@@ -3,6 +3,7 @@
  */
 import { __, sprintf, _x } from '@wordpress/i18n';
 import { store as coreStore } from '@wordpress/core-data';
+import { store as editorStore } from '@wordpress/editor';
 import { useSelect } from '@wordpress/data';
 
 /**
@@ -27,6 +28,11 @@ export default function usePatternDetails( postType, postId ) {
 		postType,
 		postId
 	);
+	const templatePartAreas = useSelect(
+		( select ) =>
+			select( editorStore ).__experimentalGetDefaultTemplatePartAreas(),
+		[]
+	);
 	const currentTheme = useSelect(
 		( select ) => select( coreStore ).getCurrentTheme(),
 		[]
@@ -71,17 +77,14 @@ export default function usePatternDetails( postType, postId ) {
 		} );
 	}
 
-	const templatePartAreaLabels = {
-		header: __( 'Header' ),
-		footer: __( 'Footer' ),
-		sidebar: __( 'Sidebar' ),
-		uncategorized: __( 'General' ),
-	};
-
 	if ( postType === 'wp_template_part' ) {
+		const templatePartArea = templatePartAreas.find(
+			( area ) => area.area === record.area
+		);
+
 		details.push( {
 			label: __( 'Area' ),
-			value: templatePartAreaLabels[ record.area ],
+			value: templatePartArea?.label,
 		} );
 	}