wpcom-block-editor-nux: avoid using useLocation which throws exceptio…

…n outside Site Editor in GB 19.9.0 (#40656)

projects/packages/jetpack-mu-wpcom/changelog/fix-uselocation-exception

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+wpcom-block-editor-nux: avoid using useLocation which now throws exception outside Site Editor in Gutenberg 19.9.0

projects/packages/jetpack-mu-wpcom/src/common/hooks/use-canvas-mode.ts

@@ -1,20 +1,25 @@
-import { useSelect } from '@wordpress/data';
-import useLocation from './use-location';
+import { subscribe, useSelect } from '@wordpress/data';
+import { useEffect, useState } from 'react';
 
 const useCanvasMode = () => {
-	const location = useLocation();
+	const [ canvasMode, setCanvasMode ] = useState< string | null >( null );
+	const isSiteEditor = useSelect( select => !! select( 'core/edit-site' ), [] );
 
-	return useSelect(
-		select => {
-			// The canvas mode is limited to the site editor.
-			if ( ! select( 'core/edit-site' ) ) {
-				return null;
-			}
+	useEffect( () => {
+		// The canvas mode is limited to the site editor.
+		if ( ! isSiteEditor ) {
+			return;
+		}
 
-			return new URLSearchParams( location?.search ).get( 'canvas' ) || 'view';
-		},
-		[ location?.search ]
-	);
+		const unsubscribe = subscribe( () => {
+			const mode = new URLSearchParams( window.location?.search ).get( 'canvas' ) || 'view';
+			setCanvasMode( mode );
+		} );
+
+		return () => unsubscribe();
+	}, [ isSiteEditor ] );
+
+	return canvasMode;
 };
 
 export default useCanvasMode;