@defra/forms-engine-plugin 0.1.9 → 0.1.11

package/src/server/plugins/errorPages.ts

@@ -3,7 +3,6 @@ import {
   type ResponseToolkit,
   type ServerRegisterPluginObject
 } from '@hapi/hapi'
-import { StatusCodes } from 'http-status-codes'
 
 /*
  * Add an `onPreResponse` listener to return error pages
@@ -20,36 +19,15 @@ export default {
           // processing the request
           const statusCode = response.output.statusCode
 
-          // Check for a form model on the request
-          // and use it to set the correct service name
-          // and start page path. In the event of a error
-          // happening inside a "form" level request, the header
-          // then displays the contextual form text and href
-          const model = request.app.model
-          const viewModel = model
-            ? {
-                name: model.name,
-                serviceUrl: `/${model.basePath}`
-              }
-            : undefined
-
-          // In the event of 404
-          // return the `404` view
-          if (statusCode === StatusCodes.NOT_FOUND.valueOf()) {
-            return h.view('404', viewModel).code(statusCode)
-          }
-
-          request.log('error', {
+          const error = {
             statusCode,
-            data: response.data,
             message: response.message,
             stack: response.stack
-          })
+          }
 
-          request.logger.error(response.stack)
+          request.log('error', error)
 
-          // The return the `500` view
-          return h.view('500', viewModel).code(statusCode)
+          return h.response(error).code(statusCode)
         }
         return h.continue
       })

package/src/server/plugins/nunjucks/context.js

@@ -5,7 +5,6 @@ import Boom from '@hapi/boom'
 import { StatusCodes } from 'http-status-codes'
 
 import pkg from '~/package.json' with { type: 'json' }
-import { parseCookieConsent } from '~/src/common/cookies.js'
 import { config } from '~/src/config/index.js'
 import { createLogger } from '~/src/server/common/helpers/logging/logger.js'
 import { PREVIEW_PATH_PREFIX } from '~/src/server/constants.js'
@@ -23,20 +22,8 @@ let webpackManifest
  * @param {FormRequest | FormRequestPayload | null} request
  */
 export function context(request) {
-  const manifestPath = join(config.get('publicDir'), 'assets-manifest.json')
-
-  if (!webpackManifest) {
-    try {
-      // eslint-disable-next-line -- Allow JSON type 'any'
-      webpackManifest = JSON.parse(readFileSync(manifestPath, 'utf-8'))
-    } catch {
-      logger.error(`Webpack ${basename(manifestPath)} not found`)
-    }
-  }
+  const { params, path, response } = request ?? {}
 
-  const { params, path, query = {}, response, state } = request ?? {}
-
-  const isForceAccess = 'force' in query
   const isPreviewMode = path?.startsWith(PREVIEW_PATH_PREFIX)
 
   // Only add the slug in to the context if the response is OK.
@@ -44,45 +31,68 @@ export function context(request) {
   const isResponseOK =
     !Boom.isBoom(response) && response?.statusCode === StatusCodes.OK
 
+  const pluginStorage = request?.server.plugins['forms-engine-plugin']
+  let consumerViewContext = {}
+
+  if (!pluginStorage) {
+    throw Error('context called before plugin registered')
+  }
+
+  if (!pluginStorage.baseLayoutPath) {
+    throw Error('Missing baseLayoutPath in plugin.options.nunjucks')
+  }
+
+  if ('viewContext' in pluginStorage) {
+    consumerViewContext = pluginStorage.viewContext(request)
+  }
+
   /** @type {ViewContext} */
   const ctx = {
+    // take consumers props first so we can override it
+    ...consumerViewContext,
+    baseLayoutPath: pluginStorage.baseLayoutPath,
     appVersion: pkg.version,
-    assetPath: '/assets',
     config: {
       cdpEnvironment: config.get('cdpEnvironment'),
       designerUrl: config.get('designerUrl'),
       feedbackLink: encodeUrl(config.get('feedbackLink')),
       phaseTag: config.get('phaseTag'),
-      serviceBannerText: config.get('serviceBannerText'),
       serviceName: config.get('serviceName'),
       serviceVersion: config.get('serviceVersion')
     },
     crumb: safeGenerateCrumb(request),
-    cspNonce: request?.plugins.blankie?.nonces?.script,
-    currentPath: request ? `${request.path}${request.url.search}` : undefined,
+    currentPath: `${request.path}${request.url.search}`,
     previewMode: isPreviewMode ? params?.state : undefined,
-    slug: isResponseOK ? params?.slug : undefined,
-
-    getAssetPath: (asset = '') => {
-      return `/${webpackManifest?.[asset] ?? asset}`
-    }
+    slug: isResponseOK ? params?.slug : undefined
   }
 
-  if (!isForceAccess) {
-    ctx.config.googleAnalyticsTrackingId = config.get(
-      'googleAnalyticsTrackingId'
-    )
+  return ctx
+}
+
+/**
+ * Returns the context for the devtool. Consumers won't have access to this.
+ */
+export function devtoolContext() {
+  const manifestPath = join(config.get('publicDir'), 'assets-manifest.json')
 
-    if (typeof state?.cookieConsent === 'string') {
-      ctx.cookieConsent = parseCookieConsent(state.cookieConsent)
+  if (!webpackManifest) {
+    try {
+      // eslint-disable-next-line -- Allow JSON type 'any'
+      webpackManifest = JSON.parse(readFileSync(manifestPath, 'utf-8'))
+    } catch {
+      logger.error(`Webpack ${basename(manifestPath)} not found`)
     }
   }
 
-  return ctx
+  return {
+    assetPath: '/assets',
+    getDxtAssetPath: (asset = '') => {
+      return `/${webpackManifest?.[asset] ?? asset}`
+    }
+  }
 }
 
 /**
- * @import { CookieConsent } from '~/src/common/types.js'
  * @import { ViewContext } from '~/src/server/plugins/nunjucks/types.js'
  * @import { FormRequest, FormRequestPayload } from '~/src/server/routes/types.js'
  */

package/src/server/plugins/nunjucks/context.test.js

@@ -1,28 +1,29 @@
 import { tmpdir } from 'node:os'
 
-import { config } from '~/src/config/index.js'
-import { encodeUrl } from '~/src/server/plugins/engine/helpers.js'
-import { context } from '~/src/server/plugins/nunjucks/context.js'
+import {
+  context,
+  devtoolContext
+} from '~/src/server/plugins/nunjucks/context.js'
 
 describe('Nunjucks context', () => {
   beforeEach(() => jest.resetModules())
 
   describe('Asset path', () => {
     it("should include 'assetPath' for GOV.UK Frontend icons", () => {
-      const { assetPath } = context(null)
+      const { assetPath } = devtoolContext()
       expect(assetPath).toBe('/assets')
     })
   })
 
   describe('Asset helper', () => {
     it("should locate 'assets-manifest.json' assets", () => {
-      const { getAssetPath } = context(null)
+      const { getDxtAssetPath } = devtoolContext()
 
-      expect(getAssetPath('example.scss')).toBe(
+      expect(getDxtAssetPath('example.scss')).toBe(
         '/stylesheets/example.xxxxxxx.min.css'
       )
 
-      expect(getAssetPath('example.mjs')).toBe(
+      expect(getDxtAssetPath('example.mjs')).toBe(
         '/javascripts/example.xxxxxxx.min.js'
       )
     })
@@ -32,43 +33,33 @@ describe('Nunjucks context', () => {
         const { config } = await import('~/src/config/index.js')
 
         // Import when isolated to avoid cache
-        const { context } = await import(
+        const { devtoolContext } = await import(
           '~/src/server/plugins/nunjucks/context.js'
         )
 
         // Update config for missing manifest
         config.set('publicDir', tmpdir())
-        const { getAssetPath } = context(null)
+        const { getDxtAssetPath } = devtoolContext()
 
         // Uses original paths when missing
-        expect(getAssetPath('example.scss')).toBe('/example.scss')
-        expect(getAssetPath('example.mjs')).toBe('/example.mjs')
+        expect(getDxtAssetPath('example.scss')).toBe('/example.scss')
+        expect(getDxtAssetPath('example.mjs')).toBe('/example.mjs')
       })
     })
 
     it('should return path to unknown assets', () => {
-      const { getAssetPath } = context(null)
+      const { getDxtAssetPath } = devtoolContext()
 
-      expect(getAssetPath()).toBe('/')
-      expect(getAssetPath('example.jpg')).toBe('/example.jpg')
-      expect(getAssetPath('example.gif')).toBe('/example.gif')
+      expect(getDxtAssetPath()).toBe('/')
+      expect(getDxtAssetPath('example.jpg')).toBe('/example.jpg')
+      expect(getDxtAssetPath('example.gif')).toBe('/example.gif')
     })
   })
 
   describe('Config', () => {
     it('should include environment, phase tag and service info', () => {
-      const ctx = context(null)
-
-      expect(ctx.config).toEqual(
-        expect.objectContaining({
-          cdpEnvironment: config.get('cdpEnvironment'),
-          feedbackLink: encodeUrl(config.get('feedbackLink')),
-          googleAnalyticsTrackingId: config.get('googleAnalyticsTrackingId'),
-          phaseTag: config.get('phaseTag'),
-          serviceBannerText: config.get('serviceBannerText'),
-          serviceName: config.get('serviceName'),
-          serviceVersion: config.get('serviceVersion')
-        })
+      expect(() => context(null)).toThrow(
+        'context called before plugin registered'
       )
     })
   })
@@ -83,6 +74,9 @@ describe('Nunjucks context', () => {
             plugins: {
               crumb: {
                 generate: jest.fn()
+              },
+              'forms-engine-plugin': {
+                baseLayoutPath: 'randomValue'
               }
             }
           },
@@ -113,6 +107,9 @@ describe('Nunjucks context', () => {
             plugins: {
               crumb: {
                 generate: jest.fn().mockReturnValue(mockCrumb)
+              },
+              'forms-engine-plugin': {
+                baseLayoutPath: 'randomValue'
               }
             }
           },

package/src/server/plugins/nunjucks/types.js

@@ -12,16 +12,15 @@
 /**
  * @typedef {object} ViewContext - Nunjucks view context
  * @property {string} appVersion - Application version
- * @property {string} assetPath - Asset path
+ * @property {string} [baseLayoutPath] - Base layout path
  * @property {Partial<Config>} config - Application config properties
- * @property {CookieConsent} [cookieConsent] - Cookie consent preferences
  * @property {string} [crumb] - Cross-Site Request Forgery (CSRF) token
  * @property {string} [cspNonce] - Content Security Policy (CSP) nonce
  * @property {string} [currentPath] - Current path
  * @property {string} [previewMode] - Preview mode
  * @property {string} [slug] - Form slug
- * @property {(asset?: string) => string} getAssetPath - Asset path resolver
  * @property {FormContext} [context] - the current form context
+ * @property {PluginOptions['viewContext']} [injectedViewContext] - the current form context
  */
 
 /**
@@ -34,7 +33,7 @@
  */
 
 /**
- * @import { CookieConsent } from '~/src/common/types.js'
  * @import { config } from '~/src/config/index.js'
  * @import { FormContext } from '~/src/server/plugins/engine/types.js'
+ * @import { PluginOptions } from '~/src/server/plugins/engine/plugin.js'
  */

package/src/server/routes/index.ts

@@ -1,2 +1 @@
 export { default as publicRoutes } from '~/src/server/routes/public.js'
-export { default as healthRoute } from '~/src/server/routes/health.js'

package/src/server/utils/file-form-service.js

@@ -0,0 +1,144 @@
+import fs from 'fs/promises'
+import path from 'node:path'
+
+import YAML from 'yaml'
+
+/**
+ * FileFormService class
+ */
+export class FileFormService {
+  /**
+   * The map of form metadatas by slug
+   * @type {Map<string, FormMetadata>}
+   */
+  #metadata = new Map()
+
+  /**
+   * The map of form definitions by id
+   * @type {Map<string, FormDefinition>}
+   */
+  #definition = new Map()
+
+  /**
+   * Add form from a file
+   * @param {string} filepath - the file path
+   * @param {FormMetadata} metadata - the metadata to use for this form
+   * @returns {Promise<FormDefinition>}
+   */
+  async addForm(filepath, metadata) {
+    const definition = await this.readForm(filepath)
+
+    this.#metadata.set(metadata.slug, metadata)
+    this.#definition.set(metadata.id, definition)
+
+    return definition
+  }
+
+  /**
+   * Read the form definition from file
+   * @param {string} filepath - the file path
+   * @returns {Promise<FormDefinition>}
+   */
+  async readForm(filepath) {
+    const ext = path.extname(filepath).toLowerCase()
+
+    switch (ext) {
+      case '.json':
+        return this.readJsonForm(filepath)
+      case '.yaml':
+        return this.readYamlForm(filepath)
+      default:
+        throw new Error(`Invalid file extension '${ext}'`)
+    }
+  }
+
+  /**
+   * Read the form definition from a json file
+   * @param {string} filepath - the file path
+   * @returns {Promise<FormDefinition>}
+   */
+  async readJsonForm(filepath) {
+    /**
+     * @type {FormDefinition}
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+    const definition = JSON.parse(await fs.readFile(filepath, 'utf8'))
+
+    return definition
+  }
+
+  /**
+   * Read the form definition from a yaml file
+   * @param {string} filepath - the file path
+   * @returns {Promise<FormDefinition>}
+   */
+  async readYamlForm(filepath) {
+    /**
+     * @type {FormDefinition}
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+    const definition = YAML.parse(await fs.readFile(filepath, 'utf8'))
+
+    return definition
+  }
+
+  /**
+   * Get the form metadata by slug
+   * @param {string} slug - the form slug
+   * @returns {FormMetadata}
+   */
+  getFormMetadata(slug) {
+    const metadata = this.#metadata.get(slug)
+
+    if (!metadata) {
+      throw new Error(`Form metadata '${slug}' not found`)
+    }
+
+    return metadata
+  }
+
+  /**
+   * Get the form defintion by id
+   * @param {string} id - the form id
+   * @returns {FormDefinition}
+   */
+  getFormDefinition(id) {
+    const definition = this.#definition.get(id)
+
+    if (!definition) {
+      throw new Error(`Form definition '${id}' not found`)
+    }
+
+    return definition
+  }
+
+  /**
+   * Returns a FormsService compliant interface
+   * @returns {import('~/src/server/types.js').FormsService}
+   */
+  toFormsService() {
+    return {
+      /**
+       * Get the form metadata by slug
+       * @param {string} slug
+       * @returns {Promise<FormMetadata>}
+       */
+      getFormMetadata: (slug) => {
+        return Promise.resolve(this.getFormMetadata(slug))
+      },
+
+      /**
+       * Get the form defintion by id
+       * @param {string} id
+       * @returns {Promise<FormDefinition>}
+       */
+      getFormDefinition: (id) => {
+        return Promise.resolve(this.getFormDefinition(id))
+      }
+    }
+  }
+}
+
+/**
+ * @import { FormMetadata, FormDefinition } from '@defra/forms-model'
+ */

package/src/typings/hapi/index.d.ts

@@ -5,6 +5,7 @@ import { type ServerYar, type Yar } from '@hapi/yar'
 import { type Logger } from 'pino'
 
 import { type FormModel } from '~/src/server/plugins/engine/models/index.js'
+import { type context } from '~/src/server/plugins/engine/nunjucks.js'
 import {
   type FormRequest,
   type FormRequestPayload
@@ -19,16 +20,9 @@ declare module '@hapi/hapi' {
       generate?: (request: Request | FormRequest | FormRequestPayload) => string
     }
     'forms-engine-plugin': {
+      baseLayoutPath: string
       cacheService: CacheService
-    }
-  }
-
-  interface PluginsStates {
-    blankie?: {
-      nonces?: {
-        script?: string
-        style?: string
-      }
+      viewContext: context
     }
   }
 

package/.server/common/cookies.js

@@ -1,55 +0,0 @@
-/**
-  @type {CookieConsent}
- */
-export const defaultConsent = {
-  analytics: null,
-  dismissed: false
-};
-
-/**
- * Parses the cookie consent policy
- * @param {string} value
- */
-export function parseCookieConsent(value) {
-  /** @type {CookieConsent} */
-  let cookieConsent;
-  try {
-    const encodedValue = decodeURIComponent(value);
-
-    // eslint-disable-next-line -- Allow JSON type 'any'
-    const decodedValue = JSON.parse(encodedValue);
-    if (isValidConsent(decodedValue)) {
-      cookieConsent = decodedValue;
-    } else {
-      cookieConsent = defaultConsent;
-    }
-  } catch {
-    cookieConsent = defaultConsent;
-  }
-  return cookieConsent;
-}
-
-/**
- * Serialises the cookie consent policy
- * @param {CookieConsent} consent
- * @returns {string} cookie value
- */
-export function serialiseCookieConsent(consent) {
-  return encodeURIComponent(JSON.stringify(consent));
-}
-
-/**
- * @param {unknown} consent
- * @returns {consent is CookieConsent}
- */
-function isValidConsent(consent) {
-  if (consent === null || Array.isArray(consent)) {
-    return false;
-  }
-  return typeof consent === 'object' && 'analytics' in consent;
-}
-
-/**
- * @import {CookieConsent} from '~/src/common/types.js'
- */
-//# sourceMappingURL=cookies.js.map

package/.server/common/cookies.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cookies.js","names":["defaultConsent","analytics","dismissed","parseCookieConsent","value","cookieConsent","encodedValue","decodeURIComponent","decodedValue","JSON","parse","isValidConsent","serialiseCookieConsent","consent","encodeURIComponent","stringify","Array","isArray"],"sources":["../../src/common/cookies.js"],"sourcesContent":["/**\n  @type {CookieConsent}\n */\nexport const defaultConsent = {\n  analytics: null,\n  dismissed: false\n}\n\n/**\n * Parses the cookie consent policy\n * @param {string} value\n */\nexport function parseCookieConsent(value) {\n  /** @type {CookieConsent} */\n  let cookieConsent\n\n  try {\n    const encodedValue = decodeURIComponent(value)\n\n    // eslint-disable-next-line -- Allow JSON type 'any'\n    const decodedValue = JSON.parse(encodedValue)\n\n    if (isValidConsent(decodedValue)) {\n      cookieConsent = decodedValue\n    } else {\n      cookieConsent = defaultConsent\n    }\n  } catch {\n    cookieConsent = defaultConsent\n  }\n\n  return cookieConsent\n}\n\n/**\n * Serialises the cookie consent policy\n * @param {CookieConsent} consent\n * @returns {string} cookie value\n */\nexport function serialiseCookieConsent(consent) {\n  return encodeURIComponent(JSON.stringify(consent))\n}\n\n/**\n * @param {unknown} consent\n * @returns {consent is CookieConsent}\n */\nfunction isValidConsent(consent) {\n  if (consent === null || Array.isArray(consent)) {\n    return false\n  }\n\n  return typeof consent === 'object' && 'analytics' in consent\n}\n\n/**\n * @import {CookieConsent} from '~/src/common/types.js'\n */\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,MAAMA,cAAc,GAAG;EAC5BC,SAAS,EAAE,IAAI;EACfC,SAAS,EAAE;AACb,CAAC;;AAED;AACA;AACA;AACA;AACA,OAAO,SAASC,kBAAkBA,CAACC,KAAK,EAAE;EACxC;EACA,IAAIC,aAAa;EAEjB,IAAI;IACF,MAAMC,YAAY,GAAGC,kBAAkB,CAACH,KAAK,CAAC;;IAE9C;IACA,MAAMI,YAAY,GAAGC,IAAI,CAACC,KAAK,CAACJ,YAAY,CAAC;IAE7C,IAAIK,cAAc,CAACH,YAAY,CAAC,EAAE;MAChCH,aAAa,GAAGG,YAAY;IAC9B,CAAC,MAAM;MACLH,aAAa,GAAGL,cAAc;IAChC;EACF,CAAC,CAAC,MAAM;IACNK,aAAa,GAAGL,cAAc;EAChC;EAEA,OAAOK,aAAa;AACtB;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASO,sBAAsBA,CAACC,OAAO,EAAE;EAC9C,OAAOC,kBAAkB,CAACL,IAAI,CAACM,SAAS,CAACF,OAAO,CAAC,CAAC;AACpD;;AAEA;AACA;AACA;AACA;AACA,SAASF,cAAcA,CAACE,OAAO,EAAE;EAC/B,IAAIA,OAAO,KAAK,IAAI,IAAIG,KAAK,CAACC,OAAO,CAACJ,OAAO,CAAC,EAAE;IAC9C,OAAO,KAAK;EACd;EAEA,OAAO,OAAOA,OAAO,KAAK,QAAQ,IAAI,WAAW,IAAIA,OAAO;AAC9D;;AAEA;AACA;AACA","ignoreList":[]}

package/.server/common/cookies.test.js

@@ -1,15 +0,0 @@
-import { parseCookieConsent } from "./cookies.js";
-describe('cookies', () => {
-  it('parses a valid policy', () => {
-    expect(parseCookieConsent('{"analytics":true}')).toEqual({
-      analytics: true
-    });
-  });
-  it.each(["['not', 'an', 'object']", '{{ not: "an object" }}', '{ additional: AAA }', '{ marketing: 100 }', '', 'null'])('converts a malformed policy to the default', value => {
-    expect(parseCookieConsent(value)).toEqual({
-      analytics: null,
-      dismissed: false
-    });
-  });
-});
-//# sourceMappingURL=cookies.test.js.map

package/.server/common/cookies.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cookies.test.js","names":["parseCookieConsent","describe","it","expect","toEqual","analytics","each","value","dismissed"],"sources":["../../src/common/cookies.test.js"],"sourcesContent":["import { parseCookieConsent } from '~/src/common/cookies.js'\n\ndescribe('cookies', () => {\n  it('parses a valid policy', () => {\n    expect(parseCookieConsent('{\"analytics\":true}')).toEqual({\n      analytics: true\n    })\n  })\n\n  it.each([\n    \"['not', 'an', 'object']\",\n    '{{ not: \"an object\" }}',\n    '{ additional: AAA }',\n    '{ marketing: 100 }',\n    '',\n    'null'\n  ])('converts a malformed policy to the default', (value) => {\n    expect(parseCookieConsent(value)).toEqual({\n      analytics: null,\n      dismissed: false\n    })\n  })\n})\n"],"mappings":"AAAA,SAASA,kBAAkB;AAE3BC,QAAQ,CAAC,SAAS,EAAE,MAAM;EACxBC,EAAE,CAAC,uBAAuB,EAAE,MAAM;IAChCC,MAAM,CAACH,kBAAkB,CAAC,oBAAoB,CAAC,CAAC,CAACI,OAAO,CAAC;MACvDC,SAAS,EAAE;IACb,CAAC,CAAC;EACJ,CAAC,CAAC;EAEFH,EAAE,CAACI,IAAI,CAAC,CACN,yBAAyB,EACzB,wBAAwB,EACxB,qBAAqB,EACrB,oBAAoB,EACpB,EAAE,EACF,MAAM,CACP,CAAC,CAAC,4CAA4C,EAAGC,KAAK,IAAK;IAC1DJ,MAAM,CAACH,kBAAkB,CAACO,KAAK,CAAC,CAAC,CAACH,OAAO,CAAC;MACxCC,SAAS,EAAE,IAAI;MACfG,SAAS,EAAE;IACb,CAAC,CAAC;EACJ,CAAC,CAAC;AACJ,CAAC,CAAC","ignoreList":[]}

package/.server/common/types.js

@@ -1,6 +0,0 @@
-/**
- * @typedef CookieConsent
- * @property {boolean | null} analytics - whether analytics cookies are allowed
- * @property {boolean} dismissed - whether cookie banner has been dismissed
- */
-//# sourceMappingURL=types.js.map

package/.server/common/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../src/common/types.js"],"sourcesContent":["/**\n * @typedef CookieConsent\n * @property {boolean | null} analytics - whether analytics cookies are allowed\n * @property {boolean} dismissed - whether cookie banner has been dismissed\n */\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/.server/server/forms/README.md

@@ -1,10 +0,0 @@
-# Pre-configured Forms
-
-This folder holds pre-configured form definitions that can be loaded by the runner:
-
-```js
-const server = await createServer({
-  formFileName: 'example.js',
-  formFilePath: join(cwd(), 'server/forms'),
-})
-```