Revert "Goals first: Reset onboard store when entering the flow (#97936…

…)" (#98007)

This reverts commit 9aae00e.

client/landing/stepper/declarative-flow/internals/steps-repository/create-site/index.tsx

@@ -183,10 +183,7 @@ const CreateSite: Step = function CreateSite( { navigation, flow, data } ) {
 	//User has already reached checkout and then hit the browser back button.
 	//In this case, site has already been created, and plan added to cart. We need to avoid to create another site.
 	const isManageSiteFlow = Boolean(
-		wasSignupCheckoutPageUnloaded() &&
-			signupDestinationCookieExists &&
-			isReEnteringFlow &&
-			getSignupCompleteSlug()
+		wasSignupCheckoutPageUnloaded() && signupDestinationCookieExists && isReEnteringFlow
 	);
 	const { addTempSiteToSourceOption } = useAddTempSiteToSourceOptionMutation();
 	const urlQueryParams = useQuery();

client/landing/stepper/declarative-flow/onboarding.ts

@@ -1,18 +1,15 @@
 import { OnboardSelect, Onboard, UserSelect } from '@automattic/data-stores';
-import { ONBOARDING_FLOW, clearStepPersistedState } from '@automattic/onboarding';
+import { ONBOARDING_FLOW } from '@automattic/onboarding';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { addQueryArgs, getQueryArg, getQueryArgs, removeQueryArgs } from '@wordpress/url';
-import { useState, useMemo, useEffect } from 'react';
+import { useState, useMemo } from 'react';
 import { SIGNUP_DOMAIN_ORIGIN } from 'calypso/lib/analytics/signup';
 import { pathToUrl } from 'calypso/lib/url';
 import {
-	clearSignupCompleteSlug,
 	persistSignupDestination,
 	setSignupCompleteFlowName,
 	setSignupCompleteSlug,
 } from 'calypso/signup/storageUtils';
-import { useDispatch as useReduxDispatch } from 'calypso/state';
-import { setSelectedSiteId } from 'calypso/state/ui/actions';
 import {
 	STEPPER_TRACKS_EVENT_SIGNUP_START,
 	STEPPER_TRACKS_EVENT_STEP_NAV_SUBMIT,
@@ -347,19 +344,6 @@ const onboarding: Flow = {
 			state: isLoading ? AssertConditionState.CHECKING : AssertConditionState.SUCCESS,
 		};
 	},
-	useSideEffect( currentStepSlug ) {
-		const reduxDispatch = useReduxDispatch();
-		const { resetOnboardStore } = useDispatch( ONBOARD_STORE );
-
-		useEffect( () => {
-			if ( ! currentStepSlug ) {
-				resetOnboardStore();
-				reduxDispatch( setSelectedSiteId( null ) );
-				clearStepPersistedState( this.name );
-				clearSignupCompleteSlug();
-			}
-		}, [ currentStepSlug, reduxDispatch, resetOnboardStore ] );
-	},
 };
 
 export default onboarding;

client/landing/stepper/declarative-flow/site-setup-flow.ts

@@ -96,7 +96,6 @@ const siteSetupFlow: Flow = {
 	},
 	useStepNavigation( currentStep, navigate ) {
 		const isGoalsHoldout = useIsGoalsHoldout( currentStep );
-		const isGoalsAtFrontExperiment = useGoalsAtFrontExperimentQueryParam();
 
 		const intent = useSelect(
 			( select ) => ( select( ONBOARD_STORE ) as OnboardSelect ).getIntent(),
@@ -247,10 +246,8 @@ const siteSetupFlow: Flow = {
 
 			navigate( 'processing' );
 
-			if ( ! isGoalsAtFrontExperiment ) {
-				// Clean-up the store so that if onboard for new site will be launched it will be launched with no preselected values
-				resetOnboardStoreWithSkipFlags( [ 'skipPendingAction', 'skipIntent' ] );
-			}
+			// Clean-up the store so that if onboard for new site will be launched it will be launched with no preselected values
+			resetOnboardStoreWithSkipFlags( [ 'skipPendingAction', 'skipIntent', 'skipSelectedDesign' ] );
 		};
 
 		const { getPostFlowUrl, initializeLaunchpadState } = useLaunchpadDecider( {

client/signup/steps/domains/index.jsx

@@ -34,7 +34,6 @@ import {
 	planItem,
 	hasPlan,
 	hasDomainRegistration,
-	hasPersonalPlan,
 	getDomainsInCart,
 } from 'calypso/lib/cart-values/cart-items';
 import {
@@ -187,19 +186,6 @@ export class RenderDomainsStep extends Component {
 		}
 	}
 
-	componentDidUpdate( prevProps ) {
-		if ( prevProps?.cart?.products?.length !== this.props?.cart?.products?.length ) {
-			if (
-				shouldUseMultipleDomainsInCart( this.props.flowName ) &&
-				hasDomainRegistration( this.props.cart ) &&
-				! hasPersonalPlan( this.props.cart )
-			) {
-				// This call is expensive, so we only do it if the mini-cart hasDomainRegistration.
-				this.props.shoppingCartManager.addProductsToCart( [ this.props.multiDomainDefaultPlan ] );
-			}
-		}
-	}
-
 	getLocale() {
 		return ! this.props.userLoggedIn ? this.props.locale : '';
 	}

client/signup/storageUtils.js

@@ -39,8 +39,6 @@ export const setSignupCompleteSlug = ( value ) =>
 	ignoreFatalsForStorage( () =>
 		sessionStorage?.setItem( 'wpcom_signup_complete_site_slug', value )
 	);
-export const clearSignupCompleteSlug = () =>
-	ignoreFatalsForStorage( () => sessionStorage?.removeItem( 'wpcom_signup_complete_site_slug' ) );
 export const getSignupCompleteSiteID = () =>
 	ignoreFatalsForStorage( () => sessionStorage?.getItem( 'wpcom_signup_complete_site_id' ) );
 export const setSignupCompleteSiteID = ( value ) =>

packages/onboarding/src/hooks/use-persisted-state.ts

@@ -23,25 +23,6 @@ function getPersistedState( key: string, storage: Storage, TTL: number ) {
 	}
 }
 
-function getPersistedStateKey( flow?: string, step?: string, lang?: string, cacheKey?: string ) {
-	return [ VERSION, KEY, flow, step, lang, cacheKey ].filter( Boolean ).join( '-' );
-}
-
-/**
- * Clears all persisted state created by useStepPersistedState
- * @param flow The desired flow to clear
- * @param storage The storage to clear (defaults to localStorage)
- */
-export function clearStepPersistedState( flow?: string, storage: Storage = localStorage ): void {
-	const keys = Object.keys( storage );
-	const persistedKeys = keys.filter( ( key ) => key.startsWith( getPersistedStateKey( flow ) ) );
-
-	persistedKeys.forEach( ( key ) => {
-		storage.removeItem( key );
-		storage.removeItem( key + 'time' );
-	} );
-}
-
 type Options = {
 	/**
 	 * The used storage, defaults to sessionStorage.
@@ -55,6 +36,7 @@ type Options = {
 
 /**
  * A hook similar to useState, but persists the state. Uses `flow`, `step` and `lang`, and the passed key in the tree as keys.
+ *
  * @param cacheKey the cache key. It will be concatenated with the flow, step and lang.
  * @param defaultValue the initial value of the state.
  * @param options the options for the hook.
@@ -64,10 +46,10 @@ export function useStepPersistedState< T >(
 	cacheKey: string,
 	defaultValue?: T,
 	options: Options = { storage: localStorage, TTL: TWENTY_MINUTES }
-) {
+): [ T, ( newState: T ) => void ] {
 	const match = useMatch( '/:flow/:step?/:lang?' );
 	const { flow = 'flow', step = 'step', lang = 'lang' } = match?.params || {};
-	const key = getPersistedStateKey( flow, step, lang, cacheKey );
+	const key = [ VERSION, KEY, flow, step, lang, cacheKey ].join( '-' );
 
 	const [ state, _setState ] = useState< T >(
 		getPersistedState( key, options.storage, options.TTL ) || defaultValue
@@ -81,5 +63,5 @@ export function useStepPersistedState< T >(
 		[ _setState, key, options.storage ]
 	);
 
-	return [ state, setState ] as const;
+	return [ state, setState ];
 }

packages/onboarding/src/index.ts

@@ -26,7 +26,7 @@ export { default as SelectItemsAlt } from './select-items-alt';
 export { default as StepContainer } from './step-container';
 export { default as StepNavigationLink } from './step-navigation-link';
 export { default as MShotsImage } from './mshots-image';
-export { useStepPersistedState, clearStepPersistedState } from './hooks/use-persisted-state';
+export { useStepPersistedState } from './hooks/use-persisted-state';
 export * from './navigator';
 export { default as Notice } from './notice';
 export { default as SelectCardCheckbox } from './select-card-checkbox';