Skip to content

Commit b3f231a

Browse files
authored
refactor(frontend) update childrens-application (#4849)
1 parent 460e337 commit b3f231a

File tree

4 files changed

+19
-66
lines changed

4 files changed

+19
-66
lines changed

frontend/app/routes/protected/application/renewal-children/childrens-application.tsx

Lines changed: 7 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import type { Route } from './+types/childrens-application';
1212

1313
import { TYPES } from '~/.server/constants';
1414
import { loadProtectedApplicationRenewalChildState } from '~/.server/routes/helpers/protected-application-renewal-child-route-helpers';
15-
import { isChildDentalBenefitsSectionCompleted, isChildDentalInsuranceSectionCompleted, isChildParentGuardianSectionCompleted, isChildSinSectionCompleted } from '~/.server/routes/helpers/protected-application-renewal-section-checks';
15+
import { isChildDentalBenefitsSectionCompleted, isChildDentalInsuranceSectionCompleted, isChildParentGuardianSectionCompleted } from '~/.server/routes/helpers/protected-application-renewal-section-checks';
1616
import { saveProtectedApplicationState, validateApplicationFlow } from '~/.server/routes/helpers/protected-application-route-helpers';
1717
import { getFixedT, getLocale } from '~/.server/utils/locale.utils';
1818
import { Button, ButtonLink } from '~/components/buttons';
@@ -76,7 +76,7 @@ export async function loader({ context: { appContainer, session }, request, para
7676
? await provincialGovernmentInsurancePlanService.getLocalizedProvincialGovernmentInsurancePlanById(child.dentalBenefits.value.provincialTerritorialSocialProgram, locale)
7777
: undefined;
7878

79-
const immutableChild = state.clientApplication.children.find((c) => c.information.socialInsuranceNumber === child.information?.socialInsuranceNumber);
79+
const immutableChild = state.clientApplication.children.find((c) => c.information.clientNumber === child.information?.memberId);
8080
const clientDentalBenefits = (await immutableChild?.dentalBenefits.reduce(async (benefitsPromise, id) => {
8181
const benefits = await benefitsPromise;
8282

@@ -108,8 +108,6 @@ export async function loader({ context: { appContainer, session }, request, para
108108
return {
109109
...child,
110110
clientApplication: {
111-
socialInsuranceNumber: immutableChild?.information.socialInsuranceNumber,
112-
isParent: immutableChild?.information.isParent,
113111
clientDentalBenefits: clientDentalBenefits.federalBenefit?.access || clientDentalBenefits.provTerrBenefit?.access ? clientDentalBenefits : undefined,
114112
},
115113
dentalBenefits: child.dentalBenefits
@@ -138,9 +136,6 @@ export async function loader({ context: { appContainer, session }, request, para
138136
state.children.map((child) => [
139137
child.id,
140138
{
141-
sin: {
142-
completed: isChildSinSectionCompleted(child),
143-
},
144139
parentGuardian: {
145140
completed: isChildParentGuardianSectionCompleted(child),
146141
},
@@ -220,12 +215,11 @@ export default function ProtectedRenewChildChildrensApplication({ loaderData, pa
220215
<CardHeader>
221216
<CardTitle>{t('protected-application-renewal-child:childrens-application.sin-card-title')}</CardTitle>
222217
<CardAction>
223-
{sections.sin.completed && <StatusTag status="complete" />}
224-
{!sections.sin.completed && (child.information?.socialInsuranceNumber !== undefined || child.clientApplication.socialInsuranceNumber !== undefined) && <StatusTag status="optional" />}
218+
<StatusTag status="optional" />
225219
</CardAction>
226220
</CardHeader>
227221
<ChildSinCardContent child={child} />
228-
<ChildSinCardFooter child={child} sectionCompleted={sections.sin.completed} params={params} />
222+
<ChildSinCardFooter child={child} params={params} sectionCompleted={true} />
229223
</Card>
230224

231225
<Card className="my-4">
@@ -276,9 +270,6 @@ export default function ProtectedRenewChildChildrensApplication({ loaderData, pa
276270
*
277271
* - If the user has entered a SIN (child.information.socialInsuranceNumber is defined), show the formatted SIN.
278272
*
279-
* - If the user has not entered a SIN but there is a SIN from the client application (child.clientApplication.socialInsuranceNumber is defined),
280-
* show the formatted client SIN.
281-
*
282273
* - If there is no SIN at all, show the help text.
283274
*/
284275
function ChildSinCardContent({ child }: { child: Route.ComponentProps['loaderData']['state']['children'][0] }): JSX.Element {
@@ -297,19 +288,6 @@ function ChildSinCardContent({ child }: { child: Route.ComponentProps['loaderDat
297288
);
298289
}
299290

300-
// Fall back to client application SIN
301-
if (child.clientApplication.socialInsuranceNumber) {
302-
return (
303-
<CardContent>
304-
<DefinitionList layout="single-column">
305-
<DefinitionListItem term={t('protected-application-renewal-child:childrens-application.sin-title')}>
306-
<p>{formatSin(child.clientApplication.socialInsuranceNumber)}</p>
307-
</DefinitionListItem>
308-
</DefinitionList>
309-
</CardContent>
310-
);
311-
}
312-
313291
// No SIN at all
314292
return (
315293
<CardContent>
@@ -325,12 +303,10 @@ function ChildSinCardContent({ child }: { child: Route.ComponentProps['loaderDat
325303
*
326304
* - If there is no SIN at all, show the "Add" button.
327305
*/
328-
function ChildSinCardFooter({ child, sectionCompleted, params }: { child: Route.ComponentProps['loaderData']['state']['children'][0]; sectionCompleted: boolean; params: Route.ComponentProps['params'] }): JSX.Element {
306+
function ChildSinCardFooter({ child, params }: { child: Route.ComponentProps['loaderData']['state']['children'][0]; sectionCompleted: boolean; params: Route.ComponentProps['params'] }): JSX.Element {
329307
const { t } = useTranslation(handle.i18nNamespaces);
330308

331-
const hasSin = child.information?.socialInsuranceNumber !== undefined || child.clientApplication.socialInsuranceNumber !== undefined;
332-
333-
if (hasSin || sectionCompleted) {
309+
if (child.information?.socialInsuranceNumber !== undefined) {
334310
return (
335311
<CardFooter className="border-t bg-zinc-100">
336312
<ButtonLink id={`edit-child-sin-${child.id}`} variant="link" className="p-0" routeId="protected/application/$id/children/$childId/social-insurance-number" params={{ ...params, childId: child.id }} startIcon={faPenToSquare} size="lg">
@@ -354,9 +330,6 @@ function ChildSinCardFooter({ child, sectionCompleted, params }: { child: Route.
354330
*
355331
* - If the user has entered parent/guardian status (child.information.isParent is defined), show Yes/No.
356332
*
357-
* - If the user has not entered parent/guardian status but there is client data (child.clientApplication.isParent is defined),
358-
* show the client value.
359-
*
360333
* - If there is no parent/guardian status at all, show the help text.
361334
*/
362335
function ChildParentGuardianCardContent({ child }: { child: Route.ComponentProps['loaderData']['state']['children'][0] }): JSX.Element {
@@ -375,19 +348,6 @@ function ChildParentGuardianCardContent({ child }: { child: Route.ComponentProps
375348
);
376349
}
377350

378-
// Fall back to client application value
379-
if (child.clientApplication.isParent !== undefined) {
380-
return (
381-
<CardContent>
382-
<DefinitionList layout="single-column">
383-
<DefinitionListItem term={t('protected-application-renewal-child:childrens-application.parent-guardian-title')}>
384-
<p>{child.clientApplication.isParent ? t('protected-application-renewal-child:childrens-application.yes') : t('protected-application-renewal-child:childrens-application.no')}</p>
385-
</DefinitionListItem>
386-
</DefinitionList>
387-
</CardContent>
388-
);
389-
}
390-
391351
// No value at all
392352
return (
393353
<CardContent>
@@ -406,9 +366,7 @@ function ChildParentGuardianCardContent({ child }: { child: Route.ComponentProps
406366
function ChildParentGuardianCardFooter({ child, sectionCompleted, params }: { child: Route.ComponentProps['loaderData']['state']['children'][0]; sectionCompleted: boolean; params: Route.ComponentProps['params'] }): JSX.Element {
407367
const { t } = useTranslation(handle.i18nNamespaces);
408368

409-
const hasValue = child.information?.isParent !== undefined || child.clientApplication.isParent !== undefined;
410-
411-
if (hasValue || sectionCompleted) {
369+
if (child.information?.isParent !== undefined || sectionCompleted) {
412370
return (
413371
<CardFooter className="border-t bg-zinc-100">
414372
<ButtonLink id={`edit-child-parent-${child.id}`} variant="link" className="p-0" routeId="protected/application/$id/children/$childId/parent-guardian" params={{ ...params, childId: child.id }} startIcon={faPenToSquare} size="lg">

frontend/app/routes/protected/application/spokes/child-social-insurance-number.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { z } from 'zod';
66
import type { Route } from './+types/child-social-insurance-number';
77

88
import { TYPES } from '~/.server/constants';
9+
import type { ChildInformationState } from '~/.server/routes/helpers/protected-application-route-helpers';
910
import { getProtectedApplicationState, getSingleChildState, saveProtectedApplicationState, validateApplicationFlow } from '~/.server/routes/helpers/protected-application-route-helpers';
1011
import { getFixedT } from '~/.server/utils/locale.utils';
1112
import { transformFlattenedError } from '~/.server/utils/zod.utils';
@@ -112,10 +113,10 @@ export async function action({ context: { appContainer, session }, params, reque
112113
if (child.id !== childState.id) return child;
113114
return {
114115
...child,
115-
childInformation: {
116+
information: {
116117
...child.information,
117118
socialInsuranceNumber: parsedDataResult.data.socialInsuranceNumber,
118-
},
119+
} as ChildInformationState,
119120
};
120121
}),
121122
},

frontend/app/routes/protected/application/spokes/parent-guardian.tsx

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import type { Route } from './+types/parent-guardian';
88

99
import { TYPES } from '~/.server/constants';
1010
import { getProtectedApplicationState, getSingleChildState, saveProtectedApplicationState, validateApplicationFlow } from '~/.server/routes/helpers/protected-application-route-helpers';
11+
import type { ChildInformationState } from '~/.server/routes/helpers/protected-application-route-helpers';
1112
import { getFixedT } from '~/.server/utils/locale.utils';
1213
import { transformFlattenedError } from '~/.server/utils/zod.utils';
1314
import { ButtonLink } from '~/components/buttons';
@@ -50,7 +51,7 @@ export async function loader({ context: { appContainer, session }, params, reque
5051

5152
const meta = { title: t('gcweb:meta.title.template', { title: t('protected-application-spokes:children.parent-guardian.page-title') }) };
5253

53-
return { meta, defaultState: childState.information, childName, isNew: childState.isNew, applicationFlow: `${state.context}-${state.typeOfApplication}` as const };
54+
return { meta, defaultState: childState.information, childName, applicationFlow: `${state.context}-${state.typeOfApplication}` as const };
5455
}
5556

5657
export async function action({ context: { appContainer, session }, params, request }: Route.ActionArgs) {
@@ -86,10 +87,10 @@ export async function action({ context: { appContainer, session }, params, reque
8687
if (child.id !== childState.id) return child;
8788
return {
8889
...child,
89-
childInformation: {
90+
information: {
9091
...child.information,
9192
isParent: parsedDataResult.data.isParent,
92-
},
93+
} as ChildInformationState,
9394
};
9495
}),
9596
},
@@ -104,7 +105,7 @@ export async function action({ context: { appContainer, session }, params, reque
104105

105106
export default function ParentGuardian({ loaderData, params }: Route.ComponentProps) {
106107
const { t } = useTranslation(handle.i18nNamespaces);
107-
const { defaultState, childName, isNew, applicationFlow } = loaderData;
108+
const { defaultState, childName, applicationFlow } = loaderData;
108109

109110
const fetcher = useFetcher<typeof action>();
110111
const { isSubmitting } = useFetcherSubmissionState(fetcher);
@@ -119,8 +120,8 @@ export default function ParentGuardian({ loaderData, params }: Route.ComponentPr
119120
name="isParent"
120121
legend={t('protected-application-spokes:children.parent-guardian.parent-legend', { childName })}
121122
options={[
122-
{ value: YES_NO_OPTION.yes, children: t('protected-application-spokes:children.parent-guardian.radio-options.yes'), defaultChecked: defaultState?.isParent === true, readOnly: !isNew, tabIndex: isNew ? 0 : -1 },
123-
{ value: YES_NO_OPTION.no, children: t('protected-application-spokes:children.parent-guardian.radio-options.no'), defaultChecked: defaultState?.isParent === false, readOnly: !isNew, tabIndex: isNew ? 0 : -1 },
123+
{ value: YES_NO_OPTION.yes, children: t('protected-application-spokes:children.parent-guardian.radio-options.yes'), defaultChecked: defaultState?.isParent === true },
124+
{ value: YES_NO_OPTION.no, children: t('protected-application-spokes:children.parent-guardian.radio-options.no'), defaultChecked: defaultState?.isParent === false },
124125
]}
125126
errorMessage={errors?.isParent}
126127
required

frontend/app/routes/protected/application/spokes/renewal-selection.tsx

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import type { Route } from './+types/renewal-selection';
99

1010
import { TYPES } from '~/.server/constants';
1111
import { getProtectedApplicationState, getTypeOfApplicationFromRenewalSelectionClientIds, saveProtectedApplicationState, validateProtectedApplicationContext } from '~/.server/routes/helpers/protected-application-route-helpers';
12-
import type { ProtectedApplicationState } from '~/.server/routes/helpers/protected-application-route-helpers';
12+
import type { ChildInformationState, ProtectedApplicationState } from '~/.server/routes/helpers/protected-application-route-helpers';
1313
import { getFixedT } from '~/.server/utils/locale.utils';
1414
import { transformFlattenedError } from '~/.server/utils/zod.utils';
1515
import { ButtonLink } from '~/components/buttons';
@@ -127,14 +127,7 @@ function getChildren(state: ProtectedApplicationState, selectedClientIds: string
127127
firstName: child.information.firstName,
128128
lastName: child.information.lastName,
129129
dateOfBirth: child.information.dateOfBirth,
130-
hasSocialInsuranceNumber: !!child.information.socialInsuranceNumber,
131-
socialInsuranceNumber: child.information.socialInsuranceNumber,
132-
isParent: true,
133-
},
134-
dentalCoverage: {
135-
hasDentalCoverage: undefined,
136-
coverageDetails: undefined,
137-
},
130+
} as ChildInformationState,
138131
};
139132
});
140133
}

0 commit comments

Comments
 (0)