diff --git a/packages/block-editor/src/components/provider/index.js b/packages/block-editor/src/components/provider/index.js
index fd788477a0d6d..f321b19dc1de8 100644
--- a/packages/block-editor/src/components/provider/index.js
+++ b/packages/block-editor/src/components/provider/index.js
@@ -3,9 +3,14 @@
*/
import { Component } from '@wordpress/element';
import { DropZoneProvider, SlotFillProvider } from '@wordpress/components';
-import { withDispatch, withRegistry } from '@wordpress/data';
+import { withDispatch } from '@wordpress/data';
import { compose } from '@wordpress/compose';
+/**
+ * Internal dependencies
+ */
+import withRegistryProvider from './with-registry-provider';
+
class BlockEditorProvider extends Component {
componentDidMount() {
this.props.updateSettings( this.props.settings );
@@ -115,6 +120,7 @@ class BlockEditorProvider extends Component {
}
export default compose( [
+ withRegistryProvider,
withDispatch( ( dispatch ) => {
const {
updateSettings,
@@ -126,5 +132,4 @@ export default compose( [
resetBlocks,
};
} ),
- withRegistry,
] )( BlockEditorProvider );
diff --git a/packages/block-editor/src/components/provider/with-registry-provider.js b/packages/block-editor/src/components/provider/with-registry-provider.js
new file mode 100644
index 0000000000000..cdb3b7fe7b2de
--- /dev/null
+++ b/packages/block-editor/src/components/provider/with-registry-provider.js
@@ -0,0 +1,41 @@
+/**
+ * WordPress dependencies
+ */
+import { useState, useEffect } from '@wordpress/element';
+import { withRegistry, createRegistry, RegistryProvider } from '@wordpress/data';
+import { createHigherOrderComponent } from '@wordpress/compose';
+
+/**
+ * Internal dependencies
+ */
+import { storeConfig } from '../../store';
+import applyMiddlewares from '../../store/middlewares';
+
+const withRegistryProvider = createHigherOrderComponent( ( WrappedComponent ) => {
+ return withRegistry( ( { useSubRegistry = true, registry, ...props } ) => {
+ if ( ! useSubRegistry ) {
+ return ;
+ }
+
+ const [ subRegistry, setSubRegistry ] = useState( null );
+ useEffect( () => {
+ const newRegistry = createRegistry( {}, registry );
+ const store = newRegistry.registerStore( 'core/block-editor', storeConfig );
+ // This should be removed after the refactoring of the effects to controls.
+ applyMiddlewares( store );
+ setSubRegistry( newRegistry );
+ }, [ registry ] );
+
+ if ( ! subRegistry ) {
+ return null;
+ }
+
+ return (
+
+
+
+ );
+ } );
+}, 'withRegistryProvider' );
+
+export default withRegistryProvider;
diff --git a/packages/block-editor/src/store/index.js b/packages/block-editor/src/store/index.js
index 0119e63d7a3d1..485238f46f606 100644
--- a/packages/block-editor/src/store/index.js
+++ b/packages/block-editor/src/store/index.js
@@ -17,11 +17,15 @@ import controls from './controls';
*/
const MODULE_KEY = 'core/block-editor';
-const store = registerStore( MODULE_KEY, {
+export const storeConfig = {
reducer,
selectors,
actions,
controls,
+};
+
+const store = registerStore( MODULE_KEY, {
+ ...storeConfig,
persist: [ 'preferences' ],
} );
applyMiddlewares( store );
diff --git a/packages/editor/src/components/provider/index.js b/packages/editor/src/components/provider/index.js
index ca1cbe0262686..54405f61247b8 100644
--- a/packages/editor/src/components/provider/index.js
+++ b/packages/editor/src/components/provider/index.js
@@ -154,6 +154,7 @@ class EditorProvider extends Component {
onInput={ resetEditorBlocksWithoutUndoLevel }
onChange={ resetEditorBlocks }
settings={ editorSettings }
+ useSubRegistry={ false }
>
{ children }