VKT(Frontend): Persist parts of PublicEnrollmentContactState into ses…

…sion storage for improved UX over page reloads [deploy]

frontend/packages/vkt/src/redux/persist/transforms/PublicEnrollmentContactTransform.ts

@@ -0,0 +1,31 @@
+import { createTransform } from 'reduxjs-toolkit-persist';
+
+import {
+  initialState,
+  PublicEnrollmentContactState,
+} from 'redux/reducers/publicEnrollmentContact';
+
+type OutboundState = PublicEnrollmentContactState;
+
+export const PublicEnrollmentContactTransform = createTransform(
+  // transform state on its way to being serialized and persisted:
+  // retain details provided by user (enrollment details) as well as important inferred details (contacted examiners),
+  // discard rest
+  (
+    inboundState: PublicEnrollmentContactState,
+  ): Partial<PublicEnrollmentContactState> => {
+    return {
+      enrollment: inboundState.enrollment,
+      contactedExaminers: inboundState.contactedExaminers,
+    };
+  },
+  // transform state being rehydrated
+  (outboundState: OutboundState) => {
+    return {
+      ...initialState,
+      ...outboundState,
+    };
+  },
+  // define which reducers this transform gets called for.
+  { whitelist: ['publicEnrollmentContact'] },
+);

frontend/packages/vkt/src/redux/persist/transforms/EnrollmentTransform.ts → frontend/packages/vkt/src/redux/persist/transforms/PublicEnrollmentTransform.ts

@@ -7,7 +7,7 @@ import {
 
 type OutboundState = PublicEnrollmentState;
 
-export const EnrollmentTransform = createTransform(
+export const PublicEnrollmentTransform = createTransform(
   // transform state on its way to being serialized and persisted.
   (inboundState: PublicEnrollmentState) => {
     return {

frontend/packages/vkt/src/redux/reducers/publicEnrollmentContact.ts

@@ -15,7 +15,7 @@ export interface PublicEnrollmentContactState {
   contactedExaminers: Array<WithId>;
 }
 
-const initialState: PublicEnrollmentContactState = {
+export const initialState: PublicEnrollmentContactState = {
   loadExaminerStatus: APIResponseStatus.NotStarted,
   enrollmentSubmitStatus: APIResponseStatus.NotStarted,
   paymentLoadingStatus: APIResponseStatus.NotStarted,

frontend/packages/vkt/src/redux/store/index.ts

@@ -3,7 +3,8 @@ import { combineReducers, configureStore } from '@reduxjs/toolkit';
 import { persistReducer, persistStore } from 'reduxjs-toolkit-persist';
 import storageSession from 'reduxjs-toolkit-persist/lib/storage/session';
 
-import { EnrollmentTransform } from 'redux/persist/transforms/EnrollmentTransform';
+import { PublicEnrollmentContactTransform } from 'redux/persist/transforms/PublicEnrollmentContactTransform';
+import { PublicEnrollmentTransform } from 'redux/persist/transforms/PublicEnrollmentTransform';
 import { APIErrorReducer } from 'redux/reducers/APIError';
 import { clerkEnrollmentAppointmentReducer } from 'redux/reducers/clerkEnrollmentAppointment';
 import { clerkEnrollmentContactRequestReducer } from 'redux/reducers/clerkEnrollmentContactRequest';
@@ -32,8 +33,8 @@ import rootSaga from 'redux/sagas/index';
 const persistConfig = {
   key: 'root',
   storage: storageSession,
-  whitelist: ['publicEnrollment'],
-  transforms: [EnrollmentTransform],
+  whitelist: ['publicEnrollment', 'publicEnrollmentContact'],
+  transforms: [PublicEnrollmentTransform, PublicEnrollmentContactTransform],
 };
 
 const reducer = combineReducers({