From a605b82650875e7ce94b1d4b4bbfeb11921fdcc0 Mon Sep 17 00:00:00 2001
From: yogeshbhutkar <yogesh.bhutkar@rtcamp.com>
Date: Thu, 5 Dec 2024 12:44:24 +0530
Subject: [PATCH] Enhance Block Tools: Add inserter opened state to selector
 and update rendering logic

---
 .../src/components/block-tools/index.js             | 13 ++++++++++---
 .../provider/use-block-editor-settings.js           |  7 +++++++
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/index.js b/packages/block-editor/src/components/block-tools/index.js
index e6c49af6b6106..0d8a15fa00bf9 100644
--- a/packages/block-editor/src/components/block-tools/index.js
+++ b/packages/block-editor/src/components/block-tools/index.js
@@ -44,6 +44,7 @@ function selector( select ) {
 		isTyping: isTyping(),
 		isZoomOutMode: isZoomOut(),
 		isDragging: isDragging(),
+		isInserterOpened: getSettings().__experimentalIsInserterOpened,
 	};
 }
 
@@ -61,8 +62,14 @@ export default function BlockTools( {
 	__unstableContentRef,
 	...props
 } ) {
-	const { clientId, hasFixedToolbar, isTyping, isZoomOutMode, isDragging } =
-		useSelect( selector, [] );
+	const {
+		clientId,
+		hasFixedToolbar,
+		isTyping,
+		isZoomOutMode,
+		isDragging,
+		isInserterOpened,
+	} = useSelect( selector, [] );
 
 	const isMatch = useShortcutEventMatch();
 	const {
@@ -234,7 +241,7 @@ export default function BlockTools( {
 					name="__unstable-block-tools-after"
 					ref={ blockToolbarAfterRef }
 				/>
-				{ isZoomOutMode && ! isDragging && (
+				{ isZoomOutMode && ! isDragging && ! isInserterOpened && (
 					<ZoomOutModeInserters
 						__unstableContentRef={ __unstableContentRef }
 					/>
diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js
index f5c45f431e2c8..c4c23d16836b4 100644
--- a/packages/editor/src/components/provider/use-block-editor-settings.js
+++ b/packages/editor/src/components/provider/use-block-editor-settings.js
@@ -274,6 +274,11 @@ function useBlockEditorSettings( settings, postType, postId, renderingMode ) {
 
 	const forceDisableFocusMode = settings.focusMode === false;
 
+	const isInserterOpened = useSelect(
+		( select ) => select( editorStore ).isInserterOpened(),
+		[]
+	);
+
 	return useMemo( () => {
 		const blockEditorSettings = {
 			...Object.fromEntries(
@@ -326,6 +331,7 @@ function useBlockEditorSettings( settings, postType, postId, renderingMode ) {
 				postType === 'wp_navigation'
 					? [ [ 'core/navigation', {}, [] ] ]
 					: settings.template,
+			__experimentalIsInserterOpened: isInserterOpened,
 			__experimentalSetIsInserterOpened: setIsInserterOpened,
 			[ sectionRootClientIdKey ]: sectionRootClientId,
 			editorTool:
@@ -360,6 +366,7 @@ function useBlockEditorSettings( settings, postType, postId, renderingMode ) {
 		globalStylesData,
 		globalStylesLinksData,
 		renderingMode,
+		isInserterOpened,
 	] );
 }