EPP-45 Upload address proof page

apps/epp-new/index.js

@@ -202,7 +202,11 @@ module.exports = {
       }
     },
     '/upload-proof-address': {
-      fields: [],
+      behaviours: [
+        SaveDocument('new-renew-proof-address', 'file-upload'),
+        RemoveDocument('new-renew-proof-address')
+      ],
+      fields: ['file-upload'],
       next: '/contact-details',
       locals: {
         sectionNo: {

apps/epp-new/sections/summary-data-sections.js

@@ -137,6 +137,22 @@ module.exports = {
         step: '/home-address',
         field: 'new-renew-home-address-moveto-date',
         parse: date => date && dateFormatter.format(new Date(date))
+      },
+      {
+        step: '/upload-proof-address',
+        field: 'new-renew-proof-address',
+        parse: (documents, req) => {
+          if (
+            req.sessionModel
+              .get('steps')
+              .includes('/upload-proof-address') &&
+            documents?.length > 0
+          ) {
+            return documents.map(file => file?.name)?.join('\n\n');
+          }
+
+          return null;
+        }
       }
     ]
   },

apps/epp-new/translations/src/en/pages.json

@@ -77,8 +77,7 @@
     "upload-file": "Upload a file",
     "file-format": "Your file must be JPEG, PDF or PNG, and be 25MB or less",
     "no-file-uploaded": "No files uploaded",
-    "you-have-uploaded": "You have uploaded",
-    "files": "file(s)",
+    "files-uploaded": "Files uploaded",
     "uploading-document": "Uploading your document..."
   },
   "countersignatory-details": {
@@ -102,6 +101,26 @@
     "files-uploaded": "Files uploaded",
     "uploading-document": "Uploading your document..."
   },
+  "upload-proof-address": {
+    "header": "Upload proof of address",
+    "p1": "You need to scan and attach 2 documents as proof of your home address. The documents must be dated within the last 3 months and",
+    "p2": "The first document must be one of the following:",
+    "p3": "The second document must be one of the following:",
+    "p1-li1": "Mortgage statements",
+    "p1-li2": "bank or building society statement",
+    "p2-li1": "credit card statement",
+    "p2-li2": "rental agreement",
+    "p2-li3": "utilities bill (including energy, water, internet or phone bills)",
+    "p2-li4": "council tax bill",
+    "p2-li5": "benefit statement",
+    "link": "https://www.gov.uk/government/publications/explosives-precursors-licence-applications-countersignatory/explosives-precursors-and-poisons-licence-applications-how-to-get-documents-countersigned",
+    "link-text": "signed by your countersignatory (opens in a new tab)",
+    "upload-file": "Upload a file",
+    "file-format": "Your file must be JPEG, PDF or PNG, and be 25MB or less",
+    "no-file-uploaded": "No files uploaded",
+    "files-uploaded": "Files uploaded",
+    "uploading-document": "Uploading your document..."
+  },
   "confirm": {
     "header": "Check your answers",
     "title": "Check your answers – Apply for an explosives precursors and poisons licence",
@@ -226,6 +245,9 @@
       },
       "new-renew-eu-passport": {
         "label": "Passport attachment"
+      },
+      "new-renew-proof-address": {
+        "label": "Proof of address attachments"
       }
     },
     "complete": {

apps/epp-new/translations/src/en/validation.json

@@ -186,7 +186,8 @@
     "maxFileSize": "The selected file must be 25MB or smaller",
     "fileType": "The selected file must be a JPG, PDF or PNG",
     "maxNewRenewBritishPassport" : "You can only upload upto {{maxNewRenewBritishPassport}} files or less. Remove a file before uploading another",
-    "maxNewRenewEuPassport" : "You can only upload upto {{maxNewRenewEuPassport}} files or less. Remove a file before uploading another"
+    "maxNewRenewEuPassport" : "You can only upload upto {{maxNewRenewEuPassport}} files or less. Remove a file before uploading another",
+    "maxNewRenewProofAddress" : "You can only upload upto {{maxNewRenewProofAddress}} files or less. Remove a file before uploading another"
   },
   "new-renew-previous-home-address-line1": {
     "required": "Enter address line 1, typically the building and street",

apps/epp-new/views/upload-british-passport.html

@@ -35,7 +35,7 @@ <h2 class="govuk-heading-m">{{#t}}pages.upload-british-passport.no-file-uploaded
 {{/values.new-renew-british-passport}}
 
 {{#values.new-renew-british-passport.length}}
-<h2 class="govuk-heading-m">{{#t}}pages.upload-british-passport.you-have-uploaded{{/t}} {{values.new-renew-british-passport.length}} {{#t}}pages.upload-british-passport.files{{/t}}</h2>
+<h2 class="govuk-heading-m">{{#t}}pages.upload-british-passport.files-uploaded{{/t}}</h2>
 
 <div id="uploaded-documents" class="govuk-width-container">
     {{#values.new-renew-british-passport}}

apps/epp-new/views/upload-proof-address.html

@@ -0,0 +1,75 @@
+{{<partials-page}} {{$encoding}}enctype="multipart/form-data" name="file-upload-form" {{/encoding}}
+{{$page-content}}
+<p class="govuk-body">{{#t}}pages.upload-proof-address.p1{{/t}}
+    <a class="govuk-link" href="{{#t}}pages.upload-proof-address.link{{/t}}" target="_blank" rel="noreferrer noopener">
+        {{#t}}pages.upload-proof-address.link-text{{/t}}
+    </a>
+</p>
+
+<p class="govuk-body">{{#t}}pages.upload-proof-address.p2{{/t}}</p>
+
+<ul class="govuk-!-margin-top-2 govuk-!-margin-left-2">
+    <li>{{#t}}pages.upload-proof-address.p1-li1{{/t}}</li>
+    <li>{{#t}}pages.upload-proof-address.p1-li2{{/t}}</li>
+  </ul>
+
+<p class="govuk-body">{{#t}}pages.upload-proof-address.p3{{/t}}</p>
+
+<ul class="govuk-!-margin-top-2 govuk-!-margin-left-2">
+    <li>{{#t}}pages.upload-proof-address.p2-li1{{/t}}</li>
+    <li>{{#t}}pages.upload-proof-address.p2-li2{{/t}}</li>
+    <li>{{#t}}pages.upload-proof-address.p2-li3{{/t}}</li>
+    <li>{{#t}}pages.upload-proof-address.p2-li4{{/t}}</li>
+    <li>{{#t}}pages.upload-proof-address.p2-li5{{/t}}</li>
+</ul>
+
+<div class="govuk-form-group" id="hofFileUpload">
+    <label class="govuk-label" for="file-upload">
+        <h2>{{#t}}pages.upload-proof-address.upload-file{{/t}}</h2>
+        <span class="govuk-hint">{{#t}}pages.upload-proof-address.file-format{{/t}}</span>
+    </label>
+    <p id="file-upload-error-maxFileSize" class="govuk-error-message govuk-!-display-none">
+        <span id="validation-error" class="govuk-visually-hidden">{{#t}}journey.error{{/t}}:</span> {{#t}}validation.file-upload.maxFileSize{{/t}}
+    </p>
+    <p id="file-upload-error-fileType" class="govuk-error-message govuk-!-display-none">
+        <span id="validation-error" class="govuk-visually-hidden">{{#t}}journey.error{{/t}}:</span> {{#t}}validation.file-upload.fileType{{/t}}
+    </p>
+    <input class="govuk-file-upload" id="file-upload" name="file-upload" type="file" value="new-renew-proof-address">
+
+    <div id="upload-page-loading-spinner" class="spinner-container">
+        <div class="spinner-loader"></div>
+        <span class="spinner-message">{{#t}}pages.upload-proof-address.uploading-document{{/t}}</span>
+    </div>
+
+</div>
+
+{{^values.new-renew-proof-address}}
+<h2 class="govuk-heading-m">{{#t}}pages.upload-proof-address.no-file-uploaded{{/t}}</h2>
+{{/values.new-renew-proof-address}}
+
+{{#values.new-renew-proof-address.length}}
+<h2 class="govuk-heading-m">{{#t}}pages.upload-proof-address.files-uploaded{{/t}}</h2>
+
+<div id="uploaded-documents" class="govuk-width-container">
+    {{#values.new-renew-proof-address}}
+    <div class="govuk-grid-row">
+        <div class="govuk-grid-column-three-quarters">
+            {{name}}
+        </div>
+        <div class="govuk-grid-column-one-quarter">
+            <a href="?delete={{id}}" class="govuk-link">{{#t}}buttons.remove{{/t}}</a>
+        </div>
+    </div>
+    <div class="file-upload-hrline"></div>
+    {{/values.new-renew-proof-address}}
+</div>
+
+{{/values.new-renew-proof-address.length}}
+
+
+<button class="govuk-button" name="requireFileUpload" value="new-renew-proof-address">
+    {{#t}}buttons.continue{{/t}}
+</button>
+
+{{/page-content}}
+{{/partials-page}}

config.js

@@ -70,6 +70,11 @@ module.exports = {
         allowMultipleUploads: false,
         limit: 1,
         limitValidationError: 'maxNewRenewEuPassport'
+      },
+      'new-renew-proof-address': {
+        allowMultipleUploads: true,
+        limit: 2,
+        limitValidationError: 'maxNewRenewProofAddress'
       }
     }
   },