From 73e9e6ffcce4e83019a23d8d19b9e24b9937084a Mon Sep 17 00:00:00 2001
From: Ankit Kumar Shah <ankit.shah@rtcamp.com>
Date: Fri, 7 Feb 2025 12:18:44 +0530
Subject: [PATCH 1/5] Reset zoom level on component unmount

---
 packages/editor/src/components/zoom-out-toggle/index.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/editor/src/components/zoom-out-toggle/index.js b/packages/editor/src/components/zoom-out-toggle/index.js
index 2646898a066fb9..a7e563753d1ceb 100644
--- a/packages/editor/src/components/zoom-out-toggle/index.js
+++ b/packages/editor/src/components/zoom-out-toggle/index.js
@@ -80,6 +80,12 @@ const ZoomOutToggle = ( { disabled } ) => {
 		}
 	};
 
+	useEffect( () => {
+		return () => {
+			resetZoomLevel();
+		};
+	}, [ resetZoomLevel ] );
+
 	return (
 		<Button
 			accessibleWhenDisabled

From f3b5029dc2259aec204184380afee3ba92326b60 Mon Sep 17 00:00:00 2001
From: Ankit Kumar Shah <ankit.shah@rtcamp.com>
Date: Wed, 12 Feb 2025 10:44:00 +0530
Subject: [PATCH 2/5] Reset zoom level when viewport changes to desktop

---
 .../editor/use-adapt-editor-to-canvas.js          | 15 ++++++++++++++-
 .../src/components/zoom-out-toggle/index.js       |  6 ------
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
index a09adfb7a49d53..2ee56fe117695e 100644
--- a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
+++ b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
@@ -1,12 +1,17 @@
 /**
  * WordPress dependencies
  */
-import { useDispatch, useSelect, useRegistry } from '@wordpress/data';
+import { useDispatch, useSelect, useRegistry, select } from '@wordpress/data';
 import { store as blockEditorStore } from '@wordpress/block-editor';
 import { store as editorStore } from '@wordpress/editor';
 import { useLayoutEffect } from '@wordpress/element';
 import { store as preferencesStore } from '@wordpress/preferences';
 
+/**
+ * Internal dependencies
+ */
+import { unlock } from '../../lock-unlock';
+
 export function useAdaptEditorToCanvas( canvas ) {
 	const { clearSelectedBlock } = useDispatch( blockEditorStore );
 	const {
@@ -17,6 +22,8 @@ export function useAdaptEditorToCanvas( canvas ) {
 	} = useDispatch( editorStore );
 	const { get: getPreference } = useSelect( preferencesStore );
 	const registry = useRegistry();
+	const { resetZoomLevel } = unlock( useDispatch( blockEditorStore ) );
+	const { isZoomOut } = unlock( select( blockEditorStore ) );
 	useLayoutEffect( () => {
 		const isMediumOrBigger =
 			window.matchMedia( '(min-width: 782px)' ).matches;
@@ -39,6 +46,10 @@ export function useAdaptEditorToCanvas( canvas ) {
 			} else {
 				setIsListViewOpened( false );
 			}
+
+			if ( isMediumOrBigger && isZoomOut() ) {
+				resetZoomLevel();
+			}
 		} );
 	}, [
 		canvas,
@@ -49,5 +60,7 @@ export function useAdaptEditorToCanvas( canvas ) {
 		setIsInserterOpened,
 		setIsListViewOpened,
 		getPreference,
+		resetZoomLevel,
+		isZoomOut,
 	] );
 }
diff --git a/packages/editor/src/components/zoom-out-toggle/index.js b/packages/editor/src/components/zoom-out-toggle/index.js
index a7e563753d1ceb..2646898a066fb9 100644
--- a/packages/editor/src/components/zoom-out-toggle/index.js
+++ b/packages/editor/src/components/zoom-out-toggle/index.js
@@ -80,12 +80,6 @@ const ZoomOutToggle = ( { disabled } ) => {
 		}
 	};
 
-	useEffect( () => {
-		return () => {
-			resetZoomLevel();
-		};
-	}, [ resetZoomLevel ] );
-
 	return (
 		<Button
 			accessibleWhenDisabled

From e8ce9075d9d7148736f9f3e6093cdc169b13a79c Mon Sep 17 00:00:00 2001
From: Ankit Kumar Shah <ankit.shah@rtcamp.com>
Date: Fri, 14 Feb 2025 10:08:42 +0530
Subject: [PATCH 3/5] Improve block editor store hooks organization

---
 .../src/components/editor/use-adapt-editor-to-canvas.js  | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
index 2ee56fe117695e..3e9de25037126c 100644
--- a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
+++ b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useDispatch, useSelect, useRegistry, select } from '@wordpress/data';
+import { useDispatch, useSelect, useRegistry } from '@wordpress/data';
 import { store as blockEditorStore } from '@wordpress/block-editor';
 import { store as editorStore } from '@wordpress/editor';
 import { useLayoutEffect } from '@wordpress/element';
@@ -13,7 +13,10 @@ import { store as preferencesStore } from '@wordpress/preferences';
 import { unlock } from '../../lock-unlock';
 
 export function useAdaptEditorToCanvas( canvas ) {
-	const { clearSelectedBlock } = useDispatch( blockEditorStore );
+	const { clearSelectedBlock, resetZoomLevel } = unlock(
+		useDispatch( blockEditorStore )
+	);
+	const { isZoomOut } = unlock( useSelect( blockEditorStore ) );
 	const {
 		setDeviceType,
 		closePublishSidebar,
@@ -22,8 +25,6 @@ export function useAdaptEditorToCanvas( canvas ) {
 	} = useDispatch( editorStore );
 	const { get: getPreference } = useSelect( preferencesStore );
 	const registry = useRegistry();
-	const { resetZoomLevel } = unlock( useDispatch( blockEditorStore ) );
-	const { isZoomOut } = unlock( select( blockEditorStore ) );
 	useLayoutEffect( () => {
 		const isMediumOrBigger =
 			window.matchMedia( '(min-width: 782px)' ).matches;

From 761ffb28b3f5f8de6cb93615fe57ace3f2a6a8f1 Mon Sep 17 00:00:00 2001
From: Infinite-Null <ankit.kum.sha9933@gmail.com>
Date: Wed, 20 May 2026 21:21:01 +0530
Subject: [PATCH 4/5] Fix: import comment

---
 .../src/components/editor/use-adapt-editor-to-canvas.js       | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
index 7ec37236ed393f..c2911ce90b7813 100644
--- a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
+++ b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
@@ -11,10 +11,6 @@ import { store as preferencesStore } from '@wordpress/preferences';
  * Internal dependencies
  */
 import { unlock } from '../../lock-unlock';
-
-/**
- * Internal dependencies
- */
 import { DEFAULT_DEVICE_TYPE } from '../block-editor/use-viewport-sync';
 
 export function useAdaptEditorToCanvas( canvas ) {

From 0f05233fd448347a2e72c52bd89fcd0bea7c7c13 Mon Sep 17 00:00:00 2001
From: Infinite-Null <ankit.kum.sha9933@gmail.com>
Date: Thu, 21 May 2026 19:43:39 +0530
Subject: [PATCH 5/5] Fix zoom handling in useScaleCanvas and remove unused
 resetZoomLevel in useAdaptEditorToCanvas

---
 .../src/components/iframe/use-scale-canvas.js        | 10 ++++++++--
 .../components/editor/use-adapt-editor-to-canvas.js  | 12 +-----------
 2 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/packages/block-editor/src/components/iframe/use-scale-canvas.js b/packages/block-editor/src/components/iframe/use-scale-canvas.js
index 63b03e4892465f..01bb4e67831532 100644
--- a/packages/block-editor/src/components/iframe/use-scale-canvas.js
+++ b/packages/block-editor/src/components/iframe/use-scale-canvas.js
@@ -312,8 +312,14 @@ export function useScaleCanvas( {
 	 * changes due to the container resizing.
 	 */
 	useEffect( () => {
-		const trigger =
-			iframeDocument && previousIsZoomedOut.current !== isZoomedOut;
+		// Wait for the iframe document so a zoom out state that is already
+		// active on mount (e.g. when the canvas is remounted on a viewport
+		// change) is still detected as a transition.
+		if ( ! iframeDocument ) {
+			return;
+		}
+
+		const trigger = previousIsZoomedOut.current !== isZoomedOut;
 
 		previousIsZoomedOut.current = isZoomedOut;
 
diff --git a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
index c2911ce90b7813..23c728f71cad8d 100644
--- a/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
+++ b/packages/edit-site/src/components/editor/use-adapt-editor-to-canvas.js
@@ -10,14 +10,10 @@ import { store as preferencesStore } from '@wordpress/preferences';
 /**
  * Internal dependencies
  */
-import { unlock } from '../../lock-unlock';
 import { DEFAULT_DEVICE_TYPE } from '../block-editor/use-viewport-sync';
 
 export function useAdaptEditorToCanvas( canvas ) {
-	const { clearSelectedBlock, resetZoomLevel } = unlock(
-		useDispatch( blockEditorStore )
-	);
-	const { isZoomOut } = unlock( useSelect( blockEditorStore ) );
+	const { clearSelectedBlock } = useDispatch( blockEditorStore );
 	const {
 		editPost,
 		setDeviceType,
@@ -53,10 +49,6 @@ export function useAdaptEditorToCanvas( canvas ) {
 			} else {
 				setIsListViewOpened( false );
 			}
-
-			if ( isMediumOrBigger && isZoomOut() ) {
-				resetZoomLevel();
-			}
 		} );
 	}, [
 		canvas,
@@ -68,8 +60,6 @@ export function useAdaptEditorToCanvas( canvas ) {
 		setIsInserterOpened,
 		setIsListViewOpened,
 		getPreference,
-		resetZoomLevel,
-		isZoomOut,
 		getCurrentPost,
 	] );
 }