Goals First: Record selected goals for every step in the calypso_sign…

…up_step_start event (#98104)

* record goals for every step in the calypso_signup_step_start event

* record is_goals_first only when available

* include goals and expirement flag in the onboarding steps

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

@@ -18,6 +18,7 @@ import { isUserLoggedIn } from 'calypso/state/current-user/selectors';
 import { setSelectedSiteId } from 'calypso/state/ui/actions';
 import {
 	STEPPER_TRACKS_EVENT_SIGNUP_START,
+	STEPPER_TRACKS_EVENT_SIGNUP_STEP_START,
 	STEPPER_TRACKS_EVENT_STEP_NAV_SUBMIT,
 } from '../constants';
 import { useFlowLocale } from '../hooks/use-flow-locale';
@@ -51,6 +52,10 @@ const onboarding: Flow = {
 	useTracksEventProps() {
 		const isGoalsAtFrontExperiment = useGoalsFirstExperiment()[ 1 ];
 		const userIsLoggedIn = useSelector( isUserLoggedIn );
+		const goals = useSelect(
+			( select ) => ( select( ONBOARD_STORE ) as OnboardSelect ).getGoals(),
+			[]
+		);
 
 		return useMemo(
 			() => ( {
@@ -59,8 +64,14 @@ const onboarding: Flow = {
 					...( isGoalsAtFrontExperiment && { step: 'goals' } ),
 					is_logged_out: ( ! userIsLoggedIn ).toString(),
 				},
+				[ STEPPER_TRACKS_EVENT_SIGNUP_STEP_START ]: {
+					...( isGoalsAtFrontExperiment && {
+						is_goals_first: isGoalsAtFrontExperiment.toString(),
+					} ),
+					...( goals.length && { goals: goals.join( ',' ) } ),
+				},
 			} ),
-			[ isGoalsAtFrontExperiment, userIsLoggedIn ]
+			[ isGoalsAtFrontExperiment, userIsLoggedIn, goals ]
 		);
 	},
 	useSteps() {