Drop patterns and blocks between sections only in zoom out mode (#60828)

* in zoom out mode remove the drop zone for the sections * Update packages/block-editor/src/components/inner-blocks/index.js Co-authored-by: Ben Dwyer <[email protected]> * Update packages/block-editor/src/components/inner-blocks/index.js Co-authored-by: Ben Dwyer <[email protected]> * Update packages/block-editor/src/components/inner-blocks/index.js Co-authored-by: Ben Dwyer <[email protected]> --------- Co-authored-by: draganescu <[email protected]> Co-authored-by: richtabor <[email protected]> Co-authored-by: ellatrix <[email protected]> Co-authored-by: scruffian <[email protected]>
WordPress · Apr 22, 2024 · f2a92c1 · f2a92c1 · github-actions · Apr 22, 2024
1 parent 854756a
commit f2a92c1
Showing 1 changed file with 14 additions and 1 deletion.
diff --git a/packages/block-editor/src/components/inner-blocks/index.js b/packages/block-editor/src/components/inner-blocks/index.js
@@ -204,6 +204,8 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 				getBlockEditingMode,
 				getBlockSettings,
 				isDragging,
+				getSettings,
+				getBlockOrder,
 			} = unlock( select( blockEditorStore ) );
 			const { hasBlockSupport, getBlockType } = select( blocksStore );
 			const blockName = getBlockName( clientId );
@@ -212,6 +214,17 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 			const blockEditingMode = getBlockEditingMode( clientId );
 			const parentClientId = getBlockRootClientId( clientId );
 			const [ defaultLayout ] = getBlockSettings( clientId, 'layout' );
+
+			// In zoom out mode, we want to disable the drop zone for the sections.
+			// The inner blocks belonging to the section drop zone is
+			// already disabled by the blocks themselves being disabled.
+			let _isDropZoneDisabled = blockEditingMode === 'disabled';
+			if ( __unstableGetEditorMode() === 'zoom-out' ) {
+				const { sectionRootClientId } = unlock( getSettings() );
+				const sectionsClientIds = getBlockOrder( sectionRootClientId );
+				_isDropZoneDisabled = sectionsClientIds?.includes( clientId );
+			}
+
 			return {
 				__experimentalCaptureToolbars: hasBlockSupport(
 					blockName,
@@ -228,7 +241,7 @@ export function useInnerBlocksProps( props = {}, options = {} ) {
 				blockType: getBlockType( blockName ),
 				parentLock: getTemplateLock( parentClientId ),
 				parentClientId,
-				isDropZoneDisabled: blockEditingMode === 'disabled',
+				isDropZoneDisabled: _isDropZoneDisabled,
 				defaultLayout,
 			};
 		},