Summary page working with repeatable pages. Section headers correct.

XGovFormBuilder · Jul 1, 2020 · 9973cbb · 9973cbb
1 parent 4de54bb
commit 9973cbb
Show file tree

Hide file tree

Showing 6 changed files with 4,938 additions and 533 deletions.
diff --git a/engine/src/model.js b/engine/src/model.js
@@ -86,13 +86,12 @@ class Model {
           sectionPages.forEach(sectionPage => {
             sectionSchema = sectionSchema.concat(sectionPage.stateSchema)
           })
-          if(isRepeatable) {
+          if (isRepeatable) {
             sectionSchema = joi.array().items(sectionSchema)
           }
           schema = schema.append({
             [section.name]: sectionSchema
           })
-
         } else {
           sectionPages.forEach(sectionPage => {
             schema = schema.concat(sectionPage.stateSchema)

diff --git a/engine/src/page.js b/engine/src/page.js
@@ -37,10 +37,13 @@ class Page {
     this[STATE_SCHEMA] = this.components.stateSchema
   }
 
-  getViewModel (formData, errors) {
+  getViewModel (formData, iteration, errors) {
     let showTitle = true
     let pageTitle = this.title
-    const sectionTitle = this.section && this.section.title
+    let sectionTitle = this.section && this.section.title
+    if (sectionTitle && iteration !== undefined) {
+      sectionTitle = `${sectionTitle} ${iteration}`
+    }
     const components = this.components.getViewModel(formData, errors)
 
     const formComponents = components.filter(c => c.isFormComponent)
@@ -57,7 +60,7 @@ class Page {
 
       if (this.section) {
         label.html =
-          `<span class="govuk-caption-xl">${this.section.title}</span> ${label.text}`
+          `<span class="govuk-caption-xl">${sectionTitle}</span> ${label.text}`
       }
 
       label.isPageHeading = true
@@ -89,35 +92,31 @@ class Page {
     }).filter(v => !!v)
   }
 
-    let defaultLink
-    const nextLink = this.next.find(link => {
-      const { page, condition } = link
-      const value = page.section ? state[page.section.name] : state
-      if (condition) {
-        return this.model.conditions[condition]
-          && this.model.conditions[condition].fn(state)
-      }
-      defaultLink = link
-      return false
-    })
-
-    if (this.repeatField) {
+  getNextPage (state, suppressRepetition = false) {
+    if (this.repeatField && !suppressRepetition) {
       const requiredCount = reach(state, this.repeatField)
-      const section = this.section
       const otherRepeatPagesInSection = this.model.pages.filter(page => page.section === this.section && page.repeatField)
-      const sectionState = state[this.section.name]
-      // if(sectionState.length)
-      if(Object.keys(sectionState[sectionState.length -1]).length === otherRepeatPagesInSection.length) { //iterated all pages at least once
+      const sectionState = state[this.section.name] || {}
+      if (Object.keys(sectionState[sectionState.length -1]).length === otherRepeatPagesInSection.length) { //iterated all pages at least once
         const lastIteration = sectionState[sectionState.length - 1]
         if (otherRepeatPagesInSection.length === this.#objLength(lastIteration)) { //this iteration is 'complete'
-          if (sectionState.length !== requiredCount) {
+          if (sectionState.length < requiredCount) {
             return this.findPageByPath(Object.keys(lastIteration)[0])
           }
         }
       }
-
     }
 
+    let defaultLink
+    const nextLink = this.next.find(link => {
+      const { condition } = link
+      if (condition) {
+        return this.model.conditions[condition]
+          && this.model.conditions[condition].fn(state)
+      }
+      defaultLink = link
+      return false
+    })
     return nextLink?.page ?? defaultLink?.page
   }
 
@@ -146,7 +145,7 @@ class Page {
 
   getFormDataFromState (state, atIndex) {
     const pageState = this.section ? state[this.section.name] : state
-    if(this.repeatField) {
+    if (this.repeatField) {
       let repeatedPageState = pageState?.[atIndex ?? (pageState.length - 1 || 0)] ?? {}
       let values = Object.values(repeatedPageState)
       return this.components.getFormDataFromState(values.length ? values.reduce((acc, page) => ({...acc, ...page})) : {})
@@ -211,9 +210,9 @@ class Page {
       const lang = this.langFromRequest(request)
       const state = await cacheService.getState(request)
       const progress = state.progress || []
-      const currentPath = `/${this.model.basePath}${this.path}`
-      const startPage = this.model.def.startPage
       const { num } = request.query
+      const currentPath = `/${this.model.basePath}${this.path}${num ? '?num=' + num : ''}`
+      const startPage = this.model.def.startPage
       const formData =  this.getFormDataFromState(state, num - 1)
 
       if (!this.model.options.previewMode && progress.length === 0 && this.path !== `${startPage}`) {
@@ -229,7 +228,8 @@ class Page {
           }
         })
       }
-      const viewModel = this.getViewModel(formData)
+
+      const viewModel = this.getViewModel(formData, num)
       viewModel.startPage = startPage.startsWith('http') ? h.redirect(startPage) : h.redirect(`/${this.model.basePath}${startPage}`)
       viewModel.currentPath = `${currentPath}${request.query.returnUrl ? '?returnUrl=' + request.query.returnUrl : ''}`
       viewModel.components = viewModel.components.filter(component => {
@@ -317,7 +317,7 @@ class Page {
       })
 
       if (formResult.errors) {
-        const viewModel = this.getViewModel(payload, formResult.errors)
+        const viewModel = this.getViewModel(payload, num, formResult.errors)
         viewModel.backLink = progress[progress.length - 2]
         return h.view(this.viewName, viewModel)
       }
@@ -326,7 +326,7 @@ class Page {
       const stateResult = this.validateState(newState)
 
       if (stateResult.errors) {
-        const viewModel = this.getViewModel(payload, stateResult.errors)
+        const viewModel = this.getViewModel(payload, num, stateResult.errors)
         viewModel.backLink = progress[progress.length - 2]
         return h.view(this.viewName, viewModel)
       }

diff --git a/runner/package.json b/runner/package.json
@@ -1,18 +1,18 @@
 {
   "name": "digital-form-builder",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "Digital forms runner",
   "main": "src/index.js",
   "scripts": {
-    "start": "NODE_ENV=development node dist/index.js",
+    "start": "NODE_ENV=production node dist/index.js",
     "dev": "yarn babel-build:dev & NODE_ENV=development node dist/index.js",
     "build:css": "bin/build-css",
-    "build": "npm run build:css && npm run babel-build",
+    "build": "yarn build:css && yarn babel-build",
     "lint": "standard",
     "unit-test": "lab -T node_modules/@xgovformbuilder/lab-babel -v -P 'test' test/cases -r console -o stdout -r html -o unit-test.html -I version -l",
     "unit-test:dev": "lab -v -P 'test' --inspect-brk",
-    "test": "NODE_ENV=test npm run lint && npm run unit-test",
-    "postinstall": "npm run build",
+    "test": "NODE_ENV=test yarn run lint && yarn run unit-test",
+    "postinstall": "yarn build",
     "a11y": "node test/audit/components && node lighthouse",
     "symlink-env": "./bin/symlink-config",
     "babel-build": "babel src -d dist --copy-files --minified -s inline",