Start saving starting point form state

src/app/app.ts

@@ -1,13 +1,14 @@
 import { ChangeDetectionStrategy, Component, inject, OnInit } from '@angular/core';
 import { AppStateStore } from './app.state';
 import { StartingPoint } from './views/starting-point/starting-point';
+import { CollegeSelection } from './views/college-selection/college-selection';
 
 @Component({
 	selector: 'app-root',
 	templateUrl: './app.html',
 	styleUrl: './app.scss',
 	changeDetection: ChangeDetectionStrategy.OnPush,
-	imports: [StartingPoint],
+	imports: [StartingPoint, CollegeSelection],
 })
 export class App implements OnInit {
 	private readonly state = inject(AppStateStore);

src/app/views/starting-point/starting-point.state.ts

@@ -1,10 +1,11 @@
-import { effect } from '@angular/core';
-import { getState, patchState, signalStore, watchState, withHooks, withMethods, withState } from '@ngrx/signals';
+import { FormControlStatus } from '@angular/forms';
+import { patchState, signalStore, watchState, withHooks, withMethods, withState } from '@ngrx/signals';
 
 export type StartingPointState = {
 	name: string;
 	gender: Gender;
 	afterHighSchool: AfterHighSchool;
+	formStatus: FormControlStatus;
 };
 
 export enum Gender {
@@ -23,16 +24,26 @@ const initialState: StartingPointState = {
 	name: '',
 	gender: Gender.Undefined,
 	afterHighSchool: AfterHighSchool.Undefined,
+	formStatus: 'INVALID',
 };
 
 export const StartingPointStateStore = signalStore(
 	withState(initialState),
 	withMethods(store => ({
 		updateState: ({ name, gender, afterHighSchool }: Partial<StartingPointState>) =>
-			patchState(store, () => ({
-				name: name ?? '',
-				gender: gender ?? Gender.Undefined,
-				afterHighSchool: afterHighSchool ?? AfterHighSchool.Undefined,
+			patchState(store, state => {
+				const updatedState: Partial<StartingPointState> = Object.fromEntries(
+					Object.entries({ name, gender, afterHighSchool }).filter(([, value]) => !!value)
+				);
+				return {
+					...state,
+					...updatedState,
+				};
+			}),
+		updateFormStatus: (formStatus: FormControlStatus) =>
+			patchState(store, state => ({
+				...state,
+				formStatus,
 			})),
 	})),
 	withHooks({

src/app/views/starting-point/starting-point.ts

@@ -71,6 +71,8 @@ export class StartingPoint implements OnInit {
 			.subscribe(({ name, gender, afterHighSchool }) =>
 				this.state.updateState({ name, gender, afterHighSchool } as Partial<StartingPointState>)
 			);
+
+		this.form.statusChanges.pipe(takeUntilDestroyed()).subscribe(status => this.state.updateFormStatus(status));
 	}
 
 	ngOnInit(): void {}