Global Styles: Don't call store actions during the render (#67146)

Co-authored-by: Mamaduka <[email protected]> Co-authored-by: getdave <[email protected]>
WordPress · Nov 20, 2024 · 110471f · 110471f
1 parent b408e17
commit 110471f
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/packages/edit-site/src/components/global-styles/screen-style-variations.js b/packages/edit-site/src/components/global-styles/screen-style-variations.js
@@ -6,6 +6,7 @@ import { __ } from '@wordpress/i18n';
 import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
 import { useDispatch } from '@wordpress/data';
 import { store as editorStore } from '@wordpress/editor';
+import { useEffect } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -22,7 +23,9 @@ function ScreenStyleVariations() {
 	// - "Desktop" device preview
 	const { setDeviceType } = useDispatch( editorStore );
 	useZoomOut();
-	setDeviceType( 'desktop' );
+	useEffect( () => {
+		setDeviceType( 'desktop' );
+	}, [ setDeviceType ] );
 
 	return (
 		<>