From b8ce3bbdf666e6122e9ff430dd9057a760ce96d8 Mon Sep 17 00:00:00 2001
From: Ella <ella@vandurpe.com>
Date: Sat, 9 Dec 2023 00:00:57 +0200
Subject: [PATCH 1/6] Block editor: remove 4 useSelect in favour of context

---
 .../src/components/block-controls/hook.js     |  9 ++--
 .../src/components/block-edit/index.js        | 10 ++++-
 .../components/block-info-slot-fill/index.js  |  6 +--
 .../src/components/block-list/block.js        | 24 ++++++++++-
 .../src/components/inspector-controls/fill.js |  6 +--
 .../inspector-controls/fill.native.js         |  6 +--
 .../use-display-block-controls/index.js       | 42 -------------------
 .../index.native.js                           | 33 ---------------
 packages/block-editor/src/hooks/utils.js      | 10 ++---
 9 files changed, 51 insertions(+), 95 deletions(-)
 delete mode 100644 packages/block-editor/src/components/use-display-block-controls/index.js
 delete mode 100644 packages/block-editor/src/components/use-display-block-controls/index.native.js

diff --git a/packages/block-editor/src/components/block-controls/hook.js b/packages/block-editor/src/components/block-controls/hook.js
index e3f69c8bec3b25..c8c887af55b68b 100644
--- a/packages/block-editor/src/components/block-controls/hook.js
+++ b/packages/block-editor/src/components/block-controls/hook.js
@@ -6,14 +6,15 @@
  * Internal dependencies
  */
 import groups from './groups';
-import useDisplayBlockControls from '../use-display-block-controls';
+import { useBlockEditContext } from '../block-edit/context';
 
 export default function useBlockControlsFill( group, shareWithChildBlocks ) {
-	const { isDisplayed, isParentDisplayed } = useDisplayBlockControls();
-	if ( isDisplayed ) {
+	const { mayDisplayControls, mayDisplayParentControls } =
+		useBlockEditContext();
+	if ( mayDisplayControls ) {
 		return groups[ group ]?.Fill;
 	}
-	if ( isParentDisplayed && shareWithChildBlocks ) {
+	if ( mayDisplayParentControls && shareWithChildBlocks ) {
 		return groups.parent.Fill;
 	}
 	return null;
diff --git a/packages/block-editor/src/components/block-edit/index.js b/packages/block-editor/src/components/block-edit/index.js
index 6faefbc6261929..ef85a65fc19376 100644
--- a/packages/block-editor/src/components/block-edit/index.js
+++ b/packages/block-editor/src/components/block-edit/index.js
@@ -20,7 +20,13 @@ import { BlockEditContextProvider, useBlockEditContext } from './context';
  */
 export { useBlockEditContext };
 
-export default function BlockEdit( props ) {
+export default function BlockEdit( {
+	mayDisplayControls,
+	mayDisplayParentControls,
+	// The remaining props are passed through the BlockEdit filters and are thus
+	// public API!
+	...props
+} ) {
 	const {
 		name,
 		isSelected,
@@ -38,6 +44,8 @@ export default function BlockEdit( props ) {
 		clientId,
 		layout: layoutSupport ? layout : null,
 		__unstableLayoutClassNames,
+		mayDisplayControls,
+		mayDisplayParentControls,
 	};
 	return (
 		<BlockEditContextProvider
diff --git a/packages/block-editor/src/components/block-info-slot-fill/index.js b/packages/block-editor/src/components/block-info-slot-fill/index.js
index 8e16757f3ebbc1..d0cc0451924bce 100644
--- a/packages/block-editor/src/components/block-info-slot-fill/index.js
+++ b/packages/block-editor/src/components/block-info-slot-fill/index.js
@@ -7,14 +7,14 @@ import { privateApis as componentsPrivateApis } from '@wordpress/components';
  * Internal dependencies
  */
 import { unlock } from '../../lock-unlock';
-import useDisplayBlockControls from '../use-display-block-controls';
+import { useBlockEditContext } from '../block-edit/context';
 
 const { createPrivateSlotFill } = unlock( componentsPrivateApis );
 const { Fill, Slot } = createPrivateSlotFill( 'BlockInformation' );
 
 const BlockInfo = ( props ) => {
-	const { isDisplayed } = useDisplayBlockControls();
-	if ( ! isDisplayed ) {
+	const { mayDisplayControls } = useBlockEditContext();
+	if ( ! mayDisplayControls ) {
 		return null;
 	}
 	return <Fill { ...props } />;
diff --git a/packages/block-editor/src/components/block-list/block.js b/packages/block-editor/src/components/block-list/block.js
index ff5915981acdf9..b1a97237ab630d 100644
--- a/packages/block-editor/src/components/block-list/block.js
+++ b/packages/block-editor/src/components/block-list/block.js
@@ -15,6 +15,7 @@ import {
 	switchToBlockType,
 	getDefaultBlockName,
 	isUnmodifiedBlock,
+	store as blocksStore,
 } from '@wordpress/blocks';
 import { withFilters } from '@wordpress/components';
 import {
@@ -95,21 +96,40 @@ function BlockListBlock( {
 		themeSupportsLayout,
 		isTemporarilyEditingAsBlocks,
 		blockEditingMode,
+		mayDisplayControls,
+		mayDisplayParentControls,
 	} = useSelect(
 		( select ) => {
 			const {
 				getSettings,
 				__unstableGetTemporarilyEditingAsBlocks,
 				getBlockEditingMode,
+				getBlockName,
+				isFirstMultiSelectedBlock,
+				getMultiSelectedBlockClientIds,
+				hasSelectedInnerBlock,
 			} = select( blockEditorStore );
+			const { hasBlockSupport } = select( blocksStore );
 			return {
 				themeSupportsLayout: getSettings().supportsLayout,
 				isTemporarilyEditingAsBlocks:
 					__unstableGetTemporarilyEditingAsBlocks() === clientId,
 				blockEditingMode: getBlockEditingMode( clientId ),
+				mayDisplayControls:
+					isSelected ||
+					( isFirstMultiSelectedBlock( clientId ) &&
+						getMultiSelectedBlockClientIds().every(
+							( id ) => getBlockName( id ) === name
+						) ),
+				mayDisplayParentControls:
+					hasBlockSupport(
+						getBlockName( clientId ),
+						'__experimentalExposeControlsToChildren',
+						false
+					) && hasSelectedInnerBlock( clientId ),
 			};
 		},
-		[ clientId ]
+		[ clientId, isSelected, name ]
 	);
 	const { removeBlock } = useDispatch( blockEditorStore );
 	const onRemove = useCallback( () => removeBlock( clientId ), [ clientId ] );
@@ -137,6 +157,8 @@ function BlockListBlock( {
 			__unstableParentLayout={
 				Object.keys( parentLayout ).length ? parentLayout : undefined
 			}
+			mayDisplayControls={ mayDisplayControls }
+			mayDisplayParentControls={ mayDisplayParentControls }
 		/>
 	);
 
diff --git a/packages/block-editor/src/components/inspector-controls/fill.js b/packages/block-editor/src/components/inspector-controls/fill.js
index fdb0d44f0eccb6..9b0cbd87c3ac34 100644
--- a/packages/block-editor/src/components/inspector-controls/fill.js
+++ b/packages/block-editor/src/components/inspector-controls/fill.js
@@ -12,7 +12,7 @@ import { useEffect, useContext } from '@wordpress/element';
 /**
  * Internal dependencies
  */
-import useDisplayBlockControls from '../use-display-block-controls';
+import { useBlockEditContext } from '../block-edit/context';
 import groups from './groups';
 
 export default function InspectorControlsFill( {
@@ -33,13 +33,13 @@ export default function InspectorControlsFill( {
 		group = __experimentalGroup;
 	}
 
-	const { isDisplayed } = useDisplayBlockControls();
+	const { mayDisplayControls } = useBlockEditContext();
 	const Fill = groups[ group ]?.Fill;
 	if ( ! Fill ) {
 		warning( `Unknown InspectorControls group "${ group }" provided.` );
 		return null;
 	}
-	if ( ! isDisplayed ) {
+	if ( ! mayDisplayControls ) {
 		return null;
 	}
 
diff --git a/packages/block-editor/src/components/inspector-controls/fill.native.js b/packages/block-editor/src/components/inspector-controls/fill.native.js
index f1ee5a14cd18e1..f4c00194da862b 100644
--- a/packages/block-editor/src/components/inspector-controls/fill.native.js
+++ b/packages/block-editor/src/components/inspector-controls/fill.native.js
@@ -15,7 +15,7 @@ import deprecated from '@wordpress/deprecated';
  * Internal dependencies
  */
 import groups from './groups';
-import useDisplayBlockControls from '../use-display-block-controls';
+import { useBlockEditContext } from '../block-edit/context';
 import { BlockSettingsButton } from '../block-settings';
 
 export default function InspectorControlsFill( {
@@ -35,14 +35,14 @@ export default function InspectorControlsFill( {
 		);
 		group = __experimentalGroup;
 	}
-	const { isDisplayed } = useDisplayBlockControls();
+	const { mayDisplayControls } = useBlockEditContext();
 
 	const Fill = groups[ group ]?.Fill;
 	if ( ! Fill ) {
 		warning( `Unknown InspectorControls group "${ group }" provided.` );
 		return null;
 	}
-	if ( ! isDisplayed ) {
+	if ( ! mayDisplayControls ) {
 		return null;
 	}
 
diff --git a/packages/block-editor/src/components/use-display-block-controls/index.js b/packages/block-editor/src/components/use-display-block-controls/index.js
deleted file mode 100644
index ef27479593a736..00000000000000
--- a/packages/block-editor/src/components/use-display-block-controls/index.js
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { useSelect } from '@wordpress/data';
-import { store as blocksStore } from '@wordpress/blocks';
-
-/**
- * Internal dependencies
- */
-import { useBlockEditContext } from '../block-edit/context';
-import { store as blockEditorStore } from '../../store';
-
-export default function useDisplayBlockControls() {
-	const { isSelected, clientId, name } = useBlockEditContext();
-	return useSelect(
-		( select ) => {
-			const {
-				getBlockName,
-				isFirstMultiSelectedBlock,
-				getMultiSelectedBlockClientIds,
-				hasSelectedInnerBlock,
-			} = select( blockEditorStore );
-			const { hasBlockSupport } = select( blocksStore );
-
-			return {
-				isDisplayed:
-					isSelected ||
-					( isFirstMultiSelectedBlock( clientId ) &&
-						getMultiSelectedBlockClientIds().every(
-							( id ) => getBlockName( id ) === name
-						) ),
-				isParentDisplayed:
-					hasBlockSupport(
-						getBlockName( clientId ),
-						'__experimentalExposeControlsToChildren',
-						false
-					) && hasSelectedInnerBlock( clientId ),
-			};
-		},
-		[ clientId, isSelected, name ]
-	);
-}
diff --git a/packages/block-editor/src/components/use-display-block-controls/index.native.js b/packages/block-editor/src/components/use-display-block-controls/index.native.js
deleted file mode 100644
index d865ed6d9d7b26..00000000000000
--- a/packages/block-editor/src/components/use-display-block-controls/index.native.js
+++ /dev/null
@@ -1,33 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { useSelect } from '@wordpress/data';
-import { hasBlockSupport } from '@wordpress/blocks';
-
-/**
- * Internal dependencies
- */
-import { useBlockEditContext } from '../block-edit/context';
-import { store as blockEditorStore } from '../../store';
-
-export default function useDisplayBlockControls() {
-	const { isSelected, clientId, name } = useBlockEditContext();
-	return useSelect(
-		( select ) => {
-			const { getBlockName, getBlockRootClientId } =
-				select( blockEditorStore );
-
-			const parentId = getBlockRootClientId( clientId );
-			const parentBlockName = getBlockName( parentId );
-
-			const hideControls = hasBlockSupport(
-				parentBlockName,
-				'__experimentalHideChildBlockControls',
-				false
-			);
-
-			return { isDisplayed: ! hideControls && isSelected };
-		},
-		[ clientId, isSelected, name ]
-	);
-}
diff --git a/packages/block-editor/src/hooks/utils.js b/packages/block-editor/src/hooks/utils.js
index 76260ed0d4a63c..c833196ba64934 100644
--- a/packages/block-editor/src/hooks/utils.js
+++ b/packages/block-editor/src/hooks/utils.js
@@ -10,7 +10,7 @@ import { addFilter } from '@wordpress/hooks';
 /**
  * Internal dependencies
  */
-import useDisplayBlockControls from '../components/use-display-block-controls';
+import { useBlockEditContext } from '../components/block-edit/context';
 import { useSettings } from '../components';
 import { useSettingsForBlockElement } from '../components/global-styles/hooks';
 import { getValueFromObjectPath, setImmutably } from '../utils/object';
@@ -379,8 +379,8 @@ export function createBlockEditFilter( features ) {
 	} );
 	const withBlockEditHooks = createHigherOrderComponent(
 		( OriginalBlockEdit ) => ( props ) => {
-			const { isDisplayed, isParentDisplayed } =
-				useDisplayBlockControls();
+			const { mayDisplayControls, mayDisplayParentControls } =
+				useBlockEditContext();
 			// CAUTION: code added before this line will be executed for all
 			// blocks, not just those that support the feature! Code added
 			// above this line should be carefully evaluated for its impact on
@@ -394,8 +394,8 @@ export function createBlockEditFilter( features ) {
 						shareWithChildBlocks,
 					} = feature;
 					const shouldDisplayControls =
-						isDisplayed ||
-						( isParentDisplayed && shareWithChildBlocks );
+						mayDisplayControls ||
+						( mayDisplayParentControls && shareWithChildBlocks );
 
 					if (
 						! shouldDisplayControls ||

From 4f018f6a1c35aa9c7a74534287930ab0e1dab0e3 Mon Sep 17 00:00:00 2001
From: Ella <ella@vandurpe.com>
Date: Sat, 9 Dec 2023 13:08:13 +0200
Subject: [PATCH 2/6] Fix unit tests

---
 .../src/components/block-controls/test/index.js             | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/block-controls/test/index.js b/packages/block-editor/src/components/block-controls/test/index.js
index cbfcb3c1873a75..bbd987cbeb20e8 100644
--- a/packages/block-editor/src/components/block-controls/test/index.js
+++ b/packages/block-editor/src/components/block-controls/test/index.js
@@ -59,7 +59,7 @@ describe( 'BlockControls', () => {
 	it( 'should render a dynamic toolbar of controls', () => {
 		render(
 			<SlotFillProvider>
-				<BlockEdit name="core/test-block" isSelected>
+				<BlockEdit name="core/test-block" mayDisplayControls>
 					<BlockControls controls={ controls }>
 						<p>Child</p>
 					</BlockControls>
@@ -84,7 +84,7 @@ describe( 'BlockControls', () => {
 	it( 'should render its children', () => {
 		render(
 			<SlotFillProvider>
-				<BlockEdit name="core/test-block" isSelected>
+				<BlockEdit name="core/test-block" mayDisplayControls>
 					<BlockControls controls={ controls }>
 						<p>Child</p>
 					</BlockControls>
@@ -99,7 +99,7 @@ describe( 'BlockControls', () => {
 	it( 'should a dynamic toolbar when passed as children', () => {
 		render(
 			<SlotFillProvider>
-				<BlockEdit name="core/test-block" isSelected>
+				<BlockEdit name="core/test-block" mayDisplayControls>
 					<BlockControls>
 						<ToolbarGroup controls={ controls } />
 					</BlockControls>

From aab8f1aac9854821d7f0c66b7652a8040ad5927c Mon Sep 17 00:00:00 2001
From: Ella <ella@vandurpe.com>
Date: Sun, 10 Dec 2023 11:10:30 +0100
Subject: [PATCH 3/6] Fix mobile

---
 .../src/components/block-list/block.native.js         | 11 +++++++++++
 packages/block-library/src/cover/test/edit.native.js  |  8 +++++++-
 .../src/text-color/test/index.native.js               |  2 +-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/packages/block-editor/src/components/block-list/block.native.js b/packages/block-editor/src/components/block-list/block.native.js
index 03a84d530ba12a..2daaf846443b5a 100644
--- a/packages/block-editor/src/components/block-list/block.native.js
+++ b/packages/block-editor/src/components/block-list/block.native.js
@@ -148,6 +148,7 @@ function BlockListBlock( {
 		isDescendentBlockSelected,
 		isParentSelected,
 		order,
+		mayDisplayControls,
 	} = useSelect(
 		( select ) => {
 			const {
@@ -158,6 +159,9 @@ function BlockListBlock( {
 				getSelectedBlockClientId,
 				getSettings,
 				hasSelectedInnerBlock,
+				getBlockName,
+				isFirstMultiSelectedBlock,
+				getMultiSelectedBlockClientIds,
 			} = select( blockEditorStore );
 			const currentBlockType = getBlockType( name || 'core/missing' );
 			const currentBlockCategory = currentBlockType?.category;
@@ -205,6 +209,12 @@ function BlockListBlock( {
 				isDescendentBlockSelected: descendentBlockSelected,
 				isParentSelected: parentSelected,
 				order: blockOrder,
+				mayDisplayControls:
+					isSelected ||
+					( isFirstMultiSelectedBlock( clientId ) &&
+						getMultiSelectedBlockClientIds().every(
+							( id ) => getBlockName( id ) === name
+						) ),
 			};
 		},
 		[ clientId, isSelected, name, rootClientId ]
@@ -346,6 +356,7 @@ function BlockListBlock( {
 									: undefined
 							}
 							wrapperProps={ wrapperProps }
+							mayDisplayControls={ mayDisplayControls }
 						/>
 						<View onLayout={ onLayout } />
 					</GlobalStylesContext.Provider>
diff --git a/packages/block-library/src/cover/test/edit.native.js b/packages/block-library/src/cover/test/edit.native.js
index 3ca2755ee1aebb..6925cfe3f62214 100644
--- a/packages/block-library/src/cover/test/edit.native.js
+++ b/packages/block-library/src/cover/test/edit.native.js
@@ -80,7 +80,13 @@ const MEDIA_OPTIONS = [
 // Simplified tree to render Cover edit within slot.
 const CoverEdit = ( props ) => (
 	<SlotFillProvider>
-		<BlockEdit isSelected name={ cover.name } clientId={ 0 } { ...props } />
+		<BlockEdit
+			isSelected
+			mayDisplayControls
+			name={ cover.name }
+			clientId={ 0 }
+			{ ...props }
+		/>
 		<BottomSheetSettings isVisible />
 	</SlotFillProvider>
 );
diff --git a/packages/format-library/src/text-color/test/index.native.js b/packages/format-library/src/text-color/test/index.native.js
index 9a148dec4358be..6805461cc22e2c 100644
--- a/packages/format-library/src/text-color/test/index.native.js
+++ b/packages/format-library/src/text-color/test/index.native.js
@@ -205,7 +205,7 @@ describe( 'Text color', () => {
 
 		const { getByLabelText } = render(
 			<SlotFillProvider>
-				<BlockEdit name="core/test-block" isSelected>
+				<BlockEdit name="core/test-block" isSelected hasDisplayControls>
 					<TextColorEdit
 						isActive={ true }
 						activeAttributes={ {} }

From 952096b55ad81be64e04d3d9a49d76b7e69f1277 Mon Sep 17 00:00:00 2001
From: Ella <ella@vandurpe.com>
Date: Sun, 10 Dec 2023 11:29:26 +0100
Subject: [PATCH 4/6] Fix typo

---
 packages/format-library/src/text-color/test/index.native.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/format-library/src/text-color/test/index.native.js b/packages/format-library/src/text-color/test/index.native.js
index 6805461cc22e2c..2ff9b5edfac219 100644
--- a/packages/format-library/src/text-color/test/index.native.js
+++ b/packages/format-library/src/text-color/test/index.native.js
@@ -205,7 +205,7 @@ describe( 'Text color', () => {
 
 		const { getByLabelText } = render(
 			<SlotFillProvider>
-				<BlockEdit name="core/test-block" isSelected hasDisplayControls>
+				<BlockEdit name="core/test-block" isSelected mayDisplayControls>
 					<TextColorEdit
 						isActive={ true }
 						activeAttributes={ {} }

From 69c9d34694a4a6aff4db9017c9474e6f861844f5 Mon Sep 17 00:00:00 2001
From: Ella <ella@vandurpe.com>
Date: Sun, 10 Dec 2023 15:10:59 +0100
Subject: [PATCH 5/6] Make private with symbol

---
 .../src/components/block-controls/hook.js     | 13 ++++---
 .../src/components/block-edit/context.js      |  3 ++
 .../src/components/block-edit/index.js        | 38 +++++++++++++------
 .../components/block-info-slot-fill/index.js  |  9 +++--
 .../src/components/inspector-controls/fill.js |  9 +++--
 .../inspector-controls/fill.native.js         |  9 +++--
 packages/block-editor/src/hooks/utils.js      | 14 ++++---
 7 files changed, 65 insertions(+), 30 deletions(-)

diff --git a/packages/block-editor/src/components/block-controls/hook.js b/packages/block-editor/src/components/block-controls/hook.js
index c8c887af55b68b..4e9592471cb298 100644
--- a/packages/block-editor/src/components/block-controls/hook.js
+++ b/packages/block-editor/src/components/block-controls/hook.js
@@ -6,15 +6,18 @@
  * Internal dependencies
  */
 import groups from './groups';
-import { useBlockEditContext } from '../block-edit/context';
+import {
+	useBlockEditContext,
+	mayDisplayControlsKey,
+	mayDisplayParentControlsKey,
+} from '../block-edit/context';
 
 export default function useBlockControlsFill( group, shareWithChildBlocks ) {
-	const { mayDisplayControls, mayDisplayParentControls } =
-		useBlockEditContext();
-	if ( mayDisplayControls ) {
+	const context = useBlockEditContext();
+	if ( context[ mayDisplayControlsKey ] ) {
 		return groups[ group ]?.Fill;
 	}
-	if ( mayDisplayParentControls && shareWithChildBlocks ) {
+	if ( context[ mayDisplayParentControlsKey ] && shareWithChildBlocks ) {
 		return groups.parent.Fill;
 	}
 	return null;
diff --git a/packages/block-editor/src/components/block-edit/context.js b/packages/block-editor/src/components/block-edit/context.js
index d8b9c829484102..6b0b1af9ea22dd 100644
--- a/packages/block-editor/src/components/block-edit/context.js
+++ b/packages/block-editor/src/components/block-edit/context.js
@@ -3,6 +3,9 @@
  */
 import { createContext, useContext } from '@wordpress/element';
 
+export const mayDisplayControlsKey = Symbol( 'mayDisplayControls' );
+export const mayDisplayParentControlsKey = Symbol( 'mayDisplayParentControls' );
+
 export const DEFAULT_BLOCK_EDIT_CONTEXT = {
 	name: '',
 	isSelected: false,
diff --git a/packages/block-editor/src/components/block-edit/index.js b/packages/block-editor/src/components/block-edit/index.js
index ef85a65fc19376..833c27da1e66bf 100644
--- a/packages/block-editor/src/components/block-edit/index.js
+++ b/packages/block-editor/src/components/block-edit/index.js
@@ -8,7 +8,12 @@ import { hasBlockSupport } from '@wordpress/blocks';
  * Internal dependencies
  */
 import Edit from './edit';
-import { BlockEditContextProvider, useBlockEditContext } from './context';
+import {
+	BlockEditContextProvider,
+	useBlockEditContext,
+	mayDisplayControlsKey,
+	mayDisplayParentControlsKey,
+} from './context';
 
 /**
  * The `useBlockEditContext` hook provides information about the block this hook is being used in.
@@ -38,21 +43,32 @@ export default function BlockEdit( {
 	const layoutSupport =
 		hasBlockSupport( name, 'layout', false ) ||
 		hasBlockSupport( name, '__experimentalLayout', false );
-	const context = {
-		name,
-		isSelected,
-		clientId,
-		layout: layoutSupport ? layout : null,
-		__unstableLayoutClassNames,
-		mayDisplayControls,
-		mayDisplayParentControls,
-	};
 	return (
 		<BlockEditContextProvider
 			// It is important to return the same object if props haven't
 			// changed to avoid  unnecessary rerenders.
 			// See https://reactjs.org/docs/context.html#caveats.
-			value={ useMemo( () => context, Object.values( context ) ) }
+			value={ useMemo(
+				() => ( {
+					name,
+					isSelected,
+					clientId,
+					layout: layoutSupport ? layout : null,
+					__unstableLayoutClassNames,
+					[ mayDisplayControlsKey ]: mayDisplayControls,
+					[ mayDisplayParentControlsKey ]: mayDisplayParentControls,
+				} ),
+				[
+					name,
+					isSelected,
+					clientId,
+					layoutSupport,
+					layout,
+					__unstableLayoutClassNames,
+					mayDisplayControls,
+					mayDisplayParentControls,
+				]
+			) }
 		>
 			<Edit { ...props } />
 		</BlockEditContextProvider>
diff --git a/packages/block-editor/src/components/block-info-slot-fill/index.js b/packages/block-editor/src/components/block-info-slot-fill/index.js
index d0cc0451924bce..8c9503313d754c 100644
--- a/packages/block-editor/src/components/block-info-slot-fill/index.js
+++ b/packages/block-editor/src/components/block-info-slot-fill/index.js
@@ -7,14 +7,17 @@ import { privateApis as componentsPrivateApis } from '@wordpress/components';
  * Internal dependencies
  */
 import { unlock } from '../../lock-unlock';
-import { useBlockEditContext } from '../block-edit/context';
+import {
+	useBlockEditContext,
+	mayDisplayControlsKey,
+} from '../block-edit/context';
 
 const { createPrivateSlotFill } = unlock( componentsPrivateApis );
 const { Fill, Slot } = createPrivateSlotFill( 'BlockInformation' );
 
 const BlockInfo = ( props ) => {
-	const { mayDisplayControls } = useBlockEditContext();
-	if ( ! mayDisplayControls ) {
+	const context = useBlockEditContext();
+	if ( ! context[ mayDisplayControlsKey ] ) {
 		return null;
 	}
 	return <Fill { ...props } />;
diff --git a/packages/block-editor/src/components/inspector-controls/fill.js b/packages/block-editor/src/components/inspector-controls/fill.js
index 9b0cbd87c3ac34..456b33af9137fe 100644
--- a/packages/block-editor/src/components/inspector-controls/fill.js
+++ b/packages/block-editor/src/components/inspector-controls/fill.js
@@ -12,7 +12,10 @@ import { useEffect, useContext } from '@wordpress/element';
 /**
  * Internal dependencies
  */
-import { useBlockEditContext } from '../block-edit/context';
+import {
+	useBlockEditContext,
+	mayDisplayControlsKey,
+} from '../block-edit/context';
 import groups from './groups';
 
 export default function InspectorControlsFill( {
@@ -33,13 +36,13 @@ export default function InspectorControlsFill( {
 		group = __experimentalGroup;
 	}
 
-	const { mayDisplayControls } = useBlockEditContext();
+	const context = useBlockEditContext();
 	const Fill = groups[ group ]?.Fill;
 	if ( ! Fill ) {
 		warning( `Unknown InspectorControls group "${ group }" provided.` );
 		return null;
 	}
-	if ( ! mayDisplayControls ) {
+	if ( ! context[ mayDisplayControlsKey ] ) {
 		return null;
 	}
 
diff --git a/packages/block-editor/src/components/inspector-controls/fill.native.js b/packages/block-editor/src/components/inspector-controls/fill.native.js
index f4c00194da862b..98b6698721e1ce 100644
--- a/packages/block-editor/src/components/inspector-controls/fill.native.js
+++ b/packages/block-editor/src/components/inspector-controls/fill.native.js
@@ -15,7 +15,10 @@ import deprecated from '@wordpress/deprecated';
  * Internal dependencies
  */
 import groups from './groups';
-import { useBlockEditContext } from '../block-edit/context';
+import {
+	useBlockEditContext,
+	mayDisplayControlsKey,
+} from '../block-edit/context';
 import { BlockSettingsButton } from '../block-settings';
 
 export default function InspectorControlsFill( {
@@ -35,14 +38,14 @@ export default function InspectorControlsFill( {
 		);
 		group = __experimentalGroup;
 	}
-	const { mayDisplayControls } = useBlockEditContext();
+	const context = useBlockEditContext();
 
 	const Fill = groups[ group ]?.Fill;
 	if ( ! Fill ) {
 		warning( `Unknown InspectorControls group "${ group }" provided.` );
 		return null;
 	}
-	if ( ! mayDisplayControls ) {
+	if ( ! context[ mayDisplayControlsKey ] ) {
 		return null;
 	}
 
diff --git a/packages/block-editor/src/hooks/utils.js b/packages/block-editor/src/hooks/utils.js
index c833196ba64934..c6076b822545a9 100644
--- a/packages/block-editor/src/hooks/utils.js
+++ b/packages/block-editor/src/hooks/utils.js
@@ -10,7 +10,11 @@ import { addFilter } from '@wordpress/hooks';
 /**
  * Internal dependencies
  */
-import { useBlockEditContext } from '../components/block-edit/context';
+import {
+	useBlockEditContext,
+	mayDisplayControlsKey,
+	mayDisplayParentControlsKey,
+} from '../components/block-edit/context';
 import { useSettings } from '../components';
 import { useSettingsForBlockElement } from '../components/global-styles/hooks';
 import { getValueFromObjectPath, setImmutably } from '../utils/object';
@@ -379,8 +383,7 @@ export function createBlockEditFilter( features ) {
 	} );
 	const withBlockEditHooks = createHigherOrderComponent(
 		( OriginalBlockEdit ) => ( props ) => {
-			const { mayDisplayControls, mayDisplayParentControls } =
-				useBlockEditContext();
+			const context = useBlockEditContext();
 			// CAUTION: code added before this line will be executed for all
 			// blocks, not just those that support the feature! Code added
 			// above this line should be carefully evaluated for its impact on
@@ -394,8 +397,9 @@ export function createBlockEditFilter( features ) {
 						shareWithChildBlocks,
 					} = feature;
 					const shouldDisplayControls =
-						mayDisplayControls ||
-						( mayDisplayParentControls && shareWithChildBlocks );
+						context[ mayDisplayControlsKey ] ||
+						( context[ mayDisplayParentControlsKey ] &&
+							shareWithChildBlocks );
 
 					if (
 						! shouldDisplayControls ||

From e0da783e59ede4c48e2a3a5c20c0b5453eef6eb6 Mon Sep 17 00:00:00 2001
From: Ella <ella@vandurpe.com>
Date: Mon, 11 Dec 2023 10:39:46 +0100
Subject: [PATCH 6/6] Add comment on use of Symbol

---
 packages/block-editor/src/components/block-edit/index.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/block-editor/src/components/block-edit/index.js b/packages/block-editor/src/components/block-edit/index.js
index 833c27da1e66bf..bbef47b27c5790 100644
--- a/packages/block-editor/src/components/block-edit/index.js
+++ b/packages/block-editor/src/components/block-edit/index.js
@@ -55,6 +55,8 @@ export default function BlockEdit( {
 					clientId,
 					layout: layoutSupport ? layout : null,
 					__unstableLayoutClassNames,
+					// We use symbols in favour of an __unstable prefix to avoid
+					// usage outside of the package (this context is exposed).
 					[ mayDisplayControlsKey ]: mayDisplayControls,
 					[ mayDisplayParentControlsKey ]: mayDisplayParentControls,
 				} ),