Fix: Add the goals step back to site-setup on staging (#97255)

The goals step was unintentionally removed from all flows on staging in
#96866. But we only want it removed when the user began on the
`onboarding` flow.

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

@@ -1,4 +1,3 @@
-import { isEnabled } from '@automattic/calypso-config';
 import { OnboardSelect, Onboard } from '@automattic/data-stores';
 import { ONBOARDING_FLOW } from '@automattic/onboarding';
 import { useDispatch, useSelect } from '@wordpress/data';
@@ -95,6 +94,8 @@ const onboarding: Flow = {
 		const [ useMyDomainQueryParams, setUseMyDomainQueryParams ] = useState( {} );
 		const [ useMyDomainTracksEventProps, setUseMyDomainTracksEventProps ] = useState( {} );
 
+		const [ , isGoalsAtFrontExperiment ] = useGoalsFirstExperiment();
+
 		clearUseMyDomainsQueryParams( currentStepSlug );
 
 		const submit = async ( providedDependencies: ProvidedDependencies = {} ) => {
@@ -204,7 +205,7 @@ const onboarding: Flow = {
 				case 'processing': {
 					const destination = addQueryArgs( '/setup/site-setup', {
 						siteSlug: providedDependencies.siteSlug,
-						...( isEnabled( 'onboarding/goals-first' ) && { flags: 'onboarding/goals-first' } ),
+						...( isGoalsAtFrontExperiment && { 'goals-at-front-experiment': true } ),
 					} );
 					persistSignupDestination( destination );
 					setSignupCompleteFlowName( flowName );

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

@@ -12,6 +12,7 @@ import { ImporterMainPlatform } from 'calypso/lib/importer/types';
 import { addQueryArgs } from 'calypso/lib/route';
 import { useDispatch as reduxDispatch, useSelector } from 'calypso/state';
 import { recordTracksEvent } from 'calypso/state/analytics/actions';
+import { getInitialQueryArguments } from 'calypso/state/selectors/get-initial-query-arguments';
 import { getActiveTheme, getCanonicalTheme } from 'calypso/state/themes/selectors';
 import { WRITE_INTENT_DEFAULT_DESIGN } from '../constants';
 import { useIsGoalsHoldout } from '../hooks/use-is-goals-holdout';
@@ -20,7 +21,6 @@ import { useSiteData } from '../hooks/use-site-data';
 import { useCanUserManageOptions } from '../hooks/use-user-can-manage-options';
 import { ONBOARD_STORE, SITE_STORE, USER_STORE, STEPPER_INTERNAL_STORE } from '../stores';
 import { shouldRedirectToSiteMigration } from './helpers';
-import { useGoalsFirstExperiment } from './helpers/use-goals-first-experiment';
 import { useLaunchpadDecider } from './internals/hooks/use-launchpad-decider';
 import { STEPS } from './internals/steps';
 import { redirect } from './internals/steps-repository/import/util';
@@ -67,8 +67,9 @@ const siteSetupFlow: Flow = {
 	},
 
 	useSteps() {
-		// We have already checked the value has loaded in useAssertConditions
-		const [ , isGoalsAtFrontExperiment ] = useGoalsFirstExperiment();
+		const isGoalsAtFrontExperiment = Boolean(
+			useSelector( getInitialQueryArguments )?.[ 'goals-at-front-experiment' ]
+		);
 
 		const steps = [
 			STEPS.GOALS,
@@ -731,13 +732,6 @@ const siteSetupFlow: Flow = {
 			};
 		}
 
-		const [ isLoadingGoalsFirstExp ] = useGoalsFirstExperiment();
-		if ( isLoadingGoalsFirstExp ) {
-			result = {
-				state: AssertConditionState.CHECKING,
-			};
-		}
-
 		return result;
 	},
 };

client/landing/stepper/declarative-flow/test/site-setup-flow.tsx

@@ -1,7 +1,7 @@
 /**
  * @jest-environment jsdom
  */
-import { renderHook } from '@testing-library/react';
+import { renderHookWithProvider } from '../../../../test-helpers/testing-library';
 import { STEPS } from '../internals/steps';
 import siteSetupFlow from '../site-setup-flow';
 import { getFlowLocation, renderFlow } from './helpers';
@@ -28,7 +28,7 @@ describe( 'Site Setup Flow', () => {
 	 * It's totally fine to change this test if the flow changes. But please make sure to update and test the site-setup-wg accordingly.
 	 */
 	describe( 'First steps should be goals and intent capture', () => {
-		const { result } = renderHook( () => siteSetupFlow.useSteps() );
+		const { result } = renderHookWithProvider( () => siteSetupFlow.useSteps() );
 		const firstStep = result.current[ 0 ];
 		const secondStep = result.current[ 1 ];