Skip to content

Commit e3e2dad

Browse files
alexnuttallalexnuttall
authored
CCM-9068: submit letter content update (#489)
1 parent 4f6857f commit e3e2dad

File tree

13 files changed

+280
-29
lines changed

13 files changed

+280
-29
lines changed

‎frontend/jest.setup.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,3 +33,4 @@ createMocks();
3333

3434
// set feature flag
3535
process.env.NEXT_PUBLIC_ENABLE_LETTERS = 'true';
36+
process.env.NEXT_PUBLIC_ENABLE_PROOFING = 'true';

‎frontend/src/__tests__/components/forms/SubmitTemplate/SubmitLetterTemplate.test.tsx‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,16 @@ jest.mock('@forms/SubmitTemplate/server-action', () => ({
1818
submitTemplate: '/action',
1919
}));
2020

21+
const OLD_ENV = { ...process.env };
22+
23+
beforeEach(() => {
24+
process.env.NEXT_PUBLIC_ENABLE_PROOFING = 'true';
25+
});
26+
27+
afterAll(() => {
28+
process.env = OLD_ENV;
29+
});
30+
2131
describe('SubmitLetterTemplate component', () => {
2232
it('should render', () => {
2333
const container = render(
@@ -29,4 +39,17 @@ describe('SubmitLetterTemplate component', () => {
2939

3040
expect(container.asFragment()).toMatchSnapshot();
3141
});
42+
43+
it('should render with proofing flag disabled', () => {
44+
process.env.NEXT_PUBLIC_ENABLE_PROOFING = 'false';
45+
46+
const container = render(
47+
<SubmitLetterTemplate
48+
templateId='template-id'
49+
templateName='template-name'
50+
/>
51+
);
52+
53+
expect(container.asFragment()).toMatchSnapshot();
54+
});
3255
});

‎frontend/src/__tests__/components/forms/SubmitTemplate/__snapshots__/SubmitLetterTemplate.test.tsx.snap‎

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

33
exports[`SubmitLetterTemplate component should render 1`] = `
4+
<DocumentFragment>
5+
<main
6+
class="nhsuk-main-wrapper"
7+
id="maincontent"
8+
role="main"
9+
>
10+
<div
11+
class="nhsuk-grid-row"
12+
>
13+
<div
14+
class="nhsuk-grid-column-two-thirds"
15+
>
16+
<h1>
17+
Approve and submit 'template-name'
18+
</h1>
19+
<p
20+
class="nhsuk-body-l"
21+
>
22+
When you submit a letter template, it will be used by NHS Notify to set up the messages you want to send.
23+
</p>
24+
<h2
25+
class="nhsuk-heading-s"
26+
>
27+
Before you submit this template
28+
</h2>
29+
<p>
30+
You should check that your template proof:
31+
</p>
32+
<ul>
33+
<li>
34+
appears exactly as you'd like a recipient to receive it
35+
</li>
36+
<li>
37+
uses personalisation in the way you expect
38+
</li>
39+
<li>
40+
displays QR codes correctly (if included)
41+
</li>
42+
</ul>
43+
<div
44+
class="nhsuk-warning-callout"
45+
>
46+
<h2
47+
class="nhsuk-warning-callout__label"
48+
>
49+
<span
50+
role="text"
51+
>
52+
<span
53+
class="nhsuk-u-visually-hidden"
54+
>
55+
Important:
56+
</span>
57+
Important
58+
</span>
59+
</h2>
60+
<p>
61+
If you need to change this template after you've submitted it:
62+
</p>
63+
<ul>
64+
<li>
65+
go back and upload a new letter template
66+
</li>
67+
<li>
68+
tell your onboarding manager which template you want to use
69+
</li>
70+
</ul>
71+
</div>
72+
<form
73+
action="/action"
74+
>
75+
<input
76+
name="form-id"
77+
readonly=""
78+
type="hidden"
79+
value="submit-template-form"
80+
/>
81+
<input
82+
name="csrf_token"
83+
readonly=""
84+
type="hidden"
85+
value="no_token"
86+
/>
87+
<input
88+
name="templateId"
89+
readonly=""
90+
type="hidden"
91+
value="template-id"
92+
/>
93+
<a
94+
aria-disabled="false"
95+
class="nhsuk-button nhsuk-button--secondary nhsuk-u-margin-right-3"
96+
draggable="false"
97+
href="/templates/preview-letter-template/template-id"
98+
id="go-back-button"
99+
role="button"
100+
>
101+
Go back
102+
</a>
103+
<button
104+
aria-disabled="false"
105+
class="nhsuk-button"
106+
id="submit-template-button"
107+
type="submit"
108+
>
109+
Approve and submit
110+
</button>
111+
</form>
112+
</div>
113+
</div>
114+
</main>
115+
</DocumentFragment>
116+
`;
117+
118+
exports[`SubmitLetterTemplate component should render with proofing flag disabled 1`] = `
4119
<DocumentFragment>
5120
<main
6121
class="nhsuk-main-wrapper"

‎frontend/src/components/forms/SubmitTemplate/SubmitLetterTemplate.tsx‎

Lines changed: 94 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,45 +9,127 @@ import { submitTemplate } from '@forms/SubmitTemplate/server-action';
99
import { NHSNotifyMain } from '@atoms/NHSNotifyMain/NHSNotifyMain';
1010
import { NHSNotifyButton } from '@atoms/NHSNotifyButton/NHSNotifyButton';
1111

12+
export const SubmitLetterTemplateProofingDisabled: FC<{
13+
templateName: string;
14+
templateId: string;
15+
action: (payload: FormData) => void;
16+
}> = ({ templateName, templateId, action }) => {
17+
const {
18+
proofingFlagDisabled: {
19+
afterSubmissionHeading,
20+
afterSubmissionText,
21+
buttonText,
22+
goBackButtonText,
23+
goBackPath,
24+
pageHeading,
25+
submitChecklistHeading,
26+
submitChecklistIntroduction,
27+
submitChecklistItems,
28+
warningCalloutChecklistIntroduction,
29+
warningCalloutChecklistItems,
30+
warningCalloutLabel,
31+
},
32+
} = content.components.submitLetterTemplate;
33+
34+
return (
35+
<NHSNotifyMain>
36+
<div className='nhsuk-grid-row'>
37+
<div className='nhsuk-grid-column-two-thirds'>
38+
<h1>
39+
{pageHeading} {`'${templateName}'`}
40+
</h1>
41+
<h2 className='nhsuk-heading-s'>{submitChecklistHeading}</h2>
42+
<p>{submitChecklistIntroduction}</p>
43+
<ul>
44+
{submitChecklistItems.map((item) => (
45+
<li key={`submit-list-${item.slice(0, 5)}`}>{item}</li>
46+
))}
47+
</ul>
48+
<h2 className='nhsuk-heading-s'>{afterSubmissionHeading}</h2>
49+
{afterSubmissionText.map((item) => (
50+
<p key={`after-submission-paragraph-${item.slice(0, 5)}`}>{item}</p>
51+
))}
52+
<WarningCallout>
53+
<WarningCallout.Label headingLevel='h2'>
54+
{warningCalloutLabel}
55+
</WarningCallout.Label>
56+
<p>{warningCalloutChecklistIntroduction}</p>
57+
<ul>
58+
{warningCalloutChecklistItems.map((item) => (
59+
<li key={`warning-callout-list-${item.slice(0, 5)}`}>{item}</li>
60+
))}
61+
</ul>
62+
</WarningCallout>
63+
<NHSNotifyFormWrapper formId='submit-template-form' action={action}>
64+
<input
65+
type='hidden'
66+
name='templateId'
67+
value={templateId}
68+
readOnly
69+
/>
70+
<NHSNotifyButton
71+
secondary
72+
id='go-back-button'
73+
className='nhsuk-u-margin-right-3'
74+
href={`${getBasePath()}/${goBackPath}/${templateId}`}
75+
>
76+
{goBackButtonText}
77+
</NHSNotifyButton>
78+
<NHSNotifyButton id='submit-template-button'>
79+
{buttonText}
80+
</NHSNotifyButton>
81+
</NHSNotifyFormWrapper>
82+
</div>
83+
</div>
84+
</NHSNotifyMain>
85+
);
86+
};
87+
1288
export const SubmitLetterTemplate: FC<{
1389
templateName: string;
1490
templateId: string;
1591
}> = ({ templateName, templateId }) => {
1692
const {
93+
buttonText,
94+
goBackButtonText,
95+
goBackPath,
96+
intro,
1797
pageHeading,
18-
warningCalloutLabel,
19-
warningCalloutChecklistIntroduction,
20-
warningCalloutChecklistItems,
2198
submitChecklistHeading,
2299
submitChecklistIntroduction,
23100
submitChecklistItems,
24-
goBackButtonText,
25-
goBackPath,
26-
buttonText,
27-
afterSubmissionHeading,
28-
afterSubmissionText,
101+
warningCalloutChecklistIntroduction,
102+
warningCalloutChecklistItems,
103+
warningCalloutLabel,
29104
} = content.components.submitLetterTemplate;
30105

31106
const [_, action] = useActionState(submitTemplate, 'LETTER');
32107

108+
if (process.env.NEXT_PUBLIC_ENABLE_PROOFING !== 'true') {
109+
return (
110+
<SubmitLetterTemplateProofingDisabled
111+
templateName={templateName}
112+
templateId={templateId}
113+
action={action}
114+
/>
115+
);
116+
}
117+
33118
return (
34119
<NHSNotifyMain>
35120
<div className='nhsuk-grid-row'>
36121
<div className='nhsuk-grid-column-two-thirds'>
37122
<h1>
38123
{pageHeading} {`'${templateName}'`}
39124
</h1>
125+
<p className='nhsuk-body-l'>{intro}</p>
40126
<h2 className='nhsuk-heading-s'>{submitChecklistHeading}</h2>
41127
<p>{submitChecklistIntroduction}</p>
42128
<ul>
43129
{submitChecklistItems.map((item) => (
44130
<li key={`submit-list-${item.slice(0, 5)}`}>{item}</li>
45131
))}
46132
</ul>
47-
<h2 className='nhsuk-heading-s'>{afterSubmissionHeading}</h2>
48-
{afterSubmissionText.map((item) => (
49-
<p key={`after-submission-paragraph-${item.slice(0, 5)}`}>{item}</p>
50-
))}
51133
<WarningCallout>
52134
<WarningCallout.Label headingLevel='h2'>
53135
{warningCalloutLabel}

‎frontend/src/content/content.ts‎

Lines changed: 34 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -350,24 +350,47 @@ const submitTemplate = {
350350
};
351351

352352
const submitLetterTemplate = {
353-
...submitTemplate,
354-
pageHeading: 'Submit',
353+
proofingFlagDisabled: {
354+
goBackButtonText: submitTemplate.goBackButtonText,
355+
buttonText: submitTemplate.buttonText,
356+
submitChecklistItems: submitTemplate.submitChecklistItems,
357+
pageHeading: 'Submit',
358+
submitChecklistHeading: 'Before you submit this template',
359+
submitChecklistIntroduction: 'Check that the template you uploaded:',
360+
submitChecklistParagraphs: [],
361+
afterSubmissionHeading: 'After you submit this template',
362+
afterSubmissionText: [
363+
'Our service team will send you a proof of this letter template by email.',
364+
'This email will also tell you what you need to do next.',
365+
],
366+
goBackPath: 'preview-letter-template',
367+
warningCalloutLabel: 'Important',
368+
warningCalloutChecklistIntroduction:
369+
"If you need to change this template after you've submitted it:",
370+
warningCalloutChecklistItems: [
371+
'go back and upload a new letter template',
372+
'tell your onboarding manager which template you want to use',
373+
],
374+
},
375+
pageHeading: 'Approve and submit',
376+
intro:
377+
'When you submit a letter template, it will be used by NHS Notify to set up the messages you want to send.',
355378
submitChecklistHeading: 'Before you submit this template',
356-
submitChecklistIntroduction: 'Check that the template you uploaded:',
357-
submitChecklistParagraphs: [],
358-
afterSubmissionHeading: 'After you submit this template',
359-
afterSubmissionText: [
360-
'Our service team will send you a proof of this letter template by email.',
361-
'This email will also tell you what you need to do next.',
379+
submitChecklistIntroduction: 'You should check that your template proof:',
380+
submitChecklistItems: [
381+
`appears exactly as you'd like a recipient to receive it`,
382+
'uses personalisation in the way you expect',
383+
'displays QR codes correctly (if included)',
362384
],
363-
goBackPath: 'preview-letter-template',
364385
warningCalloutLabel: 'Important',
365-
warningCalloutChecklistIntroduction:
366-
"If you need to change this template after you've submitted it:",
386+
warningCalloutChecklistIntroduction: `If you need to change this template after you've submitted it:`,
367387
warningCalloutChecklistItems: [
368388
'go back and upload a new letter template',
369389
'tell your onboarding manager which template you want to use',
370390
],
391+
goBackPath: 'preview-letter-template',
392+
goBackButtonText: submitTemplate.goBackButtonText,
393+
buttonText: 'Approve and submit',
371394
};
372395

373396
const copyTemplate = {

‎infrastructure/terraform/components/app/amplify_app.tf‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ resource "aws_amplify_app" "main" {
3333
API_BASE_URL = module.backend_api.api_base_url
3434
CSRF_SECRET = aws_ssm_parameter.csrf_secret.value
3535
NEXT_PUBLIC_ENABLE_LETTERS = var.enable_letters
36+
NEXT_PUBLIC_ENABLE_PROOFING = var.enable_proofing
3637
NEXT_PUBLIC_PROMPT_SECONDS_BEFORE_LOGOUT = 120
3738
NEXT_PUBLIC_TIME_TILL_LOGOUT_SECONDS = 900
3839
NOTIFY_ENVIRONMENT = var.environment

‎scripts/config/sonar-scanner.properties‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ sonar.qualitygate.wait=true
55
sonar.sourceEncoding=UTF-8
66
sonar.sources=frontend/src/, lambdas/authorizer, lambdas/backend-api, utils/utils, data-migration/user-transfer
77
sonar.tests=tests/, frontend/src/__tests__, lambdas/authorizer/src/__tests__, lambdas/backend-api/src/__tests__, utils/utils/src/__tests__, data-migration/user-transfer/src/__tests__
8-
sonar.exclusions=frontend/src/__tests__/**/*, lambdas/*/src/__tests__/**/*, data-migration/user-transfer/src/__tests__/**/*, utils/utils/src/__tests__/**/*, **/*.dev.*
8+
sonar.exclusions=frontend/src/__tests__/**/*, lambdas/*/src/__tests__/**/*, data-migration/user-transfer/src/__tests__/**/*, utils/utils/src/__tests__/**/*, **/*.dev.*, frontend/src/components/forms/SubmitTemplate/SubmitLetterTemplate.tsx
99
sonar.terraform.provider.aws.version=5.54.1
1010
sonar.cpd.exclusions=**.test.*
1111
sonar.coverage.exclusions=tests/, frontend/src/__tests__, **/*.dev.*, lambdas/**/src/__tests__, utils/utils/src/__tests__, data-migration/user-transfer/src/__tests__, utils/utils/src/zod-validators.ts ,**/jest.config.ts,scripts/**/*

‎scripts/create-env-file.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,5 @@ const secret = process.env.CSRF_SECRET ?? randomBytes(16).toString('hex');
55

66
writeFileSync(
77
'./frontend/.env',
8-
[`CSRF_SECRET=${secret}`, 'NEXT_PUBLIC_ENABLE_LETTERS=true'].join('\n')
8+
[`CSRF_SECRET=${secret}`, 'NEXT_PUBLIC_ENABLE_LETTERS=true', 'NEXT_PUBLIC_ENABLE_PROOFING=true'].join('\n')
99
);

‎scripts/tests/accessibility.sh‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ set -euo pipefail
44

55
# feature flag
66
export NEXT_PUBLIC_ENABLE_LETTERS=true
7+
export NEXT_PUBLIC_ENABLE_PROOFING=true
78

89
export INCLUDE_AUTH_PAGES=true
910

0 commit comments

Comments
 (0)