Allow core widgets to be used in the legacy widgets block

lib/widgets.php

@@ -102,18 +102,17 @@ function gutenberg_get_legacy_widget_settings() {
 	$available_legacy_widgets          = array();
 	global $wp_widget_factory, $wp_registered_widgets;
 	foreach ( $wp_widget_factory->widgets as $class => $widget_obj ) {
-		if ( ! in_array( $class, $core_widgets ) ) {
-			$available_legacy_widgets[ $class ] = array(
-				'name'             => html_entity_decode( $widget_obj->name ),
-				// wp_widget_description is not being used because its input parameter is a Widget Id.
-				// Widgets id's reference to a specific widget instance.
-				// Here we are iterating on all the available widget classes even if no widget instance exists for them.
-				'description'      => isset( $widget_obj->widget_options['description'] ) ?
-					html_entity_decode( $widget_obj->widget_options['description'] ) :
-					null,
-				'isCallbackWidget' => false,
-			);
-		}
+		$available_legacy_widgets[ $class ] = array(
+			'name'             => html_entity_decode( $widget_obj->name ),
+			// wp_widget_description is not being used because its input parameter is a Widget Id.
+			// Widgets id's reference to a specific widget instance.
+			// Here we are iterating on all the available widget classes even if no widget instance exists for them.
+			'description'      => isset( $widget_obj->widget_options['description'] ) ?
+				html_entity_decode( $widget_obj->widget_options['description'] ) :
+				null,
+			'isCallbackWidget' => false,
+			'isHidden'         => in_array( $class, $core_widgets, true ),
+		);
 	}
 	foreach ( $wp_registered_widgets as $widget_id => $widget_obj ) {
 		if (

packages/block-library/src/legacy-widget/edit/index.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { map } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -11,15 +6,12 @@ import {
 	Button,
 	IconButton,
 	PanelBody,
-	Placeholder,
-	SelectControl,
 	Toolbar,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { withSelect } from '@wordpress/data';
 import {
 	BlockControls,
-	BlockIcon,
 	InspectorControls,
 } from '@wordpress/block-editor';
 import { ServerSideRender } from '@wordpress/editor';
@@ -28,6 +20,7 @@ import { ServerSideRender } from '@wordpress/editor';
  * Internal dependencies
  */
 import LegacyWidgetEditHandler from './handler';
+import LegacyWidgetPlaceholder from './placeholder';
 
 class LegacyWidgetEdit extends Component {
 	constructor() {
@@ -51,41 +44,17 @@ class LegacyWidgetEdit extends Component {
 		const { identifier, isCallbackWidget } = attributes;
 		const widgetObject = identifier && availableLegacyWidgets[ identifier ];
 		if ( ! widgetObject ) {
-			let placeholderContent;
-
-			if ( ! hasPermissionsToManageWidgets ) {
-				placeholderContent = __( 'You don\'t have permissions to use widgets on this site.' );
-			} else if ( availableLegacyWidgets.length === 0 ) {
-				placeholderContent = __( 'There are no widgets available.' );
-			} else {
-				placeholderContent = (
-					<SelectControl
-						label={ __( 'Select a legacy widget to display:' ) }
-						value={ identifier || 'none' }
-						onChange={ ( value ) => setAttributes( {
-							instance: {},
-							identifier: value,
-							isCallbackWidget: availableLegacyWidgets[ value ].isCallbackWidget,
-						} ) }
-						options={ [ { value: 'none', label: 'Select widget' } ].concat(
-							map( availableLegacyWidgets, ( widget, key ) => {
-								return {
-									value: key,
-									label: widget.name,
-								};
-							} )
-						) }
-					/>
-				);
-			}
-
 			return (
-				<Placeholder
-					icon={ <BlockIcon icon="admin-customizer" /> }
-					label={ __( 'Legacy Widget' ) }
-				>
-					{ placeholderContent }
-				</Placeholder>
+				<LegacyWidgetPlaceholder
+					availableLegacyWidgets={ availableLegacyWidgets }
+					currentWidget={ identifier }
+					hasPermissionsToManageWidgets={ hasPermissionsToManageWidgets }
+					onChangeWidget={ ( newWidget ) => setAttributes( {
+						instance: {},
+						identifier: newWidget,
+						isCallbackWidget: availableLegacyWidgets[ newWidget ].isCallbackWidget,
+					} ) }
+				/>
 			);
 		}
 
@@ -109,12 +78,13 @@ class LegacyWidgetEdit extends Component {
 			<>
 				<BlockControls>
 					<Toolbar>
-						<IconButton
-							onClick={ this.changeWidget }
-							label={ __( 'Change widget' ) }
-							icon="update"
-						>
-						</IconButton>
+						{ ! widgetObject.isHidden && (
+							<IconButton
+								onClick={ this.changeWidget }
+								label={ __( 'Change widget' ) }
+								icon="update"
+							/>
+						) }
 						{ ! isCallbackWidget && (
 							<>
 								<Button

packages/block-library/src/legacy-widget/edit/placeholder.js

@@ -0,0 +1,57 @@
+/**
+ * External dependencies
+ */
+import { pickBy, isEmpty, map } from 'lodash';
+
+/**
+ * WordPress dependencies
+ */
+import { useMemo } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+import { SelectControl, Placeholder } from '@wordpress/components';
+import { BlockIcon } from '@wordpress/block-editor';
+
+export default function LegacyWidgetPlaceholder( {
+	availableLegacyWidgets,
+	currentWidget,
+	hasPermissionsToManageWidgets,
+	onChangeWidget,
+} ) {
+	const visibleLegacyWidgets = useMemo(
+		() => pickBy(
+			availableLegacyWidgets,
+			( { isHidden } ) => ! isHidden
+		),
+		[ availableLegacyWidgets ]
+	);
+	let placeholderContent;
+	if ( ! hasPermissionsToManageWidgets ) {
+		placeholderContent = __( 'You don\'t have permissions to use widgets on this site.' );
+	}
+	if ( isEmpty( visibleLegacyWidgets ) ) {
+		placeholderContent = __( 'There are no widgets available.' );
+	}
+	placeholderContent = (
+		<SelectControl
+			label={ __( 'Select a legacy widget to display:' ) }
+			value={ currentWidget || 'none' }
+			onChange={ onChangeWidget }
+			options={ [ { value: 'none', label: 'Select widget' } ].concat(
+				map( visibleLegacyWidgets, ( widget, key ) => {
+					return {
+						value: key,
+						label: widget.name,
+					};
+				} )
+			) }
+		/>
+	);
+	return (
+		<Placeholder
+			icon={ <BlockIcon icon="admin-customizer" /> }
+			label={ __( 'Legacy Widget' ) }
+		>
+			{ placeholderContent }
+		</Placeholder>
+	);
+}