Merge pull request #85 from DEFRA/BAU-section-model-macro

BAU: create & reuse a generic summary macro

src/server/check-answers/controller.js

@@ -3,6 +3,7 @@ import { OriginSection } from '../common/model/section/origin/origin.js'
 import { LicenceSection } from '../common/model/section/licence/licence.js'
 import { ConfirmationAnswer } from '../common/model/answer/confirmation/confirmation.js'
 import { ApplicationModel } from '../common/model/application/application.js'
+import { sectionToSummary } from '../common/templates/macros/create-summary.js'
 
 export const pageTitle = 'Check your answers before sending your application'
 const heading = pageTitle
@@ -12,6 +13,8 @@ const heading = pageTitle
  * @import {ConfirmationPayload} from '../common/model/answer/confirmation/confirmation.js'
  */
 
+const checkAnswersUrlPath = '/submit/check-answers'
+
 /**
  * @satisfies {Partial<ServerRoute>}
  */
@@ -37,7 +40,8 @@ export const checkAnswersGetController = {
       nextPage: req.query.redirect_uri,
       heading,
       pageTitle,
-      ...tasks
+      origin: sectionToSummary(tasks.origin, checkAnswersUrlPath),
+      licence: sectionToSummary(tasks.licence, checkAnswersUrlPath)
     })
   }
 }
@@ -64,7 +68,8 @@ export const checkAnswersPostController = {
         confirmation,
         errorMessages: ConfirmationAnswer.errorMessages(errors),
         errorMessage: errors.confirmation,
-        ...tasks
+        origin: sectionToSummary(tasks.origin, checkAnswersUrlPath),
+        licence: sectionToSummary(tasks.licence, checkAnswersUrlPath)
       })
     }
 

src/server/check-answers/index.njk

@@ -1,82 +1,16 @@
-{% from "govuk/components/summary-list/macro.njk" import govukSummaryList %}
 {% from "govuk/components/checkboxes/macro.njk" import govukCheckboxes %}
 {% extends 'layouts/questions.njk' %}
-
-{% macro section(rows) %}
-  {% set enrichedRows = [] %}
-  {% for row in rows %}
-    {%
-      set rows = (enrichedRows, enrichedRows.push({
-        key: {
-          text: row.key,
-          classes: "govuk-!-width-one-half govuk-!-font-weight-regular"
-        },
-        value: {
-          html: row.value
-        },
-        actions: {
-          items: [
-            {
-              href: row.url,
-              text: "Change",
-              visuallyHiddenText: question,
-              attributes: row.attributes
-            }
-          ]
-        }
-      }))
-    %}
-  {% endfor %}
-
-  {{
-    govukSummaryList({
-      rows: enrichedRows
-    })
-  }}
-{% endmacro %}
+{% from "macros/create-summary.njk" import createSummary %}
 
 {% block beforequestion %}
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds">
       <div class="govuk-body" data-testid="app-page-body">
         <div class="govuk-!-margin-top-0 govuk-!-margin-bottom-8">
           <h2 class="govuk-heading-m">Movement origin</h2>
-          {{
-            section([{
-              key: "Are you moving the cattle on or off your farm or premises?",
-              value: origin.onOffFarm.html,
-              url: "/origin/to-or-from-own-premises?redirect_uri=/submit/check-answers",
-              attributes: {
-                'data-testid': 'on-off-change-link'
-              }
-            }, {
-              key: "What is the County Parish Holding (CPH) number of your farm where the animals are moving off?",
-              value: origin.cphNumber.html,
-              url: "/origin/cph-number?redirect_uri=/submit/check-answers",
-              attributes: {
-                'data-testid': 'cph-change-link'
-              }
-            }, {
-              key: "What is the address of your farm or premises where the animals are moving off?",
-              value: origin.address.html,
-              url: "/origin/address?redirect_uri=/submit/check-answers",
-              attributes: {
-                'data-testid': 'address-change-link'
-              }
-            }])
-          }}
-
+          {{ createSummary(origin) }}
           <h2 class="govuk-heading-m">Receiving the licence</h2>
-          {{
-            section([{
-              key: "What email address would you like the licence sent to?",
-              value: licence.emailAddress.html,
-              url: "/receiving-the-licence/licence-enter-email-address?redirect_uri=/submit/check-answers",
-              attributes: {
-                'data-testid': 'email-change-link'
-              }
-            }])
-          }}
+          {{ createSummary(licence) }}
         </div>
       </div>
     </div>

src/server/common/controller/summary-page-controller/SummaryPageController.js

@@ -1,6 +1,8 @@
 /** @import SummaryPage from '../../model/page/summary-page/SummaryPageModel.js' */
 /** @import { Server, ServerRegisterPluginObject } from '@hapi/hapi' */
 
+import { sectionToSummary } from '../../templates/macros/create-summary.js'
+
 export class SummaryPageController {
   /** @type {string} */
   indexView = 'common/controller/summary-page-controller/index.njk'
@@ -57,20 +59,13 @@ export class SummaryPageController {
       )
     }
 
-    const items = section.questionPageAnswers.map(({ page, answer }) => ({
-      key: page.question,
-      value: answer.html,
-      url: `${page.urlPath}?redirect_uri=/${this.page.urlKey ?? this.page.sectionKey}/check-answers`,
-      visuallyHiddenKey: page.question,
-      attributes: {
-        'data-testid': `${page.questionKey}-change-link`
-      }
-    }))
-
     return res.view(this.indexView, {
       pageTitle: this.page.pageTitle,
       heading: this.page.heading,
-      originSummary: items
+      summary: sectionToSummary(
+        section,
+        `/${this.page.urlKey ?? this.page.sectionKey}/check-answers`
+      )
     })
   }
 

src/server/common/controller/summary-page-controller/index.njk

@@ -1,41 +1,6 @@
-{% from "govuk/components/back-link/macro.njk" import govukBackLink %}
-{% from "govuk/components/summary-list/macro.njk" import govukSummaryList %}
 {% extends 'layouts/questions.njk' %}
-
-{% macro createSummary(rows) %}
-  {% set summaryRows = [] %}
-  {% for row in originSummary %}
-    {%
-      set rows = (summaryRows, summaryRows.push({
-        key: {
-          text: row.key,
-          classes: "govuk-!-width-one-half govuk-!-font-weight-regular"
-        },
-        value: {
-          html: row.value
-        },
-        actions: {
-          items: [
-            {
-              href: row.url,
-              text: "Change",
-              visuallyHiddenText: row.visuallyHiddenKey,
-              attributes: row.attributes
-            }
-          ]
-        }
-      }))
-    %}
-  {% endfor %}
-
-  {{
-    govukSummaryList({
-      classes: "govuk-!-margin-bottom-9",
-      rows: summaryRows
-    })
-  }}
-{% endmacro %}
+{% from "macros/create-summary.njk" import createSummary %}
 
 {% block questions %}
-  {{ createSummary(originSummary) }}
+  {{ createSummary(summary) }}
 {% endblock %}

src/server/common/templates/macros/create-summary.js

@@ -0,0 +1,14 @@
+/** @import { SectionModel } from '../../model/section/section-model/section-model.js' */
+
+/** @param {SectionModel} section */
+export const sectionToSummary = (section, redirectUri) => {
+  return section.questionPageAnswers.map(({ page, answer }) => ({
+    key: page.question,
+    value: answer.html,
+    url: `${page.urlPath}?redirect_uri=${redirectUri}`,
+    visuallyHiddenKey: page.question,
+    attributes: {
+      'data-testid': `${page.questionKey}-change-link`
+    }
+  }))
+}

src/server/common/templates/macros/create-summary.njk

@@ -0,0 +1,36 @@
+{% from "govuk/components/back-link/macro.njk" import govukBackLink %}
+{% from "govuk/components/summary-list/macro.njk" import govukSummaryList %}
+
+{% macro createSummary(rows) %}
+  {% set summaryRows = [] %}
+  {% for row in rows %}
+    {%
+      set rows = (summaryRows, summaryRows.push({
+        key: {
+          text: row.key,
+          classes: "govuk-!-width-one-half govuk-!-font-weight-regular"
+        },
+        value: {
+          html: row.value
+        },
+        actions: {
+          items: [
+            {
+              href: row.url,
+              text: "Change",
+              visuallyHiddenText: row.visuallyHiddenKey,
+              attributes: row.attributes
+            }
+          ]
+        }
+      }))
+    %}
+  {% endfor %}
+
+  {{
+    govukSummaryList({
+      classes: "govuk-!-margin-bottom-9",
+      rows: summaryRows
+    })
+  }}
+{% endmacro %}

user-journey-tests/page-objects/finalAnswersPage.js

@@ -45,27 +45,27 @@ class FinalAnswersPage extends Page {
   }
 
   get onOffFarmChange() {
-    return $('[data-testid="on-off-change-link"]')
+    return $('[data-testid="onOffFarm-change-link"]')
   }
 
   get parishHoldingChange() {
-    return $('[data-testid="cph-change-link"]')
+    return $('[data-testid="cphNumber-change-link"]')
   }
 
   get addressChange() {
     return $('[data-testid="address-change-link"]')
   }
 
   get movementDestinationChange() {
-    return $('[data-testid="destination-change-link"]')
+    return $('[data-testid="destinationType-change-link"]')
   }
 
   get receivingMethodChange() {
     return $('[data-testid="licence-choice-change-link"]')
   }
 
   get emailChange() {
-    return $('[data-testid="email-change-link"]')
+    return $('[data-testid="emailAddress-change-link"]')
   }
 
   get confirmStatementsCheckbox() {