Block editor: pass patterns selector as setting (#58661)

Co-authored-by: ellatrix <ellatrix@git.wordpress.org>
Co-authored-by: jsnajdr <jsnajdr@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>

packages/block-editor/src/private-apis.js

@@ -26,6 +26,7 @@ import { usesContextKey } from './components/rich-text/format-edit';
 import { ExperimentalBlockCanvas } from './components/block-canvas';
 import { getDuotoneFilter } from './components/duotone/utils';
 import { useFlashEditableBlocks } from './components/use-flash-editable-blocks';
+import { selectBlockPatternsKey } from './store/private-keys';
 
 /**
  * Private @wordpress/block-editor APIs.
@@ -56,4 +57,5 @@ lock( privateApis, {
 	useReusableBlocksRenameHint,
 	usesContextKey,
 	useFlashEditableBlocks,
+	selectBlockPatternsKey,
 } );

packages/block-editor/src/store/index.js

@@ -10,7 +10,6 @@ import reducer from './reducer';
 import * as selectors from './selectors';
 import * as privateActions from './private-actions';
 import * as privateSelectors from './private-selectors';
-import * as resolvers from './resolvers';
 import * as actions from './actions';
 import { STORE_NAME } from './constants';
 import { unlock } from '../lock-unlock';
@@ -23,7 +22,6 @@ import { unlock } from '../lock-unlock';
 export const storeConfig = {
 	reducer,
 	selectors,
-	resolvers,
 	actions,
 };
 

packages/block-editor/src/store/private-keys.js

@@ -0,0 +1 @@
+export const selectBlockPatternsKey = Symbol( 'selectBlockPatternsKey' );

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

@@ -22,6 +22,7 @@ import { checkAllowListRecursive, getAllPatternsDependants } from './utils';
 import { INSERTER_PATTERN_TYPES } from '../components/inserter/block-patterns-tab/utils';
 import { STORE_NAME } from './constants';
 import { unlock } from '../lock-unlock';
+import { selectBlockPatternsKey } from './private-keys';
 
 export { getBlockSettings } from './get-block-settings';
 
@@ -250,10 +251,6 @@ export const getInserterMediaCategories = createSelector(
 	]
 );
 
-export function getFetchedPatterns( state ) {
-	return state.blockPatterns;
-}
-
 /**
  * Returns whether there is at least one allowed pattern for inner blocks children.
  * This is useful for deferring the parsing of all patterns until needed.
@@ -285,7 +282,7 @@ export const hasAllowedPatterns = createRegistrySelector( ( select ) =>
 			} );
 		},
 		( state, rootClientId ) => [
-			getAllPatternsDependants( state ),
+			getAllPatternsDependants( select )( state ),
 			state.settings.allowedBlockTypes,
 			state.settings.templateLock,
 			state.blockListSettings[ rootClientId ],
@@ -325,12 +322,12 @@ export const getAllPatterns = createRegistrySelector( ( select ) =>
 		return [
 			...userPatterns,
 			...__experimentalBlockPatterns,
-			...unlock( select( STORE_NAME ) ).getFetchedPatterns(),
+			...( state.settings[ selectBlockPatternsKey ]?.( select ) ?? [] ),
 		].filter(
 			( x, index, arr ) =>
 				index === arr.findIndex( ( y ) => x.name === y.name )
 		);
-	}, getAllPatternsDependants )
+	}, getAllPatternsDependants( select ) )
 );
 
 /**

packages/block-editor/src/store/reducer.js

@@ -2064,15 +2064,6 @@ function blockBindingsSources( state = {}, action ) {
 	return state;
 }
 
-function blockPatterns( state = [], action ) {
-	switch ( action.type ) {
-		case 'RECEIVE_BLOCK_PATTERNS':
-			return action.patterns;
-	}
-
-	return state;
-}
-
 const combinedReducers = combineReducers( {
 	blocks,
 	isDragging,
@@ -2105,7 +2096,6 @@ const combinedReducers = combineReducers( {
 	openedBlockSettingsMenu,
 	registeredInserterMediaCategories,
 	blockBindingsSources,
-	blockPatterns,
 } );
 
 function withAutomaticChangeReset( reducer ) {

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

@@ -2299,12 +2299,12 @@ export const __experimentalGetParsedPattern = createRegistrySelector(
 					__unstableSkipMigrationLogs: true,
 				} ),
 			};
-		}, getAllPatternsDependants )
+		}, getAllPatternsDependants( select ) )
 );
 
-const getAllowedPatternsDependants = ( state, rootClientId ) => {
+const getAllowedPatternsDependants = ( select ) => ( state, rootClientId ) => {
 	return [
-		...getAllPatternsDependants( state ),
+		...getAllPatternsDependants( select )( state ),
 		state.settings.allowedBlockTypes,
 		state.settings.templateLock,
 		state.blockListSettings[ rootClientId ],
@@ -2345,7 +2345,7 @@ export const __experimentalGetAllowedPatterns = createRegistrySelector(
 			);
 
 			return patternsAllowed;
-		}, getAllowedPatternsDependants );
+		}, getAllowedPatternsDependants( select ) );
 	}
 );
 
@@ -2384,7 +2384,7 @@ export const getPatternsByBlockTypes = createRegistrySelector( ( select ) =>
 			return filteredPatterns;
 		},
 		( state, blockNames, rootClientId ) =>
-			getAllowedPatternsDependants( state, rootClientId )
+			getAllowedPatternsDependants( select )( state, rootClientId )
 	)
 );
 
@@ -2458,7 +2458,7 @@ export const __experimentalGetPatternTransformItems = createRegistrySelector(
 				);
 			},
 			( state, blocks, rootClientId ) =>
-				getAllowedPatternsDependants( state, rootClientId )
+				getAllowedPatternsDependants( select )( state, rootClientId )
 		)
 );
 

packages/block-editor/src/store/utils.js

@@ -1,3 +1,8 @@
+/**
+ * Internal dependencies
+ */
+import { selectBlockPatternsKey } from './private-keys';
+
 export const checkAllowList = ( list, item, defaultResult = null ) => {
 	if ( typeof list === 'boolean' ) {
 		return list;
@@ -40,12 +45,12 @@ export const checkAllowListRecursive = ( blocks, allowedBlockTypes ) => {
 	return true;
 };
 
-export const getAllPatternsDependants = ( state ) => {
+export const getAllPatternsDependants = ( select ) => ( state ) => {
 	return [
 		state.settings.__experimentalBlockPatterns,
 		state.settings.__experimentalUserPatternCategories,
 		state.settings.__experimentalReusableBlocks,
-		state.settings.__experimentalFetchBlockPatterns,
+		state.settings[ selectBlockPatternsKey ]?.( select ),
 		state.blockPatterns,
 	];
 };

packages/core-data/src/private-selectors.ts

@@ -1,7 +1,18 @@
+/**
+ * External dependencies
+ */
+import createSelector from 'rememo';
+
+/**
+ * WordPress dependencies
+ */
+import { createRegistrySelector } from '@wordpress/data';
+
 /**
  * Internal dependencies
  */
 import type { State } from './selectors';
+import { STORE_NAME } from './name';
 
 type EntityRecordKey = string | number;
 
@@ -28,3 +39,19 @@ export function getNavigationFallbackId(
 ): EntityRecordKey | undefined {
 	return state.navigationFallbackId;
 }
+
+export const getBlockPatternsForPostType = createRegistrySelector(
+	( select: any ) =>
+		createSelector(
+			( state, postType ) =>
+				select( STORE_NAME )
+					.getBlockPatterns()
+					.filter(
+						( { postTypes } ) =>
+							! postTypes ||
+							( Array.isArray( postTypes ) &&
+								postTypes.includes( postType ) )
+					),
+			() => [ select( STORE_NAME ).getBlockPatterns() ]
+		)
+);

packages/editor/src/components/provider/use-block-editor-settings.js

@@ -7,19 +7,20 @@ import {
 	store as coreStore,
 	__experimentalFetchLinkSuggestions as fetchLinkSuggestions,
 	__experimentalFetchUrlData as fetchUrlData,
-	fetchBlockPatterns,
 } from '@wordpress/core-data';
 import { __ } from '@wordpress/i18n';
 import { store as preferencesStore } from '@wordpress/preferences';
 import { useViewportMatch } from '@wordpress/compose';
 import { store as blocksStore } from '@wordpress/blocks';
+import { privateApis } from '@wordpress/block-editor';
 
 /**
  * Internal dependencies
  */
 import inserterMediaCategories from '../media-categories';
 import { mediaUpload } from '../../utils';
 import { store as editorStore } from '../../store';
+import { unlock } from '../../lock-unlock';
 
 const EMPTY_BLOCKS_LIST = [];
 
@@ -247,17 +248,10 @@ function useBlockEditorSettings( settings, postType, postId ) {
 			keepCaretInsideBlock,
 			mediaUpload: hasUploadPermissions ? mediaUpload : undefined,
 			__experimentalBlockPatterns: blockPatterns,
-			__experimentalFetchBlockPatterns: async () => {
-				return ( await fetchBlockPatterns() ).filter(
-					( { postTypes } ) => {
-						return (
-							! postTypes ||
-							( Array.isArray( postTypes ) &&
-								postTypes.includes( postType ) )
-						);
-					}
-				);
-			},
+			[ unlock( privateApis ).selectBlockPatternsKey ]: ( select ) =>
+				unlock( select( coreStore ) ).getBlockPatternsForPostType(
+					postType
+				),
 			__experimentalReusableBlocks: reusableBlocks,
 			__experimentalBlockPatternCategories: blockPatternCategories,
 			__experimentalUserPatternCategories: userPatternCategories,