Sidebar Tabs: Use editor settings to override display (#46321)

* Sidebar Tabs: Use editor settings to override display * Roll check of tab display into use tabs hook * Disable display of tabs for Nav Submenu block
WordPress · Dec 6, 2022 · 392df59 · 392df59
1 parent d64fc46
commit 392df59
Show file tree

Hide file tree

Showing 6 changed files with 85 additions and 7 deletions.
diff --git a/lib/experimental/class-wp-rest-block-editor-settings-controller.php b/lib/experimental/class-wp-rest-block-editor-settings-controller.php
@@ -168,6 +168,12 @@ public function get_item_schema() {
 					'context'     => array( 'mobile' ),
 				),
 
+				'__experimentalBlockInspectorTabs'       => array(
+					'description' => __( 'Block inspector tab display overrides.', 'gutenberg' ),
+					'type'        => 'object',
+					'context'     => array( 'post-editor', 'site-editor', 'widgets-editor' ),
+				),
+
 				'alignWide'                              => array(
 					'description' => __( 'Enable/Disable Wide/Full Alignments.', 'gutenberg' ),
 					'type'        => 'boolean',

diff --git a/packages/block-editor/src/components/block-inspector/index.js b/packages/block-editor/src/components/block-inspector/index.js
@@ -169,9 +169,7 @@ const BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {
 	}, [] );
 
 	const availableTabs = useInspectorControlsTabs( blockType?.name );
-	const showTabs =
-		window?.__experimentalEnableBlockInspectorTabs &&
-		availableTabs.length > 1;
+	const showTabs = availableTabs.length > 1;
 
 	if ( count > 1 ) {
 		return (
@@ -243,9 +241,7 @@ const BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {
 
 const BlockInspectorSingleBlock = ( { clientId, blockName } ) => {
 	const availableTabs = useInspectorControlsTabs( blockName );
-	const showTabs =
-		window?.__experimentalEnableBlockInspectorTabs &&
-		availableTabs.length > 1;
+	const showTabs = availableTabs.length > 1;
 
 	const hasBlockStyles = useSelect(
 		( select ) => {

diff --git a/packages/block-editor/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js b/packages/block-editor/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js
@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import { __experimentalUseSlotFills as useSlotFills } from '@wordpress/components';
+import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -10,6 +11,27 @@ import InspectorControlsGroups from '../inspector-controls/groups';
 import useIsListViewTabDisabled from './use-is-list-view-tab-disabled';
 import { InspectorAdvancedControls } from '../inspector-controls';
 import { TAB_LIST_VIEW, TAB_SETTINGS, TAB_STYLES } from './utils';
+import { store as blockEditorStore } from '../../store';
+
+function getShowTabs( blockName, tabSettings = {} ) {
+	// Don't allow settings to force the display of tabs if the block inspector
+	// tabs experiment hasn't been opted into.
+	if ( ! window?.__experimentalEnableBlockInspectorTabs ) {
+		return false;
+	}
+
+	// Block specific setting takes precedence over generic default.
+	if ( tabSettings[ blockName ] !== undefined ) {
+		return tabSettings[ blockName ];
+	}
+
+	// Use generic default if set over the Gutenberg experiment option.
+	if ( tabSettings.default !== undefined ) {
+		return tabSettings.default;
+	}
+
+	return true;
+}
 
 export default function useInspectorControlsTabs( blockName ) {
 	const tabs = [];
@@ -54,5 +76,12 @@ export default function useInspectorControlsTabs( blockName ) {
 		tabs.push( TAB_SETTINGS );
 	}
 
-	return tabs;
+	const tabSettings = useSelect( ( select ) => {
+		return select( blockEditorStore ).getSettings()
+			.__experimentalBlockInspectorTabs;
+	}, [] );
+
+	const showTabs = getShowTabs( blockName, tabSettings );
+
+	return showTabs ? tabs : [];
 }
diff --git a/packages/block-library/src/navigation-link/index.php b/packages/block-library/src/navigation-link/index.php
@@ -344,3 +344,26 @@ function register_block_core_navigation_link() {
 	);
 }
 add_action( 'init', 'register_block_core_navigation_link' );
+
+/**
+ * Disables the display of tabs for the Navigation Link block.
+ *
+ * @param array $settings Default editor settings.
+ * @return array Filtered editor settings.
+ */
+function gutenberg_disable_tabs_for_navigation_link_block( $settings ) {
+	$current_tab_settings = _wp_array_get(
+		$settings,
+		array( '__experimentalBlockInspectorTabs' ),
+		array()
+	);
+
+	$settings['__experimentalBlockInspectorTabs'] = array_merge(
+		$current_tab_settings,
+		array( 'core/navigation-link' => false )
+	);
+
+	return $settings;
+}
+
+add_filter( 'block_editor_settings_all', 'gutenberg_disable_tabs_for_navigation_link_block' );
diff --git a/packages/block-library/src/navigation-submenu/index.php b/packages/block-library/src/navigation-submenu/index.php
@@ -289,3 +289,26 @@ function register_block_core_navigation_submenu() {
 	);
 }
 add_action( 'init', 'register_block_core_navigation_submenu' );
+
+/**
+ * Disables the display of tabs for the Navigation Submenu block.
+ *
+ * @param array $settings Default editor settings.
+ * @return array Filtered editor settings.
+ */
+function gutenberg_disable_tabs_for_navigation_submenu_block( $settings ) {
+	$current_tab_settings = _wp_array_get(
+		$settings,
+		array( '__experimentalBlockInspectorTabs' ),
+		array()
+	);
+
+	$settings['__experimentalBlockInspectorTabs'] = array_merge(
+		$current_tab_settings,
+		array( 'core/navigation-submenu' => false )
+	);
+
+	return $settings;
+}
+
+add_filter( 'block_editor_settings_all', 'gutenberg_disable_tabs_for_navigation_submenu_block' );
diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js
@@ -135,6 +135,7 @@ function useBlockEditorSettings( settings, hasTemplate ) {
 				Object.entries( settings ).filter( ( [ key ] ) =>
 					[
 						'__experimentalBlockDirectory',
+						'__experimentalBlockInspectorTabs',
 						'__experimentalDiscussionSettings',
 						'__experimentalFeatures',
 						'__experimentalPreferredStyleVariations',