@defra/forms-engine-plugin 4.22.0 → 5.0.0-alpha

package/src/server/plugins/engine/models/SummaryViewModel.ts

@@ -1,4 +1,8 @@
-import { SchemaVersion, type Section } from '@defra/forms-model'
+import {
+  SchemaVersion,
+  type ComponentDef,
+  type Section
+} from '@defra/forms-model'
 
 import { PaymentField } from '../components/PaymentField.js'
 import { type PaymentState } from '../components/PaymentField.types.js'
@@ -15,6 +19,7 @@ import {
   getError,
   getPageHref
 } from '../helpers.js'
+import { type Translator } from '../i18n/types.js'
 import {
   type Detail,
   type DetailItem,
@@ -56,22 +61,29 @@ export class SummaryViewModel {
   allowSaveAndExit = false
   paymentState?: PaymentState
   paymentDetails?: CheckAnswers
+  t: (key: string, opts?: Record<string, unknown>) => string
+  private readonly _translator!: Translator
   paymentRequired?: boolean
   paymentPreAuthorized?: boolean
 
   constructor(
     request: FormContextRequest,
     page: PageControllerClass,
-    context: FormContext
+    context: FormContext,
+    translator: Translator
   ) {
     const { model } = page
     const { basePath, def, sections } = model
     const { isForceAccess } = context
 
+    const { t } = translator
+    this.t = t
+    this._translator = translator
+
     this.page = page
     this.pageTitle = page.title
     if (def.schema === SchemaVersion.V2 && !page.title) {
-      this.pageTitle = 'Check your answers before sending your form'
+      this.pageTitle = t('pages.summary.title')
     }
 
     this.serviceUrl = `/${basePath}`
@@ -85,7 +97,7 @@ export class SummaryViewModel {
 
     // Format errors
     this.errors = result.error?.details.map(getError)
-    this.details = this.summaryDetails(request, sections)
+    this.details = this.summaryDetails(request, sections, translator)
 
     // Format check answers
     this.checkAnswers = this.details.map((detail): CheckAnswers => {
@@ -98,7 +110,7 @@ export class SummaryViewModel {
         if (!isForceAccess) {
           items.push({
             href: item.href,
-            text: 'Change',
+            text: t('pages.summary.change'),
             classes: 'govuk-link--no-visited-state',
             visuallyHiddenText: item.label
           })
@@ -110,7 +122,7 @@ export class SummaryViewModel {
           },
           value: {
             classes: 'app-prose-scope',
-            html: item.value || 'Not provided'
+            html: item.value || t('pages.summary.notProvided')
           },
           actions: {
             items
@@ -125,7 +137,11 @@ export class SummaryViewModel {
     })
   }
 
-  private summaryDetails(request: FormContextRequest, sections: Section[]) {
+  private summaryDetails(
+    request: FormContextRequest,
+    sections: Section[],
+    translator: Translator
+  ) {
     const { context, errors } = this
     const { relevantPages, state } = context
 
@@ -143,10 +159,15 @@ export class SummaryViewModel {
 
         if (page instanceof RepeatPageController) {
           items.push(
-            ItemRepeat(page, state, {
-              path: page.getSummaryPath(request),
-              errors
-            })
+            ItemRepeat(
+              page,
+              state,
+              {
+                path: page.getSummaryPath(request),
+                errors
+              },
+              translator
+            )
           )
         } else {
           for (const field of collection.fields) {
@@ -154,15 +175,20 @@ export class SummaryViewModel {
             if (field instanceof PaymentField) {
               continue
             }
-            items.push(ItemField(page, state, field, { path, errors }))
+            items.push(
+              ItemField(page, state, field, { path, errors }, translator)
+            )
           }
         }
       })
 
       if (items.length) {
+        const sectionTitle = section
+          ? translator.tSection(section, 'title') || section.title
+          : undefined
         details.push({
           name: section?.name,
-          title: section?.title,
+          title: sectionTitle,
           items
         })
       }
@@ -182,19 +208,22 @@ function ItemRepeat(
   options: {
     path: string
     errors?: FormSubmissionError[]
-  }
+  },
+  translator: Translator
 ): DetailItemRepeat {
   const { collection, repeat } = page
   const { name, title } = repeat.options
 
   const values = page.getListFromState(state)
-  const unit = values.length === 1 ? 'answer' : 'answers'
+  const count = values.length
+  const value =
+    count === 0 ? '' : translator.t('pages.repeater.pageTitle', { count })
 
   return {
     name,
     label: title,
     title,
-    value: values.length ? `You have added ${values.length} ${unit}` : '',
+    value,
     href: getPageHref(page, options.path, {
       returnUrl: getPageHref(page, page.getSummaryPath())
     }),
@@ -204,7 +233,7 @@ function ItemRepeat(
     // Repeater field detail items
     subItems: values.map((repeatState) =>
       collection.fields.map((field) =>
-        ItemField(page, repeatState, field, options)
+        ItemField(page, repeatState, field, options, translator)
       )
     )
   }
@@ -221,17 +250,31 @@ export function ItemField(
   options: {
     path: string
     errors?: FormSubmissionError[]
-  }
+  },
+  translator: Translator
 ): DetailItemField {
+  // FormComponent doesn't expose shortDescription/title as raw def properties,
+  // so build a lookup object with English values to let tComponent's GUID lookup fire.
+  const fieldDef = {
+    id: field.id,
+    type: field.type,
+    shortDescription: field.label,
+    title: field.title
+  } as unknown as ComponentDef
+  const rawLabel = translator.tComponent(fieldDef, 'shortDescription')
+  const translatedLabel = rawLabel !== '' ? rawLabel : field.label
+  const rawTitle = translator.tComponent(fieldDef, 'title')
+  const translatedTitle = rawTitle !== '' ? rawTitle : field.title
+  const optional =
+    field.options.required === false
+      ? ` ${translator.t('common.optional')}`
+      : ''
   return {
     name: field.name,
-    label: field.title,
-    title:
-      field.options.required === false
-        ? `${field.summaryLabel} (optional)`
-        : field.summaryLabel,
-    error: field.getFirstError(options.errors),
-    value: getAnswer(field, state),
+    label: translatedTitle,
+    title: `${translatedLabel}${optional}`,
+    error: field.getFirstError(translator, options.errors),
+    value: getAnswer(field, state, translator, { format: 'summary' }),
     href: getPageHref(page, options.path, {
       returnUrl: getPageHref(page, page.getSummaryPath())
     }),

package/src/server/plugins/engine/options.js

@@ -25,7 +25,8 @@ const pluginRegistrationOptionsSchema = Joi.object({
   baseUrl: Joi.string().uri().required(),
   saveAndExit: Joi.function().optional(),
   ordnanceSurveyApiKey: Joi.string().optional(),
-  ordnanceSurveyApiSecret: Joi.string().optional()
+  ordnanceSurveyApiSecret: Joi.string().optional(),
+  getLanguage: Joi.function().optional()
 })
 
 /**

package/src/server/plugins/engine/outputFormatters/adapter/v1.ts

@@ -49,6 +49,11 @@ export function format(
     meta.versionMetadata = versionMetadata
   }
 
+  const definitionLanguage = model.def.metadata?.language
+  if (typeof definitionLanguage === 'string') {
+    meta.language = definitionLanguage
+  }
+
   const main = Object.fromEntries(
     Object.entries(v2Main).map(([key, value]) => {
       if (value === undefined) {

package/src/server/plugins/engine/outputFormatters/human/v1.ts

@@ -30,6 +30,7 @@ export function format(
   formStatus: ReturnType<typeof checkFormStatus>,
   _formMetadata?: FormMetadata
 ) {
+  const translator = model.createTranslator()
   const { files } = submitResponse.result
 
   const formName = escapeMarkdown(model.name)
@@ -72,9 +73,7 @@ export function format(
       lines.push(`[${filename}](${designerUrl}/file-download/${fileId})\n`)
     } else {
       lines.push(
-        getAnswer(item.field, item.state, {
-          format: 'email'
-        })
+        getAnswer(item.field, item.state, translator, { format: 'email' })
       )
     }
 

package/src/server/plugins/engine/outputFormatters/machine/v1.ts

@@ -7,6 +7,7 @@ import { config } from '../../../../../config/index.js'
 import { getAnswer } from '../../components/helpers/components.js'
 import { FileUploadField } from '../../components/index.js'
 import { type checkFormStatus } from '../../helpers.js'
+import { type Translator } from '../../i18n/types.js'
 import { type FormModel } from '../../models/index.js'
 import {
   type DetailItem,
@@ -25,9 +26,10 @@ export function format(
   _formStatus: ReturnType<typeof checkFormStatus>,
   _formMetadata?: FormMetadata
 ) {
+  const translator = model.createTranslator()
   const now = new Date()
 
-  const categorisedData = categoriseData(items)
+  const categorisedData = categoriseData(items, translator)
 
   const data = {
     meta: {
@@ -68,7 +70,7 @@ export function format(
  *    }
  * }
  */
-function categoriseData(items: DetailItem[]) {
+function categoriseData(items: DetailItem[], translator: Translator) {
   const output: {
     main: Record<string, string>
     repeaters: Record<string, Record<string, string>[]>
@@ -77,11 +79,11 @@ function categoriseData(items: DetailItem[]) {
 
   items.forEach((item) => {
     if ('subItems' in item) {
-      output.repeaters[item.name] = extractRepeaters(item)
+      output.repeaters[item.name] = extractRepeaters(item, translator)
     } else if (isFileUploadFieldItem(item)) {
       output.files[item.name] = extractFileUploads(item)
     } else {
-      output.main[item.name] = getAnswer(item.field, item.state, {
+      output.main[item.name] = getAnswer(item.field, item.state, translator, {
         format: 'data'
       })
     }
@@ -95,7 +97,7 @@ function categoriseData(items: DetailItem[]) {
  * @param item - the repeater item
  * @returns the repeater item
  */
-function extractRepeaters(item: DetailItemRepeat) {
+function extractRepeaters(item: DetailItemRepeat, translator: Translator) {
   const repeaters: Record<string, string>[] = []
 
   item.subItems.forEach((inputRepeaterItem) => {
@@ -105,9 +107,8 @@ function extractRepeaters(item: DetailItemRepeat) {
       outputRepeaterItem[repeaterComponent.name] = getAnswer(
         repeaterComponent.field,
         repeaterComponent.state,
-        {
-          format: 'data'
-        }
+        translator,
+        { format: 'data' }
       )
     })
 

package/src/server/plugins/engine/pageControllers/FileUploadPageController.ts

@@ -14,6 +14,7 @@ import {
   getError,
   getExponentialBackoffDelay
 } from '../helpers.js'
+import { type Translator } from '../i18n/types.js'
 import { type FormModel } from '../models/index.js'
 import { QuestionPageController } from './QuestionPageController.js'
 import { getProxyUrlForLocalDevelopment } from './helpers/index.js'
@@ -187,10 +188,12 @@ export class FileUploadPageController extends QuestionPageController {
 
       const { filename } = fileToRemove.status.form.file
 
+      const { t } = this.getTranslator(request)
+
       return h.view(this.fileDeleteViewName, {
         ...viewModel,
         context,
-        backLink: this.getBackLink(request, context),
+        backLink: this.getBackLink(request, context, t),
         pageTitle: `Are you sure you want to remove this file?`,
         itemTitle: filename,
         confirmation: { text: 'You cannot recover removed files.' },
@@ -258,14 +261,15 @@ export class FileUploadPageController extends QuestionPageController {
 
   getViewModel(
     request: FormContextRequest,
-    context: FormContext
+    context: FormContext,
+    translator: Translator
   ): FeaturedFormPageViewModel {
     const { fileUpload } = this
     const { state } = context
 
     const upload = this.getUploadFromState(state)
 
-    const viewModel = super.getViewModel(request, context)
+    const viewModel = super.getViewModel(request, context, translator)
     const { components } = viewModel
 
     // Featured form component

package/src/server/plugins/engine/pageControllers/PageController.ts

@@ -15,9 +15,11 @@ import {
   getStartPath,
   normalisePath
 } from '../helpers.js'
+import { type Translator } from '../i18n/types.js'
 import { type FormModel } from '../models/index.js'
 import { type ExecutableCondition } from '../models/types.js'
 import {
+  type AnyFormRequest,
   type FormContext,
   type PageViewModelBase
 } from '../types.js'
@@ -28,6 +30,7 @@ import {
   type FormRequestRefs,
   type FormResponseToolkit
 } from '../../../routes/types.js'
+import { resolveLanguage } from '../../../utils/utils.js'
 
 export class PageController {
   /**
@@ -161,6 +164,10 @@ export class PageController {
     return ControllerPath.Status.valueOf()
   }
 
+  protected getTranslator(request: AnyFormRequest): Translator {
+    return this.model.createTranslator(resolveLanguage(request))
+  }
+
   makeGetRouteHandler(): (
     request: FormRequest,
     context: FormContext,
@@ -168,7 +175,11 @@ export class PageController {
   ) => ReturnType<Lifecycle.Method<FormRequestRefs>> {
     return (request, context, h) => {
       const { viewModel, viewName } = this
-      return h.view(viewName, viewModel)
+      const { t } = this.getTranslator(request)
+      return h.view(viewName, {
+        ...viewModel,
+        t
+      })
     }
   }
 

package/src/server/plugins/engine/pageControllers/QuestionPageController.ts

@@ -21,7 +21,6 @@ import {
 } from '../../../constants.js'
 import { ComponentCollection } from '../components/ComponentCollection.js'
 import { PaymentField } from '../components/PaymentField.js'
-import { optionalText } from '../components/constants.js'
 import { type BackLink } from '../components/types.js'
 import {
   checkFormStatus,
@@ -31,6 +30,7 @@ import {
   normalisePath,
   proceed
 } from '../helpers.js'
+import { type Translator } from '../i18n/types.js'
 import { type FormModel } from '../models/index.js'
 import { PageController } from './PageController.js'
 import { prefillStateFromQueryParameters } from './helpers/state.js'
@@ -118,18 +118,28 @@ export class QuestionPageController extends PageController {
    * Used for mapping form payloads and errors to govuk-frontend's template api, so a page can be rendered
    * @param request - the hapi request
    * @param context - the form context
+   * @param translator - optional per-request translator pair
    */
   getViewModel(
     request: FormContextRequest,
-    context: FormContext
+    context: FormContext,
+    translator: Translator
   ): FormPageViewModel {
     const { collection, viewModel } = this
-    const { query } = request
     const { payload, errors } = context
 
-    let { pageTitle, showTitle } = viewModel
+    const { t, tPage, tSection } = translator
+
+    let { showTitle, sectionTitle } = viewModel
 
-    const components = collection.getViewModel(payload, errors, query)
+    let pageTitle = this.pageDef.title ? tPage(this.pageDef, 'title') : ''
+
+    if (this.section) {
+      sectionTitle =
+        this.section.hideTitle !== true ? tSection(this.section, 'title') : ''
+    }
+
+    const components = collection.getViewModel({ payload, errors, translator })
     const formComponents = components.filter(
       ({ isFormComponent }) => isFormComponent
     )
@@ -161,13 +171,17 @@ export class QuestionPageController extends PageController {
           const isOptional =
             this.collection.fields.at(0)?.options.required === false
 
-          if (pageTitle) {
-            labelOrLegend.text = isOptional
-              ? `${pageTitle}${optionalText}`
-              : pageTitle
+          if (!pageTitle) {
+            pageTitle = labelOrLegend.text
           }
+          labelOrLegend.text = isOptional
+            ? `${pageTitle} ${t('common.optional')}`
+            : pageTitle
+        }
 
-          pageTitle = pageTitle || labelOrLegend.text
+        // Fallback if still no pageTitle set
+        if (!pageTitle) {
+          pageTitle = labelOrLegend.text
         }
       }
 
@@ -216,8 +230,10 @@ export class QuestionPageController extends PageController {
 
     return {
       ...viewModel,
-      backLink: this.getBackLink(request, context),
+      backLink: this.getBackLink(request, context, t),
       context,
+      pageTitle,
+      sectionTitle,
       showTitle,
       components,
       errors,
@@ -450,14 +466,17 @@ export class QuestionPageController extends PageController {
       const { collection, model, viewName } = this
       const { evaluationState } = context
 
+      const translator = this.getTranslator(request)
+      const { t } = translator
+
       // Copy any URL params into the form state (if not already done so)
       if (await prefillStateFromQueryParameters(request, this)) {
         // Forward to same page without query string
         return h.redirect(request.url.pathname)
       }
 
-      const viewModel = this.getViewModel(request, context)
-      viewModel.errors = collection.getViewErrors(viewModel.errors)
+      const viewModel = this.getViewModel(request, context, translator)
+      viewModel.errors = collection.getViewErrors(translator, viewModel.errors)
 
       const flashedError = request.yar.flash(COMPONENT_STATE_ERROR)
       const flashedErrors = !Array.isArray(flashedError) ? [flashedError] : []
@@ -484,7 +503,10 @@ export class QuestionPageController extends PageController {
       viewModel.hasMissingNotificationEmail =
         await this.hasMissingNotificationEmail(request, context)
 
-      return h.view(viewName, viewModel)
+      return h.view(viewName, {
+        ...viewModel,
+        t
+      })
     }
   }
 
@@ -515,7 +537,8 @@ export class QuestionPageController extends PageController {
    */
   protected getBackLink(
     request: FormContextRequest,
-    context: FormContext
+    context: FormContext,
+    t: (key: string, opts?: Record<string, unknown>) => string
   ): BackLink | undefined {
     const { pageDef } = this
     const { path, query } = request
@@ -529,8 +552,8 @@ export class QuestionPageController extends PageController {
       return {
         text:
           hasRepeater(pageDef) && itemId
-            ? 'Go back to add another'
-            : 'Go back to check answers',
+            ? t('pages.question.backToAddAnother')
+            : t('pages.question.backToCheckAnswers'),
         href: returnUrl
       }
     }
@@ -548,7 +571,7 @@ export class QuestionPageController extends PageController {
 
     // Default back link
     return {
-      text: 'Back',
+      text: t('common.back'),
       href: this.getHref(backPath)
     }
   }
@@ -563,6 +586,9 @@ export class QuestionPageController extends PageController {
       const { isForceAccess, state, evaluationState } = context
       const action = request.payload.action
 
+      const translator = this.getTranslator(request)
+      const { t } = translator
+
       if (action?.startsWith(FormAction.External)) {
         return await this.dispatchExternal(request, h, context)
       }
@@ -572,8 +598,11 @@ export class QuestionPageController extends PageController {
        * @todo Refactor to match POST REDIRECT GET pattern
        */
       if (context.errors || isForceAccess) {
-        const viewModel = this.getViewModel(request, context)
-        viewModel.errors = collection.getViewErrors(viewModel.errors)
+        const viewModel = this.getViewModel(request, context, translator)
+        viewModel.errors = collection.getViewErrors(
+          translator,
+          viewModel.errors
+        )
 
         // Filter our components based on their conditions using our evaluated state
         viewModel.components = this.filterConditionalComponents(
@@ -582,7 +611,10 @@ export class QuestionPageController extends PageController {
           evaluationState
         )
 
-        return h.view(viewName, viewModel)
+        return h.view(viewName, {
+          ...viewModel,
+          t
+        })
       }
 
       // Save state