Update: Avoid usage of editor store on block editor reusable blocks i…

…nserter (#18784)

packages/block-editor/src/components/inserter/menu.js

@@ -124,8 +124,9 @@ export class InserterMenu extends Component {
 	}
 
 	componentDidMount() {
-		// This could be replaced by a resolver.
-		this.props.fetchReusableBlocks();
+		if ( this.props.fetchReusableBlocks ) {
+			this.props.fetchReusableBlocks();
+		}
 		this.filter();
 	}
 
@@ -476,11 +477,17 @@ export default compose(
 		}
 		const destinationRootBlockName = getBlockName( destinationRootClientId );
 
+		const {
+			showInserterHelpPanel: showInserterHelpPanelSetting,
+			__experimentalFetchReusableBlocks: fetchReusableBlocks,
+		} = getSettings();
+
 		return {
 			rootChildBlocks: getChildBlockNames( destinationRootBlockName ),
 			items: getInserterItems( destinationRootClientId ),
-			showInserterHelpPanel: showInserterHelpPanel && getSettings().showInserterHelpPanel,
+			showInserterHelpPanel: showInserterHelpPanel && showInserterHelpPanelSetting,
 			destinationRootClientId,
+			fetchReusableBlocks,
 		};
 	} ),
 	withDispatch( ( dispatch, ownProps, { select } ) => {
@@ -489,11 +496,6 @@ export default compose(
 			hideInsertionPoint,
 		} = dispatch( 'core/block-editor' );
 
-		// This should be an external action provided in the editor settings.
-		const {
-			__experimentalFetchReusableBlocks: fetchReusableBlocks,
-		} = dispatch( 'core/editor' );
-
 		// To avoid duplication, getInsertionIndex is extracted and used in two event handlers
 		// This breaks the withDispatch not containing any logic rule.
 		// Since it's a function only called when the event handlers are called,
@@ -523,7 +525,6 @@ export default compose(
 		}
 
 		return {
-			fetchReusableBlocks,
 			showInsertionPoint() {
 				const index = getInsertionIndex();
 				showInsertionPoint( ownProps.destinationRootClientId, index );

packages/editor/src/components/provider/index.js

@@ -77,6 +77,7 @@ class EditorProvider extends Component {
 	getBlockEditorSettings(
 		settings,
 		reusableBlocks,
+		__experimentalFetchReusableBlocks,
 		hasUploadPermissions,
 		canUserUseUnfilteredHTML
 	) {
@@ -111,6 +112,7 @@ class EditorProvider extends Component {
 			] ),
 			mediaUpload: hasUploadPermissions ? mediaUpload : undefined,
 			__experimentalReusableBlocks: reusableBlocks,
+			__experimentalFetchReusableBlocks,
 			__experimentalFetchLinkSuggestions: fetchLinkSuggestions,
 			__experimentalCanUserUseUnfilteredHTML: canUserUseUnfilteredHTML,
 		};
@@ -158,6 +160,7 @@ class EditorProvider extends Component {
 			reusableBlocks,
 			resetEditorBlocksWithoutUndoLevel,
 			hasUploadPermissions,
+			__experimentalFetchReusableBlocks,
 		} = this.props;
 
 		if ( ! isReady ) {
@@ -167,6 +170,7 @@ class EditorProvider extends Component {
 		const editorSettings = this.getBlockEditorSettings(
 			settings,
 			reusableBlocks,
+			__experimentalFetchReusableBlocks,
 			hasUploadPermissions,
 			canUserUseUnfilteredHTML,
 		);
@@ -222,6 +226,7 @@ export default compose( [
 			updatePostLock,
 			resetEditorBlocks,
 			updateEditorSettings,
+			__experimentalFetchReusableBlocks,
 			__experimentalTearDownEditor,
 		} = dispatch( 'core/editor' );
 		const { createWarningNotice } = dispatch( 'core/notices' );
@@ -239,6 +244,7 @@ export default compose( [
 				} );
 			},
 			tearDownEditor: __experimentalTearDownEditor,
+			__experimentalFetchReusableBlocks,
 		};
 	} ),
 ] )( EditorProvider );