Reusable blocks support for widgets editor

WordPress · Oct 15, 2020 · 27c8023 · 27c8023
1 parent 7f7c24d
commit 27c8023
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 11 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/edit-widgets/package.json b/packages/edit-widgets/package.json
@@ -47,6 +47,7 @@
 		"@wordpress/media-utils": "file:../media-utils",
 		"@wordpress/notices": "file:../notices",
 		"@wordpress/plugins": "file:../plugins",
+		"@wordpress/reusable-blocks": "file:../reusable-blocks",
 		"@wordpress/server-side-render": "file:../server-side-render",
 		"@wordpress/url": "file:../url",
 		"classnames": "^2.2.5",

diff --git a/packages/edit-widgets/src/components/widget-areas-block-editor-provider/index.js b/packages/edit-widgets/src/components/widget-areas-block-editor-provider/index.js
@@ -19,6 +19,7 @@ import {
 	BlockEditorKeyboardShortcuts,
 	__unstableEditorStyles as EditorStyles,
 } from '@wordpress/block-editor';
+import { ReusableBlocksButtons } from '@wordpress/reusable-blocks';
 
 /**
  * Internal dependencies
@@ -29,15 +30,22 @@ import { buildWidgetAreasPostId, KIND, POST_TYPE } from '../../store/utils';
 
 export default function WidgetAreasBlockEditorProvider( {
 	blockEditorSettings,
+	children,
 	...props
 } ) {
-	const { hasUploadPermissions } = useSelect( ( select ) => ( {
-		hasUploadPermissions: defaultTo(
-			select( 'core' ).canUser( 'create', 'media' ),
-			true
-		),
-		widgetAreas: select( 'core/edit-widgets' ).getWidgetAreas(),
-	} ) );
+	const { hasUploadPermissions, reusableBlocks } = useSelect(
+		( select ) => ( {
+			hasUploadPermissions: defaultTo(
+				select( 'core' ).canUser( 'create', 'media' ),
+				true
+			),
+			widgetAreas: select( 'core/edit-widgets' ).getWidgetAreas(),
+			reusableBlocks: select( 'core' ).getEntityRecords(
+				'postType',
+				'wp_block'
+			),
+		} )
+	);
 
 	const settings = useMemo( () => {
 		let mediaUploadBlockEditor;
@@ -52,10 +60,11 @@ export default function WidgetAreasBlockEditorProvider( {
 		}
 		return {
 			...blockEditorSettings,
+			__experimentalReusableBlocks: reusableBlocks,
 			mediaUpload: mediaUploadBlockEditor,
 			templateLock: 'all',
 		};
-	}, [ blockEditorSettings, hasUploadPermissions ] );
+	}, [ blockEditorSettings, hasUploadPermissions, reusableBlocks ] );
 
 	const [ blocks, onInput, onChange ] = useEntityBlockEditor(
 		KIND,
@@ -78,7 +87,10 @@ export default function WidgetAreasBlockEditorProvider( {
 							settings={ settings }
 							useSubRegistry={ false }
 							{ ...props }
-						/>
+						>
+							{ children }
+							<ReusableBlocksButtons />
+						</BlockEditorProvider>
 					</FocusReturnProvider>
 				</DropZoneProvider>
 			</SlotFillProvider>