[Patterns]: Reorder pattern categories (#47760)

packages/block-editor/src/components/inserter/block-patterns-tab.js

@@ -28,6 +28,19 @@ import BlockPatternList from '../block-patterns-list';
 import PatternsExplorerModal from './block-patterns-explorer/explorer';
 import MobileTabNavigation from './mobile-tab-navigation';
 
+// Preffered order of pattern categories. Any other categories should
+// be at the bottom without any re-ordering.
+const patternCategoriesOrder = [
+	'featured',
+	'posts',
+	'text',
+	'gallery',
+	'call-to-action',
+	'banner',
+	'header',
+	'footer',
+];
+
 function usePatternsCategories( rootClientId ) {
 	const [ allPatterns, allCategories ] = usePatternsState(
 		undefined,
@@ -56,17 +69,27 @@ function usePatternsCategories( rootClientId ) {
 				)
 			)
 			.sort( ( { name: currentName }, { name: nextName } ) => {
+				// The pattern categories should be ordered as follows:
+				// 1. The categories from `patternCategoriesOrder` in that specific order should be at the top.
+				// 2. The rest categories should be at the bottom without any re-ordering.
 				if (
 					! [ currentName, nextName ].some( ( categoryName ) =>
-						[ 'featured', 'text' ].includes( categoryName )
+						patternCategoriesOrder.includes( categoryName )
 					)
 				) {
 					return 0;
 				}
-				// Move `featured` category to the top and `text` to the bottom.
-				return currentName === 'featured' || nextName === 'text'
-					? -1
-					: 1;
+				if (
+					[ currentName, nextName ].every( ( categoryName ) =>
+						patternCategoriesOrder.includes( categoryName )
+					)
+				) {
+					return (
+						patternCategoriesOrder.indexOf( currentName ) -
+						patternCategoriesOrder.indexOf( nextName )
+					);
+				}
+				return patternCategoriesOrder.includes( currentName ) ? -1 : 1;
 			} );
 
 		if (