Fix fill

WordPress · Feb 24, 2023 · 4ffc496 · 4ffc496
1 parent 9835e7f
commit 4ffc496
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 9 deletions.
diff --git a/packages/block-editor/src/components/block-controls/hook.js b/packages/block-editor/src/components/block-controls/hook.js
@@ -3,17 +3,15 @@
  */
 import groups from './groups';
 import { useBlockEditContext } from '../block-edit/context';
-import useDisplayBlockControls from '../use-display-block-controls';
 
 export default function useBlockControlsFill( group, shareWithChildBlocks ) {
-	const isDisplayed = useDisplayBlockControls();
-	const { shouldDisplayControls } = useBlockEditContext();
-	const isParentDisplayed = shareWithChildBlocks && shouldDisplayControls;
+	const { shouldDisplayControls, shouldDisplayControlsWithinChildren } =
+		useBlockEditContext();
 
-	if ( isDisplayed ) {
+	if ( shouldDisplayControls ) {
 		return groups[ group ]?.Fill;
 	}
-	if ( isParentDisplayed ) {
+	if ( shareWithChildBlocks && shouldDisplayControlsWithinChildren ) {
 		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
@@ -47,7 +47,6 @@ export default function BlockEdit( props ) {
 				getBlockName,
 				isFirstMultiSelectedBlock,
 				getMultiSelectedBlockClientIds,
-				hasSelectedInnerBlock,
 			} = select( blockEditorStore );
 
 			if ( isFirstMultiSelectedBlock( clientId ) ) {
@@ -56,6 +55,14 @@ export default function BlockEdit( props ) {
 				);
 			}
 
+			return false;
+		},
+		[ clientId, isSelected, name ]
+	);
+	const shouldDisplayControlsWithinChildren = useSelect(
+		( select ) => {
+			const { getBlockName, hasSelectedInnerBlock } =
+				select( blockEditorStore );
 			return (
 				hasBlockSupport(
 					getBlockName( clientId ),
@@ -73,6 +80,7 @@ export default function BlockEdit( props ) {
 		layout: layoutSupport ? layout : null,
 		__unstableLayoutClassNames,
 		shouldDisplayControls,
+		shouldDisplayControlsWithinChildren,
 	};
 	return (
 		<BlockEditContextProvider

diff --git a/packages/block-editor/src/hooks/align.js b/packages/block-editor/src/hooks/align.js
@@ -169,10 +169,13 @@ function AlignControls( props ) {
  */
 export const withToolbarControls = createHigherOrderComponent(
 	( BlockEdit ) => ( props ) => {
+		const { shouldDisplayControls, shouldDisplayControlsWithinChildren } =
+			useBlockEditContext();
 		return (
 			<>
-				{ useBlockEditContext().shouldDisplayControls &&
-					!! getBlockSupport( props.name, 'align' ) && (
+				{ ( shouldDisplayControls ||
+					shouldDisplayControlsWithinChildren ) &&
+					hasBlockSupport( props.name, 'align' ) && (
 						<AlignControls { ...props } />
 					) }
 				<BlockEdit { ...props } />