From fdd158b1c44a4faaf767d42bc6b53d9b8e2bb248 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Fri, 6 Dec 2024 14:28:44 +1100
Subject: [PATCH] Try moving hover animation from resizable frame to editor

---
 packages/edit-site/src/components/editor/index.js  | 12 ++++++++++++
 .../edit-site/src/components/editor/style.scss     |  4 ++--
 .../src/components/resizable-frame/index.js        | 14 +-------------
 3 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js
index c045bafd8a6839..f9cb59fe86637e 100644
--- a/packages/edit-site/src/components/editor/index.js
+++ b/packages/edit-site/src/components/editor/index.js
@@ -263,6 +263,18 @@ export default function EditSiteEditor( { isPostsList = false } ) {
 			) }
 			{ isReady && (
 				<Editor
+					as={ motion.div }
+					whileHover={
+						canvas === 'view'
+							? {
+									scale: 1.005,
+									transition: {
+										duration: disableMotion ? 0 : 0.5,
+										ease: 'easeOut',
+									},
+							  }
+							: {}
+					}
 					postType={ postWithTemplate ? context.postType : postType }
 					postId={ postWithTemplate ? context.postId : postId }
 					templateId={ postWithTemplate ? postId : undefined }
diff --git a/packages/edit-site/src/components/editor/style.scss b/packages/edit-site/src/components/editor/style.scss
index a6cc5084966947..7c804da09b0f50 100644
--- a/packages/edit-site/src/components/editor/style.scss
+++ b/packages/edit-site/src/components/editor/style.scss
@@ -1,7 +1,7 @@
 .edit-site-editor__editor-interface {
 	opacity: 1;
-	transition: opacity 0.1s ease-out;
-	@include reduce-motion( "transition" );
+	// transition: opacity 0.1s ease-out;
+	// @include reduce-motion( "transition" );
 
 	&.is-loading {
 		opacity: 0;
diff --git a/packages/edit-site/src/components/resizable-frame/index.js b/packages/edit-site/src/components/resizable-frame/index.js
index 99f650971112fb..3a8b22bf008c6f 100644
--- a/packages/edit-site/src/components/resizable-frame/index.js
+++ b/packages/edit-site/src/components/resizable-frame/index.js
@@ -12,7 +12,7 @@ import {
 	Tooltip,
 	__unstableMotion as motion,
 } from '@wordpress/components';
-import { useInstanceId, useReducedMotion } from '@wordpress/compose';
+import { useInstanceId } from '@wordpress/compose';
 import { __, isRTL } from '@wordpress/i18n';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 
@@ -91,7 +91,6 @@ function ResizableFrame( {
 	const history = useHistory();
 	const { path, query } = useLocation();
 	const { canvas = 'view' } = query;
-	const disableMotion = useReducedMotion();
 	const [ frameSize, setFrameSize ] = useState( INITIAL_FRAME_SIZE );
 	// The width of the resizable frame when a new resize gesture starts.
 	const [ startingWidth, setStartingWidth ] = useState();
@@ -244,17 +243,6 @@ function ResizableFrame( {
 					setFrameSize( { width: '100%', height: '100%' } );
 				}
 			} }
-			whileHover={
-				canvas === 'view'
-					? {
-							scale: 1.005,
-							transition: {
-								duration: disableMotion ? 0 : 0.5,
-								ease: 'easeOut',
-							},
-					  }
-					: {}
-			}
 			transition={ FRAME_TRANSITION }
 			size={ frameSize }
 			enable={ {