Skip to content

Commit 22adcf2

Browse files
authored
Merge pull request #311 from NHSDigital/feature/CCM-8580-choose-letter
CCM-8580: choose letter
2 parents bcf4bb9 + ca9154d commit 22adcf2

File tree

31 files changed

+450
-38
lines changed

31 files changed

+450
-38
lines changed

.github/workflows/stage-2-test.yaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ on:
3535
env:
3636
AWS_REGION: eu-west-2
3737
TERM: xterm-256color
38+
NEXT_PUBLIC_ENABLE_LETTERS: true
3839

3940
permissions:
4041
id-token: write # This is required for requesting the JWT

.github/workflows/stage-4-acceptance.yaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ on:
3434

3535
env:
3636
AWS_REGION: eu-west-2
37+
NEXT_PUBLIC_ENABLE_LETTERS: true
3738

3839
permissions:
3940
id-token: write # This is required for requesting the JWT

frontend/.env.template

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,4 @@
11
# Includes auth pages when building web frontend in production mode.
22
INCLUDE_AUTH_PAGES=''
3+
# Enables letters feature flag
4+
NEXT_PUBLIC_ENABLE_LETTERS=''

frontend/src/__tests__/app/choose-a-template-type/__snapshots__/page.test.tsx.snap

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,163 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3+
exports[`ChooseATemplateTypePage - LETTER option is hidden when feature flag is not enabled 1`] = `
4+
<DocumentFragment>
5+
<div
6+
class="nhsuk-back-link"
7+
>
8+
<a
9+
class="nhsuk-back-link__link"
10+
href="/templates/manage-templates"
11+
>
12+
<svg
13+
aria-hidden="true"
14+
class="nhsuk-icon nhsuk-icon__chevron-left"
15+
height="24"
16+
viewBox="0 0 24 24"
17+
width="24"
18+
xmlns="http://www.w3.org/2000/svg"
19+
>
20+
<path
21+
d="M8.5 12c0-.3.1-.5.3-.7l5-5c.4-.4 1-.4 1.4 0s.4 1 0 1.4L10.9 12l4.3 4.3c.4.4.4 1 0 1.4s-1 .4-1.4 0l-5-5c-.2-.2-.3-.4-.3-.7z"
22+
/>
23+
</svg>
24+
Back to all templates
25+
</a>
26+
</div>
27+
<main
28+
class="nhsuk-main-wrapper"
29+
id="maincontent"
30+
role="main"
31+
>
32+
<form
33+
action="/action"
34+
>
35+
<input
36+
name="form-id"
37+
readonly=""
38+
type="hidden"
39+
value="choose-a-template-type"
40+
/>
41+
<input
42+
name="csrf_token"
43+
readonly=""
44+
type="hidden"
45+
value="no_token"
46+
/>
47+
<div
48+
class="nhsuk-form-group"
49+
>
50+
<fieldset
51+
class="nhsuk-fieldset"
52+
>
53+
<legend
54+
class="nhsuk-fieldset__legend nhsuk-fieldset__legend--l"
55+
data-testid="templateType-form__legend"
56+
>
57+
<h1
58+
class="nhsuk-fieldset__heading"
59+
>
60+
Choose a template type to create
61+
</h1>
62+
</legend>
63+
<p>
64+
<a
65+
href="/features"
66+
rel="noopener noreferrer"
67+
target="_blank"
68+
>
69+
Learn more about message channels (opens in a new tab)
70+
</a>
71+
</p>
72+
<div
73+
class="nhsuk-form-group"
74+
>
75+
<div
76+
class="nhsuk-hint"
77+
id="templateType--hint"
78+
>
79+
Select one option
80+
</div>
81+
<div
82+
aria-describedby="templateType--hint"
83+
class="nhsuk-radios"
84+
id="templateType"
85+
>
86+
<div
87+
class="nhsuk-radios__item"
88+
>
89+
<input
90+
class="nhsuk-radios__input"
91+
data-testid="NHS_APP-radio"
92+
id="templateType-NHS_APP"
93+
name="templateType"
94+
type="radio"
95+
value="NHS_APP"
96+
/>
97+
<label
98+
class="nhsuk-label nhsuk-radios__label"
99+
for="templateType-NHS_APP"
100+
id="templateType-NHS_APP--label"
101+
>
102+
NHS App message
103+
</label>
104+
</div>
105+
<div
106+
class="nhsuk-radios__item"
107+
>
108+
<input
109+
class="nhsuk-radios__input"
110+
data-testid="EMAIL-radio"
111+
id="templateType-EMAIL"
112+
name="templateType"
113+
type="radio"
114+
value="EMAIL"
115+
/>
116+
<label
117+
class="nhsuk-label nhsuk-radios__label"
118+
for="templateType-EMAIL"
119+
id="templateType-EMAIL--label"
120+
>
121+
Email
122+
</label>
123+
</div>
124+
<div
125+
class="nhsuk-radios__item"
126+
>
127+
<input
128+
class="nhsuk-radios__input"
129+
data-testid="SMS-radio"
130+
id="templateType-SMS"
131+
name="templateType"
132+
type="radio"
133+
value="SMS"
134+
/>
135+
<label
136+
class="nhsuk-label nhsuk-radios__label"
137+
for="templateType-SMS"
138+
id="templateType-SMS--label"
139+
>
140+
Text message (SMS)
141+
</label>
142+
</div>
143+
</div>
144+
</div>
145+
</fieldset>
146+
</div>
147+
<button
148+
aria-disabled="false"
149+
class="nhsuk-button"
150+
data-testid="submit-button"
151+
id="choose-a-template-type-submit-button"
152+
type="submit"
153+
>
154+
Continue
155+
</button>
156+
</form>
157+
</main>
158+
</DocumentFragment>
159+
`;
160+
3161
exports[`ChooseATemplateTypePage 1`] = `
4162
<DocumentFragment>
5163
<div
@@ -140,6 +298,25 @@ exports[`ChooseATemplateTypePage 1`] = `
140298
Text message (SMS)
141299
</label>
142300
</div>
301+
<div
302+
class="nhsuk-radios__item"
303+
>
304+
<input
305+
class="nhsuk-radios__input"
306+
data-testid="LETTER-radio"
307+
id="templateType-LETTER"
308+
name="templateType"
309+
type="radio"
310+
value="LETTER"
311+
/>
312+
<label
313+
class="nhsuk-label nhsuk-radios__label"
314+
for="templateType-LETTER"
315+
id="templateType-LETTER--label"
316+
>
317+
Letter
318+
</label>
319+
</div>
143320
</div>
144321
</div>
145322
</fieldset>

frontend/src/__tests__/app/choose-a-template-type/page.test.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,3 +35,13 @@ test('ChooseATemplateTypePage', async () => {
3535

3636
expect(container.asFragment()).toMatchSnapshot();
3737
});
38+
39+
test('ChooseATemplateTypePage - LETTER option is hidden when feature flag is not enabled', async () => {
40+
process.env.NEXT_PUBLIC_ENABLE_LETTERS = 'false';
41+
42+
const page = await ChooseATemplateTypePage();
43+
44+
const container = render(page);
45+
46+
expect(container.asFragment()).toMatchSnapshot();
47+
});

frontend/src/__tests__/app/copy-template/page.test.tsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -21,18 +21,18 @@ const getTemplateMock = jest.mocked(getTemplate);
2121
describe('CopyTemplatePage', () => {
2222
beforeEach(jest.resetAllMocks);
2323

24-
it('should load page', async () => {
25-
const template: TemplateDTO = {
26-
id: 'template-id',
27-
templateType: TemplateType.EMAIL,
28-
templateStatus: TemplateStatus.NOT_YET_SUBMITTED,
29-
name: 'template-name',
30-
subject: 'template-subject-line',
31-
message: 'template-message',
32-
createdAt: '2025-01-13T10:19:25.579Z',
33-
updatedAt: '2025-01-13T10:19:25.579Z',
34-
};
24+
const template: TemplateDTO = {
25+
id: 'template-id',
26+
templateType: TemplateType.EMAIL,
27+
templateStatus: TemplateStatus.NOT_YET_SUBMITTED,
28+
name: 'template-name',
29+
subject: 'template-subject-line',
30+
message: 'template-message',
31+
createdAt: '2025-01-13T10:19:25.579Z',
32+
updatedAt: '2025-01-13T10:19:25.579Z',
33+
};
3534

35+
it('should load page', async () => {
3636
getTemplateMock.mockResolvedValueOnce(template);
3737

3838
const page = await CopyTemplatePage({
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`CreateLetterTemplatePage should render CreateLetterTemplatePage 1`] = `
4+
<NHSNotifyMain>
5+
<h1
6+
className="nhsuk-heading-xl"
7+
data-testid="page-heading"
8+
>
9+
Create letter template
10+
</h1>
11+
<p
12+
id="placeholder"
13+
>
14+
🚧 Placeholder 🚧
15+
</p>
16+
</NHSNotifyMain>
17+
`;
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/**
2+
* @jest-environment node
3+
*/
4+
import CreateLetterTemplatePage from '@app/create-letter-template/page';
5+
6+
describe('CreateLetterTemplatePage', () => {
7+
beforeEach(jest.resetAllMocks);
8+
9+
it('should render CreateLetterTemplatePage', async () => {
10+
const page = await CreateLetterTemplatePage();
11+
12+
expect(page).toMatchSnapshot();
13+
});
14+
15+
it('returns 404 when letters feature flag is not enabled', async () => {
16+
process.env.NEXT_PUBLIC_ENABLE_LETTERS = 'false';
17+
18+
await expect(CreateLetterTemplatePage()).rejects.toThrow(
19+
'NEXT_HTTP_ERROR_FALLBACK;404'
20+
);
21+
});
22+
});

frontend/src/__tests__/components/forms/ChooseTemplate/ChooseTemplate.test.tsx

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,10 @@
33
import { useActionState } from 'react';
44
import { render, screen, fireEvent } from '@testing-library/react';
55
import { ChooseTemplate } from '@forms/ChooseTemplate/ChooseTemplate';
6-
import { TemplateFormState } from 'nhs-notify-web-template-management-utils';
6+
import {
7+
TemplateFormState,
8+
TemplateType,
9+
} from 'nhs-notify-web-template-management-utils';
710

811
jest.mock('@utils/amplify-utils');
912

@@ -28,7 +31,9 @@ jest.mock('react', () => {
2831

2932
describe('Choose template page', () => {
3033
it('selects one radio button at a time', () => {
31-
const container = render(<ChooseTemplate />);
34+
const container = render(
35+
<ChooseTemplate templateTypes={Object.values(TemplateType)} />
36+
);
3237
expect(container.asFragment()).toMatchSnapshot();
3338

3439
const radioButtons = [
@@ -74,7 +79,9 @@ describe('Choose template page', () => {
7479

7580
jest.mocked(useActionState).mockImplementation(mockUseActionState);
7681

77-
const container = render(<ChooseTemplate />);
82+
const container = render(
83+
<ChooseTemplate templateTypes={Object.values(TemplateType)} />
84+
);
7885
expect(container.asFragment()).toMatchSnapshot();
7986
});
8087
});

frontend/src/__tests__/components/forms/ChooseTemplate/__snapshots__/ChooseTemplate.test.tsx.snap

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -165,6 +165,25 @@ exports[`Choose template page renders error component 1`] = `
165165
Text message (SMS)
166166
</label>
167167
</div>
168+
<div
169+
class="nhsuk-radios__item"
170+
>
171+
<input
172+
class="nhsuk-radios__input"
173+
data-testid="LETTER-radio"
174+
id="templateType-LETTER"
175+
name="templateType"
176+
type="radio"
177+
value="LETTER"
178+
/>
179+
<label
180+
class="nhsuk-label nhsuk-radios__label"
181+
for="templateType-LETTER"
182+
id="templateType-LETTER--label"
183+
>
184+
Letter
185+
</label>
186+
</div>
168187
</div>
169188
</div>
170189
</fieldset>
@@ -323,6 +342,25 @@ exports[`Choose template page selects one radio button at a time 1`] = `
323342
Text message (SMS)
324343
</label>
325344
</div>
345+
<div
346+
class="nhsuk-radios__item"
347+
>
348+
<input
349+
class="nhsuk-radios__input"
350+
data-testid="LETTER-radio"
351+
id="templateType-LETTER"
352+
name="templateType"
353+
type="radio"
354+
value="LETTER"
355+
/>
356+
<label
357+
class="nhsuk-label nhsuk-radios__label"
358+
for="templateType-LETTER"
359+
id="templateType-LETTER--label"
360+
>
361+
Letter
362+
</label>
363+
</div>
326364
</div>
327365
</div>
328366
</fieldset>

0 commit comments

Comments
 (0)