From 635509e5d636caf25ccf2a11e34947a3d56d7fd3 Mon Sep 17 00:00:00 2001
From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com>
Date: Tue, 19 Sep 2023 15:55:53 +1000
Subject: [PATCH 1/2] Patterns: Move category map creation out of useSelect

---
 .../use-pattern-details.js                    | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 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
index fb6be8c7fa2f94..2095b2d9fb0951 100644
--- 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
@@ -10,6 +10,7 @@ import { __, sprintf } from '@wordpress/i18n';
 import { store as coreStore } from '@wordpress/core-data';
 import { store as editorStore } from '@wordpress/editor';
 import { useSelect } from '@wordpress/data';
+import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -35,21 +36,25 @@ export default function usePatternDetails( postType, postId ) {
 			select( editorStore ).__experimentalGetDefaultTemplatePartAreas(),
 		[]
 	);
-	const { currentTheme, patternCategories } = useSelect( ( select ) => {
+	const { currentTheme, userPatternCategories } = useSelect( ( select ) => {
 		const { getCurrentTheme, getUserPatternCategories } =
 			select( coreStore );
-		const userPatternCategories = getUserPatternCategories();
-		const categories = new Map();
-		userPatternCategories.forEach( ( userCategory ) =>
-			categories.set( userCategory.id, userCategory )
-		);
 
 		return {
 			currentTheme: getCurrentTheme(),
-			patternCategories: categories,
+			userPatternCategories: getUserPatternCategories(),
 		};
 	}, [] );
 
+	const patternCategories = useMemo( () => {
+		const categories = new Map();
+		userPatternCategories.forEach( ( userCategory ) =>
+			categories.set( userCategory.id, userCategory )
+		);
+
+		return categories;
+	}, [ userPatternCategories ] );
+
 	const addedBy = useAddedBy( postType, postId );
 	const isAddedByActiveTheme =
 		addedBy.type === 'theme' && record.theme === currentTheme?.stylesheet;

From 96dbc0e82c932bf564cdbd520d78ac344c4ba288 Mon Sep 17 00:00:00 2001
From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com>
Date: Tue, 19 Sep 2023 16:17:07 +1000
Subject: [PATCH 2/2] Skip the useMemo

---
 .../use-pattern-details.js                        | 15 +++++----------
 1 file changed, 5 insertions(+), 10 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
index 2095b2d9fb0951..674d95e02a13b1 100644
--- 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
@@ -10,7 +10,6 @@ import { __, sprintf } from '@wordpress/i18n';
 import { store as coreStore } from '@wordpress/core-data';
 import { store as editorStore } from '@wordpress/editor';
 import { useSelect } from '@wordpress/data';
-import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -46,15 +45,6 @@ export default function usePatternDetails( postType, postId ) {
 		};
 	}, [] );
 
-	const patternCategories = useMemo( () => {
-		const categories = new Map();
-		userPatternCategories.forEach( ( userCategory ) =>
-			categories.set( userCategory.id, userCategory )
-		);
-
-		return categories;
-	}, [ userPatternCategories ] );
-
 	const addedBy = useAddedBy( postType, postId );
 	const isAddedByActiveTheme =
 		addedBy.type === 'theme' && record.theme === currentTheme?.stylesheet;
@@ -106,6 +96,11 @@ export default function usePatternDetails( postType, postId ) {
 			} );
 		}
 		if ( record.wp_pattern_category?.length > 0 ) {
+			const patternCategories = new Map();
+			userPatternCategories.forEach( ( userCategory ) =>
+				patternCategories.set( userCategory.id, userCategory )
+			);
+
 			const categories = record.wp_pattern_category
 				.filter( ( category ) => patternCategories.get( category ) )
 				.map( ( category ) => patternCategories.get( category ).label );