Merge pull request #612 from newfold-labs/fix/onboarding-flow-error

Fix Onboarding Flow GET Error

src/OnboardingSPA/components/ThemeContextProvider/index.js

@@ -7,7 +7,7 @@ import { THEME_DARK, THEME_LIGHT } from '../../../constants';
 const ThemeContext = createContext();
 
 function usePreferredColorScheme( currentData ) {
-	if ( currentData.sitegenThemeMode ) {
+	if ( currentData?.sitegenThemeMode ) {
 		return currentData.sitegenThemeMode;
 	}
 

src/OnboardingSPA/index.js

@@ -9,6 +9,7 @@ import { dispatch } from '@wordpress/data';
 import { render } from '@wordpress/element';
 import { getInitialChapters } from './data/flows';
 import { stateToStore } from './chapters/utils';
+import { functionRetryHandler } from './utils/api/utils';
 
 /**
  * Component passed to wp.element.render().
@@ -49,9 +50,9 @@ export async function initializeNFDOnboarding( id, runtime ) {
 		);
 	}
 
-	const currentData = await getFlow();
+	const currentData = await functionRetryHandler( getFlow, 3 );
 
-	if ( currentData.error === null ) {
+	if ( currentData !== false ) {
 		currentData.body = initializeFlowData( currentData.body );
 		dispatch( nfdOnboardingStore ).setCurrentOnboardingData(
 			currentData.body

src/OnboardingSPA/store/selectors.js

@@ -434,11 +434,11 @@ export function getNavErrorPath( state ) {
 }
 
 export function getExperienceLevel( state ) {
-	return state.data.flowData.data.wpComfortLevel;
+	return state.data.flowData?.data.wpComfortLevel;
 }
 
 export function getTopPriority( state ) {
-	return state.data.flowData.data.topPriority.priority1;
+	return state.data.flowData?.data.topPriority.priority1;
 }
 
 /**
@@ -461,7 +461,7 @@ export function getCustomizeSidebarData( state ) {
 }
 
 export function getSiteGenErrorStatus( state ) {
-	return state.data.flowData.sitegen.siteGenErrorMeta.status;
+	return state.data.flowData?.sitegen.siteGenErrorMeta.status;
 }
 
 export function getInteractionDisabled( state ) {

src/OnboardingSPA/utils/api/utils.js

@@ -0,0 +1,28 @@
+/**
+ * Retries a given API function until the specified retry count is reached.
+ *
+ * @param {Function} func       - The API function to be retried. It should return a promise.
+ * @param {number}   retryCount - The number of times to retry the function before giving up.
+ * @return {Promise<any|boolean>} - Resolves with the data returned by the API function if successful, or `false` if all retries fail.
+ */
+export async function functionRetryHandler( func, retryCount ) {
+	let attempts = 0;
+	while ( attempts < retryCount ) {
+		try {
+			const data = await func();
+			attempts++;
+			if ( data.error === null ) {
+				return data;
+			}
+		} catch ( error ) {
+			attempts++;
+			// eslint-disable-next-line no-console
+			console.error( 'Failed to retrieve data', error );
+
+			if ( attempts >= retryCount ) {
+				return false;
+			}
+		}
+	}
+	return false;
+}