Skip to content

Commit d53a790

Browse files
gregory-j-bakergregory-j-baker
authored
feat(frontend): incremental commit to add routes (#169)
1 parent 91ebf3b commit d53a790

15 files changed

+543
-0
lines changed

‎frontend/app/i18n-routes.ts

+104
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,110 @@ export const i18nRoutes = [
6464
file: 'routes/protected/person-case/privacy-statement.tsx',
6565
paths: { en: '/en/protected/person-case/privacy-statement', fr: '/fr/protege/person-case/privacy-statement' },
6666
},
67+
//
68+
// XState-driven in-person flow (poc)
69+
//
70+
{
71+
file: 'routes/protected/in-person/layout.tsx',
72+
children: [
73+
{
74+
id: 'IPF-0000',
75+
file: 'routes/protected/in-person/index.tsx',
76+
paths: {
77+
en: '/en/protected/in-person',
78+
fr: '/fr/protege/en-personne',
79+
},
80+
},
81+
{
82+
id: 'IPF-0001',
83+
file: 'routes/protected/in-person/privacy-statement.tsx',
84+
paths: {
85+
en: '/en/protected/in-person/privacy-statement',
86+
fr: '/fr/protege/en-personne/declaration-de-confidentialite',
87+
},
88+
},
89+
{
90+
id: 'IPF-0002',
91+
file: 'routes/protected/in-person/request-details.tsx',
92+
paths: {
93+
en: '/en/protected/in-person/request-details',
94+
fr: '/fr/protege/en-personne/details-de-la-demande',
95+
},
96+
},
97+
{
98+
id: 'IPF-0003',
99+
file: 'routes/protected/in-person/primary-docs.tsx',
100+
paths: {
101+
en: '/en/protected/in-person/primary-docsuments',
102+
fr: '/fr/protege/en-personne/documents-primaires',
103+
},
104+
},
105+
{
106+
id: 'IPF-0004',
107+
file: 'routes/protected/in-person/secondary-docs.tsx',
108+
paths: {
109+
en: '/en/protected/in-person/secondary-documents',
110+
fr: '/fr/protege/en-personne/documents-secondaires',
111+
},
112+
},
113+
{
114+
id: 'IPF-0005',
115+
file: 'routes/protected/in-person/name-info.tsx',
116+
paths: {
117+
en: '/en/protected/in-person/name-information',
118+
fr: '/fr/protege/en-personne/informations-nom',
119+
},
120+
},
121+
{
122+
id: 'IPF-0006',
123+
file: 'routes/protected/in-person/personal-info.tsx',
124+
paths: {
125+
en: '/en/protected/in-person/personal-information',
126+
fr: '/fr/protege/en-personne/informations-personnelles',
127+
},
128+
},
129+
{
130+
id: 'IPF-0007',
131+
file: 'routes/protected/in-person/birth-info.tsx',
132+
paths: {
133+
en: '/en/protected/in-person/birth-information',
134+
fr: '/fr/protege/en-personne/informations-naissance',
135+
},
136+
},
137+
{
138+
id: 'IPF-0008',
139+
file: 'routes/protected/in-person/parent-info.tsx',
140+
paths: {
141+
en: '/en/protected/in-person/parent-information',
142+
fr: '/fr/protege/en-personne/informations-parents',
143+
},
144+
},
145+
{
146+
id: 'IPF-0009',
147+
file: 'routes/protected/in-person/previous-sin-info.tsx',
148+
paths: {
149+
en: '/en/protected/in-person/previous-sin-information',
150+
fr: '/fr/protege/en-personne/informations-nas-precedent',
151+
},
152+
},
153+
{
154+
id: 'IPF-0010',
155+
file: 'routes/protected/in-person/contact-info.tsx',
156+
paths: {
157+
en: '/en/protected/in-person/contact-information',
158+
fr: '/fr/protege/en-personne/coordonnees',
159+
},
160+
},
161+
{
162+
id: 'IPF-0011',
163+
file: 'routes/protected/in-person/review.tsx',
164+
paths: {
165+
en: '/en/protected/in-person/review',
166+
fr: '/fr/protege/en-personne/revision',
167+
},
168+
},
169+
],
170+
},
67171
],
68172
},
69173
{

‎frontend/app/routes/protected/in-person/birth-info.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/birth-info';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function BirthInfo({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Birth info</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

‎frontend/app/routes/protected/in-person/contact-info.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/contact-info';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function ContectInfo({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Contact info</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

‎frontend/app/routes/protected/in-person/index.tsx

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import { Form, useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/index';
4+
5+
import { Button } from '~/components/button';
6+
import { PageTitle } from '~/components/page-title';
7+
import { create } from '~/routes/protected/in-person/state-machine';
8+
9+
export function action({ context, params, request }: Route.ActionArgs) {
10+
return {};
11+
}
12+
13+
export function loader({ context, params, request }: Route.LoaderArgs) {
14+
const tabId = new URL(request.url).searchParams.get('tid');
15+
if (!tabId) return null; // if no tab id, return early and wait for one
16+
17+
return {
18+
actor: create(context.session, tabId).start(),
19+
};
20+
}
21+
22+
export default function InPersonFlow({ actionData, loaderData, matches, params }: Route.ComponentProps) {
23+
const { tabId } = useOutletContext<{ tabId: string }>();
24+
25+
return (
26+
<div className="space-y-3">
27+
<PageTitle>
28+
<span>In-person flow</span>
29+
<span className="block text-sm">(tabid: {tabId})</span>
30+
</PageTitle>
31+
<Form method="post">
32+
<Button variant="primary" size="xl">
33+
Start
34+
</Button>
35+
</Form>
36+
</div>
37+
);
38+
}

‎frontend/app/routes/protected/in-person/layout.tsx

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Outlet } from 'react-router';
2+
3+
import type { Route } from './+types/layout';
4+
5+
import { useTabId } from '~/hooks/use-tab-id';
6+
7+
export default function Layout({ actionData, loaderData, matches, params }: Route.ComponentProps) {
8+
return <Outlet context={{ tabId: useTabId() }} />; // ensure we always have a tabId generated
9+
}

‎frontend/app/routes/protected/in-person/name-info.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/name-info';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function NameInfo({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Name info</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

‎frontend/app/routes/protected/in-person/parent-info.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/parent-info';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function ParentInfo({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Parent info</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

‎frontend/app/routes/protected/in-person/personal-info.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/personal-info';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function PersonalInfo({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Personal info</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

‎frontend/app/routes/protected/in-person/previous-sin-info.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/previous-sin-info';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function PreviousSinInfo({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Previous SIN info</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

‎frontend/app/routes/protected/in-person/primary-docs.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { useOutletContext } from 'react-router';
2+
3+
import type { Route } from './+types/primary-docs';
4+
5+
import { PageTitle } from '~/components/page-title';
6+
7+
export function action({ context, params, request }: Route.ActionArgs) {
8+
const tabId = new URL(request.url).searchParams.get('tid');
9+
if (!tabId) return null; // if no tab id, return early and wait for one
10+
11+
return {};
12+
}
13+
14+
export function loader({ context, params, request }: Route.LoaderArgs) {
15+
const tabId = new URL(request.url).searchParams.get('tid');
16+
if (!tabId) return null; // if no tab id, return early and wait for one
17+
18+
return {};
19+
}
20+
21+
export default function PrimaryDocs({ actionData, loaderData, matches, params }: Route.ComponentProps) {
22+
const { tabId } = useOutletContext<{ tabId: string }>();
23+
24+
return (
25+
<div className="space-y-3">
26+
<PageTitle>
27+
<span>Primary docs</span>
28+
<span className="block text-sm">(tabid: {tabId})</span>
29+
</PageTitle>
30+
</div>
31+
);
32+
}

0 commit comments

Comments
 (0)