From 5447fd95a423d66ab30a6e1946ffd94b3a2fb461 Mon Sep 17 00:00:00 2001 From: Marin Atanasov Date: Mon, 29 May 2023 14:40:03 +0300 Subject: [PATCH 1/2] Edit Site: Add a loading timeout --- .../edit-site/src/components/layout/hooks.js | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/packages/edit-site/src/components/layout/hooks.js b/packages/edit-site/src/components/layout/hooks.js index 7a89987cb7482..f6e1fb5e4006e 100644 --- a/packages/edit-site/src/components/layout/hooks.js +++ b/packages/edit-site/src/components/layout/hooks.js @@ -10,6 +10,8 @@ import { store as coreStore } from '@wordpress/core-data'; */ import useEditedEntityRecord from '../use-edited-entity-record'; +const MAX_LOADING_TIME = 30000; // 30 seconds + export function useIsSiteEditorLoading() { const { isLoaded: hasLoadedPost } = useEditedEntityRecord(); const [ loaded, setLoaded ] = useState( false ); @@ -22,6 +24,25 @@ export function useIsSiteEditorLoading() { [ loaded ] ); + /* + * If the maximum expected loading time has passed, we're marking the + * editor as loaded, in order to prevent any failed requests from blocking + * the editor canvas from appearing. + */ + useEffect( () => { + let timeout; + + if ( ! loaded ) { + timeout = setTimeout( () => { + setLoaded( true ); + }, MAX_LOADING_TIME ); + } + + return () => { + clearTimeout( timeout ); + }; + }, [ loaded ] ); + useEffect( () => { if ( inLoadingPause ) { /* From e6cd944b2dc4a6a2f2491e0b806c385e9fdc93cf Mon Sep 17 00:00:00 2001 From: Marin Atanasov Date: Wed, 31 May 2023 10:28:48 +0300 Subject: [PATCH 2/2] Set maximum loading time to 10s --- packages/edit-site/src/components/layout/hooks.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/edit-site/src/components/layout/hooks.js b/packages/edit-site/src/components/layout/hooks.js index f6e1fb5e4006e..a9bf1b982903a 100644 --- a/packages/edit-site/src/components/layout/hooks.js +++ b/packages/edit-site/src/components/layout/hooks.js @@ -10,7 +10,7 @@ import { store as coreStore } from '@wordpress/core-data'; */ import useEditedEntityRecord from '../use-edited-entity-record'; -const MAX_LOADING_TIME = 30000; // 30 seconds +const MAX_LOADING_TIME = 10000; // 10 seconds export function useIsSiteEditorLoading() { const { isLoaded: hasLoadedPost } = useEditedEntityRecord();