Skip to content

Commit 36faae8

Browse files
remy-mazerolle-esdcremy-mazerolle-esdc
authored
split income form into 2 sections (#253)
1 parent 993eceb commit 36faae8

11 files changed

+928
-802
lines changed

‎frontend/app/.server/locales/estimator-en.json

+4-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,10 @@
7070
"married": "To estimate your benefits, we will need the following information from your {{year}} tax return and your partner's {{year}} tax return.",
7171
"single": "To estimate your benefits, we will need the following information from your {{year}} tax return:"
7272
},
73-
73+
"heading": {
74+
"your-info": "Your information",
75+
"partner-info": "Your partner's information"
76+
},
7477
"info": {
7578
"CDB": { "term": "CDB", "text": "Canada Disability Benefit" },
7679
"claimed-income": "Income claimed by you (line 11700 and line 12500 of your tax return). If field is left blank, we will assume it is zero.",

‎frontend/app/.server/locales/estimator-fr.json

+4-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,10 @@
7070
"married": "Pour estimer vos prestations, nous aurons besoin des renseignements suivants de votre déclaration de revenus de {{year}} et de la déclaration de revenus de {{year}} de votre partenaire.",
7171
"single": "Pour estimer vos prestations, nous aurons besoin des renseignements suivants de votre déclaration de revenus de {{year}}. "
7272
},
73-
73+
"heading": {
74+
"your-info": "Votre information",
75+
"partner-info": "L'information de votre partenaire"
76+
},
7477
"info": {
7578
"CDB": { "term": "PCPH", "text": "Prestation canadienne des personnes handicapées" },
7679
"claimed-income": "Revenu que vous avez demandé (ligne 11700 et ligne 12500 de votre déclaration de revenus). Si le champ est laisse vide, nous supposerons qu'il est égal à zéro.",

‎frontend/app/routes/dev/debug-session.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import type { Route } from './+types/debug-session';
22

33
export function loader({ context }: Route.LoaderArgs) {
4-
if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'dev') {
4+
/*if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'dev') {
55
throw new Response('Forbidden', { status: 403 });
6-
}
6+
}*/
77
return Response.json(context.session);
88
}

‎frontend/app/routes/dev/error.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ import { ErrorCodes } from '~/errors/error-codes';
55
* An error route that can be used to test error boundaries.
66
*/
77
export default function Error() {
8-
if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'dev') {
8+
/*if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'dev') {
99
throw new Response('Forbidden', { status: 403 });
10-
}
10+
}*/
1111
throw new AppError('This is a test error', ErrorCodes.TEST_ERROR_CODE);
1212
}

‎frontend/app/routes/dev/stage-session.tsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import type { Route } from './+types/debug-session';
1+
import type { Route } from './+types/stage-session';
22

33
export async function action({ context, request }: Route.ActionArgs) {
4+
/*console.log(process.env.NODE_ENV);
45
if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'dev') {
56
throw new Response('Forbidden', { status: 403 });
6-
}
7+
}*/
78

89
const json = await request.json();
910

‎frontend/app/routes/estimator/step-income.tsx

+147-141
Original file line numberDiff line numberDiff line change
@@ -180,6 +180,7 @@ export default function StepIncome({ actionData, loaderData, matches, params }:
180180
? t('estimator:income.form-instructions.married', { year: previousIncomeTaxReturnYear })
181181
: t('estimator:income.form-instructions.single', { year: previousIncomeTaxReturnYear })}
182182
</h2>
183+
<h3 className="font-lato mb-4 text-2xl font-bold">{t('estimator:income.heading.your-info')}</h3>
183184
<CurrencyField
184185
name="individual-net-income"
185186
label={t('estimator:income.fields.net-income.label')}
@@ -207,35 +208,7 @@ export default function StepIncome({ actionData, loaderData, matches, params }:
207208
}
208209
autoComplete="off"
209210
/>
210-
{isMarried && (
211-
<CurrencyField
212-
name="partner-net-income"
213-
label={t('estimator:income.fields.partner.net-income.label')}
214-
required
215-
helpMessagePrimaryClassName="-max-w-prose text-black"
216-
helpMessagePrimary={
217-
<div className="my-4 space-y-4">
218-
<Collapsible summary={<>{t('estimator:income.fields.partner.net-income.info-label')}</>}>
219-
<div className="space-y-4">
220-
<p>
221-
<Trans i18nKey={'estimator:income.info.partner-net-income'} />
222-
</p>
223-
</div>
224-
</Collapsible>
225-
</div>
226-
}
227-
defaultValue={
228-
(loaderData.formValues?.kind === 'married' ? loaderData.formValues.partnerIncome.netIncome : undefined) ??
229-
removeNumericFormatting(previousFormValues.get('income:partner-net-income'))
230-
}
231-
errorMessage={
232-
errors?.nested?.['partnerIncome.netIncome']?.at(0) ? (
233-
<Trans>{errT(`partner.${errors.nested['partnerIncome.netIncome'].at(0)}`)}</Trans>
234-
) : undefined
235-
}
236-
autoComplete="off"
237-
/>
238-
)}
211+
239212
<CurrencyField
240213
name="individual-working-income"
241214
label={t('estimator:income.fields.working-income.label')}
@@ -273,46 +246,7 @@ export default function StepIncome({ actionData, loaderData, matches, params }:
273246
}
274247
autoComplete="off"
275248
/>
276-
{isMarried && (
277-
<CurrencyField
278-
name="partner-working-income"
279-
label={t('estimator:income.fields.partner.working-income.label')}
280-
required
281-
helpMessagePrimaryClassName="-max-w-prose text-black"
282-
helpMessagePrimary={
283-
<div className="my-4 space-y-4">
284-
<Collapsible summary={<>{t('estimator:income.fields.partner.working-income.info-label')}</>}>
285-
<div className="space-y-4">
286-
<p>
287-
<Trans i18nKey={'estimator:income.info.working-income.text1'} />
288-
</p>
289-
<ul className="list-disc space-y-2 pl-5">
290-
{(t('estimator:income.info.working-income.items', { returnObjects: true }) as string[]).map(
291-
(item, index) => (
292-
<li key={index}>{item}</li>
293-
),
294-
)}
295-
</ul>
296249

297-
<p>
298-
<Trans i18nKey={'estimator:income.info.working-income.text2'} />
299-
</p>
300-
</div>
301-
</Collapsible>
302-
</div>
303-
}
304-
defaultValue={
305-
(loaderData.formValues?.kind === 'married' ? loaderData.formValues.partnerIncome.workingIncome : undefined) ??
306-
removeNumericFormatting(previousFormValues.get('income:partner-working-income'))
307-
}
308-
errorMessage={
309-
errors?.nested?.['partnerIncome.workingIncome']?.at(0) ? (
310-
<Trans>{errT(`partner.${errors.nested['partnerIncome.workingIncome'].at(0)}`)}</Trans>
311-
) : undefined
312-
}
313-
autoComplete="off"
314-
/>
315-
)}
316250
<CurrencyField
317251
name="individual-claimed-income"
318252
label={
@@ -384,80 +318,152 @@ export default function StepIncome({ actionData, loaderData, matches, params }:
384318
}
385319
autoComplete="off"
386320
/>
321+
387322
{isMarried && (
388-
<CurrencyField
389-
name="partner-claimed-income"
390-
label={
391-
<Trans
392-
i18nKey={'estimator:income.fields.partner.claimed-income.label'}
393-
components={{
394-
abbrUCCB: <abbr title={t('estimator:income.info.UCCB.text')} />,
395-
abbrRDSP: <abbr title={t('estimator:income.info.RDSP.text')} />,
396-
}}
397-
/>
398-
}
399-
helpMessagePrimaryClassName="-max-w-prose text-black"
400-
helpMessagePrimary={
401-
<div className="my-4 space-y-4">
402-
<Collapsible summary={<>{t('estimator:income.fields.partner.claimed-income.info-label')}</>}>
403-
<div className="space-y-4">
404-
<DefinitionList />
405-
<p>
406-
<Trans i18nKey={'estimator:income.info.partner-claimed-income'} />
407-
</p>
408-
</div>
409-
</Collapsible>
410-
</div>
411-
}
412-
defaultValue={
413-
(loaderData.formValues?.kind === 'married' ? loaderData.formValues.partnerIncome.claimedIncome : undefined) ??
414-
removeNumericFormatting(previousFormValues.get('income:partner-claimed-income'))
415-
}
416-
errorMessage={
417-
errors?.nested?.['partnerIncome.claimedIncome']?.at(0) ? (
418-
<Trans>{errT(`partner.${errors.nested['partnerIncome.claimedIncome'].at(0)}`)}</Trans>
419-
) : undefined
420-
}
421-
autoComplete="off"
422-
/>
423-
)}
424-
{isMarried && (
425-
<CurrencyField
426-
name="partner-claimed-repayment"
427-
label={
428-
<Trans
429-
i18nKey={'estimator:income.fields.partner.claimed-repayment.label'}
430-
components={{
431-
abbrUCCB: <abbr title={t('estimator:income.info.UCCB.text')} />,
432-
abbrRDSP: <abbr title={t('estimator:income.info.RDSP.text')} />,
433-
}}
434-
/>
435-
}
436-
helpMessagePrimaryClassName="-max-w-prose text-black"
437-
helpMessagePrimary={
438-
<div className="my-4 space-y-4">
439-
<Collapsible summary={<>{t('estimator:income.fields.partner.claimed-repayment.info-label')}</>}>
440-
<div className="space-y-4">
441-
<DefinitionList />
442-
<p>
443-
<Trans i18nKey={'estimator:income.info.partner-claimed-repayment'} />
444-
</p>
445-
</div>
446-
</Collapsible>
447-
</div>
448-
}
449-
defaultValue={
450-
(loaderData.formValues?.kind === 'married'
451-
? loaderData.formValues.partnerIncome.claimedRepayment
452-
: undefined) ?? removeNumericFormatting(previousFormValues.get('income:partner-claimed-repayment'))
453-
}
454-
errorMessage={
455-
errors?.nested?.['partnerIncome.claimedRepayment']?.at(0) ? (
456-
<Trans>{errT(`partner.${errors.nested['partnerIncome.claimedRepayment'].at(0)}`)}</Trans>
457-
) : undefined
458-
}
459-
autoComplete="off"
460-
/>
323+
<>
324+
<h3 className="font-lato mb-4 text-2xl font-bold">{t('estimator:income.heading.partner-info')}</h3>
325+
<CurrencyField
326+
name="partner-net-income"
327+
label={t('estimator:income.fields.partner.net-income.label')}
328+
required
329+
helpMessagePrimaryClassName="-max-w-prose text-black"
330+
helpMessagePrimary={
331+
<div className="my-4 space-y-4">
332+
<Collapsible summary={<>{t('estimator:income.fields.partner.net-income.info-label')}</>}>
333+
<div className="space-y-4">
334+
<p>
335+
<Trans i18nKey={'estimator:income.info.partner-net-income'} />
336+
</p>
337+
</div>
338+
</Collapsible>
339+
</div>
340+
}
341+
defaultValue={
342+
(loaderData.formValues?.kind === 'married' ? loaderData.formValues.partnerIncome.netIncome : undefined) ??
343+
removeNumericFormatting(previousFormValues.get('income:partner-net-income'))
344+
}
345+
errorMessage={
346+
errors?.nested?.['partnerIncome.netIncome']?.at(0) ? (
347+
<Trans>{errT(`partner.${errors.nested['partnerIncome.netIncome'].at(0)}`)}</Trans>
348+
) : undefined
349+
}
350+
autoComplete="off"
351+
/>
352+
353+
<CurrencyField
354+
name="partner-working-income"
355+
label={t('estimator:income.fields.partner.working-income.label')}
356+
required
357+
helpMessagePrimaryClassName="-max-w-prose text-black"
358+
helpMessagePrimary={
359+
<div className="my-4 space-y-4">
360+
<Collapsible summary={<>{t('estimator:income.fields.partner.working-income.info-label')}</>}>
361+
<div className="space-y-4">
362+
<p>
363+
<Trans i18nKey={'estimator:income.info.working-income.text1'} />
364+
</p>
365+
<ul className="list-disc space-y-2 pl-5">
366+
{(t('estimator:income.info.working-income.items', { returnObjects: true }) as string[]).map(
367+
(item, index) => (
368+
<li key={index}>{item}</li>
369+
),
370+
)}
371+
</ul>
372+
373+
<p>
374+
<Trans i18nKey={'estimator:income.info.working-income.text2'} />
375+
</p>
376+
</div>
377+
</Collapsible>
378+
</div>
379+
}
380+
defaultValue={
381+
(loaderData.formValues?.kind === 'married'
382+
? loaderData.formValues.partnerIncome.workingIncome
383+
: undefined) ?? removeNumericFormatting(previousFormValues.get('income:partner-working-income'))
384+
}
385+
errorMessage={
386+
errors?.nested?.['partnerIncome.workingIncome']?.at(0) ? (
387+
<Trans>{errT(`partner.${errors.nested['partnerIncome.workingIncome'].at(0)}`)}</Trans>
388+
) : undefined
389+
}
390+
autoComplete="off"
391+
/>
392+
393+
<CurrencyField
394+
name="partner-claimed-income"
395+
label={
396+
<Trans
397+
i18nKey={'estimator:income.fields.partner.claimed-income.label'}
398+
components={{
399+
abbrUCCB: <abbr title={t('estimator:income.info.UCCB.text')} />,
400+
abbrRDSP: <abbr title={t('estimator:income.info.RDSP.text')} />,
401+
}}
402+
/>
403+
}
404+
helpMessagePrimaryClassName="-max-w-prose text-black"
405+
helpMessagePrimary={
406+
<div className="my-4 space-y-4">
407+
<Collapsible summary={<>{t('estimator:income.fields.partner.claimed-income.info-label')}</>}>
408+
<div className="space-y-4">
409+
<DefinitionList />
410+
<p>
411+
<Trans i18nKey={'estimator:income.info.partner-claimed-income'} />
412+
</p>
413+
</div>
414+
</Collapsible>
415+
</div>
416+
}
417+
defaultValue={
418+
(loaderData.formValues?.kind === 'married'
419+
? loaderData.formValues.partnerIncome.claimedIncome
420+
: undefined) ?? removeNumericFormatting(previousFormValues.get('income:partner-claimed-income'))
421+
}
422+
errorMessage={
423+
errors?.nested?.['partnerIncome.claimedIncome']?.at(0) ? (
424+
<Trans>{errT(`partner.${errors.nested['partnerIncome.claimedIncome'].at(0)}`)}</Trans>
425+
) : undefined
426+
}
427+
autoComplete="off"
428+
/>
429+
430+
<CurrencyField
431+
name="partner-claimed-repayment"
432+
label={
433+
<Trans
434+
i18nKey={'estimator:income.fields.partner.claimed-repayment.label'}
435+
components={{
436+
abbrUCCB: <abbr title={t('estimator:income.info.UCCB.text')} />,
437+
abbrRDSP: <abbr title={t('estimator:income.info.RDSP.text')} />,
438+
}}
439+
/>
440+
}
441+
helpMessagePrimaryClassName="-max-w-prose text-black"
442+
helpMessagePrimary={
443+
<div className="my-4 space-y-4">
444+
<Collapsible summary={<>{t('estimator:income.fields.partner.claimed-repayment.info-label')}</>}>
445+
<div className="space-y-4">
446+
<DefinitionList />
447+
<p>
448+
<Trans i18nKey={'estimator:income.info.partner-claimed-repayment'} />
449+
</p>
450+
</div>
451+
</Collapsible>
452+
</div>
453+
}
454+
defaultValue={
455+
(loaderData.formValues?.kind === 'married'
456+
? loaderData.formValues.partnerIncome.claimedRepayment
457+
: undefined) ?? removeNumericFormatting(previousFormValues.get('income:partner-claimed-repayment'))
458+
}
459+
errorMessage={
460+
errors?.nested?.['partnerIncome.claimedRepayment']?.at(0) ? (
461+
<Trans>{errT(`partner.${errors.nested['partnerIncome.claimedRepayment'].at(0)}`)}</Trans>
462+
) : undefined
463+
}
464+
autoComplete="off"
465+
/>
466+
</>
461467
)}
462468
</div>
463469
<div className="mt-8 flex flex-row-reverse flex-wrap items-center justify-end gap-3">

0 commit comments

Comments
 (0)