Fix: Site Editor Template part is missing an icon in the sidebar

packages/editor/src/store/private-selectors.js

@@ -26,6 +26,7 @@ import {
 	getEntityFields as _getEntityFields,
 	isEntityReady as _isEntityReady,
 } from '../dataviews/store/private-selectors';
+import { getTemplatePartIcon } from '../utils';
 
 const EMPTY_INSERTION_POINT = {
 	rootClientId: undefined,
@@ -97,15 +98,21 @@ export const getPostIcon = createRegistrySelector(
 				postType === 'wp_template_part' ||
 				postType === 'wp_template'
 			) {
-				return (
-					(
-						select( coreStore ).getEntityRecord(
-							'root',
-							'__unstableBase'
-						)?.default_template_part_areas || []
-					).find( ( item ) => options.area === item.area )?.icon ||
-					layout
+				const templateAreas =
+					select( coreStore ).getEntityRecord(
+						'root',
+						'__unstableBase'
+					)?.default_template_part_areas || [];
+
+				const areaData = templateAreas.find(
+					( item ) => options.area === item.area
 				);
+
+				if ( areaData?.icon ) {
+					return getTemplatePartIcon( areaData.icon );
+				}
+
+				return layout;
 			}
 			if ( CARD_ICONS[ postType ] ) {
 				return CARD_ICONS[ postType ];

packages/editor/src/utils/get-template-part-icon.js

@@ -6,6 +6,7 @@ import {
 	footer as footerIcon,
 	sidebar as sidebarIcon,
 	symbolFilled as symbolFilledIcon,
+	layout as layoutIcon,
 } from '@wordpress/icons';
 /**
  * Helper function to retrieve the corresponding icon by name.
@@ -21,6 +22,8 @@ export function getTemplatePartIcon( iconName ) {
 		return footerIcon;
 	} else if ( 'sidebar' === iconName ) {
 		return sidebarIcon;
+	} else if ( 'layout' === iconName ) {
+		return layoutIcon;
 	}
 	return symbolFilledIcon;
 }

test/integration/fixtures/blocks/core__separator-color.json

@@ -4,8 +4,8 @@
 		"isValid": true,
 		"attributes": {
 			"opacity": "alpha-channel",
-			"backgroundColor": "accent",
-			"tagName": "hr"
+			"tagName": "hr",
+			"backgroundColor": "accent"
 		},
 		"innerBlocks": []
 	}

test/integration/fixtures/blocks/core__separator-custom-color.json

@@ -4,12 +4,12 @@
 		"isValid": true,
 		"attributes": {
 			"opacity": "alpha-channel",
+			"tagName": "hr",
 			"style": {
 				"color": {
 					"background": "#5da54c"
 				}
-			},
-			"tagName": "hr"
+			}
 		},
 		"innerBlocks": []
 	}