RPS-1172: Check your answers screen (#651)

* RPS-1172: added mocks for address lookup api

* RPS-1172: fixed journey up until payment screen

* RPS-1172: fixed address lookup flow

* RPS-1172: fixed validation on address lookup flow

* RPS-1172: added conditional email field

* RPS-1172: pr cleanup

* RPS-1172: pr cleanup #2

* RPS-1172: pr cleanup #3

* RPS-1172: fixed change links

Author: tyler-ukhsa

.env.example

@@ -0,0 +1,9 @@
+# Development environment variables
+# Copy this file to .env.local and fill in the values for your local development environment
+
+SESSION_COOKIE_PASSWORD=604c565d2037e89c5fc3ed6bb20343148ccd2e5aa1abb93d
+RPS_API_BASE_URL=http://localhost
+RPS_TENANT_ID=test
+RPS_CLIENT_ID=test-client
+RPS_CLIENT_SECRET=test-secret
+RPS_SCOPES=test-scope

.gitignore

@@ -13,6 +13,7 @@ npm-debug.log
 
 # Environment variables
 **/.env
+**/.env.local
 **/.env_mysql
 
 # Build output

docker-compose.dev.yml

@@ -25,5 +25,15 @@ services:
       - /usr/src/app/runner/dist
       - ./runner:/usr/src/app/runner
     command: yarn runner dev
+    extra_hosts:
+      - "host.docker.internal:host-gateway"
     environment:
-      - SESSION_COOKIE_PASSWORD=604c565d2037e89c5fc3ed6bb20343148ccd2e5aa1abb93d
+      # Forms can reference ${VAR_NAME} placeholders (e.g. addressLookupConfig in
+      # order-a-radon-risk-report.json). In development these are resolved from
+      # environment variables of the same name by resolvePlaceholders.ts.
+      - SESSION_COOKIE_PASSWORD
+      - RPS_API_BASE_URL
+      - RPS_TENANT_ID
+      - RPS_CLIENT_ID
+      - RPS_CLIENT_SECRET
+      - RPS_SCOPES

model/src/components/types.ts

@@ -27,6 +27,7 @@ export enum ComponentTypeEnum {
   ContextComponent = "ContextComponent",
   ContentWithState = "ContentWithState",
   DisplayAddress = "DisplayAddress",
+  HiddenField = "HiddenField",
 }
 
 export type ComponentType =
@@ -58,7 +59,8 @@ export type ComponentType =
   | "WebsiteField"
   | "ContextComponent"
   | "ContentWithState"
-  | "DisplayAddress";
+  | "DisplayAddress"
+  | "HiddenField";
 
 export type ComponentSubType = "field" | "content";
 
@@ -311,6 +313,16 @@ export interface DisplayAddressComponent extends ContentFieldBase {
   type: "DisplayAddress";
 }
 
+export interface HiddenFieldComponent {
+  type: "HiddenField";
+  name: string;
+  options: {
+    value?: string;
+    exposeToContext?: boolean;
+  };
+  schema?: {};
+}
+
 // List Fields
 export interface ListComponent extends ListFieldBase {
   type: "List";
@@ -337,7 +349,9 @@ export interface RadiosFieldComponent extends ListFieldBase {
 
 export interface SelectFieldComponent extends ListFieldBase {
   type: "SelectField";
-  options: ListFieldBase["options"] & { autocomplete?: string } & { preselected?: { text: string; value: string | number | boolean } };
+  options: ListFieldBase["options"] & { autocomplete?: string } & {
+    preselected?: { text: string; value: string | number | boolean };
+  };
   subType?: "listField";
 }
 
@@ -376,7 +390,8 @@ export type ComponentDef =
   | WebsiteFieldComponent
   | ContextComponent
   | ContentWithStateComponent
-  | DisplayAddressComponent;
+  | DisplayAddressComponent
+  | HiddenFieldComponent;
 
 // Components that render inputs.
 export type InputFieldsComponentsDef =

model/src/data-model/types.ts

@@ -215,6 +215,64 @@ export interface AddressLookupConfig extends MsalAuthorizerConfig {
   subscriptionKey?: string;
 }
 
+export interface SummaryDeclaration {
+  /** Checkbox label rendered on the summary page. */
+  label: string;
+  /** Overrides the default "You must declare…" flash error when unchecked. */
+  errorMessage?: string;
+  /** Hides the h2 Declaration heading in the summary page */
+  hideDeclarationHeading?: boolean;
+}
+
+/**
+ * Merges multiple named fields into a single summary row.
+ * The resulting row uses `to` as its field name and joins the source values with `joiner`.
+ */
+export interface SummaryMergeField {
+  names: string[];
+  to: string;
+  joiner: string;
+}
+
+/** A synthetic row that can be appended to the last summary section via a conditional rule. */
+export interface SummaryAppendSection {
+  name: string;
+  label: string;
+  value: string;
+  /** When true the user cannot return to change this value from the summary. */
+  immutable?: boolean;
+}
+
+export interface SummaryConditionalRowCondition {
+  field: string;
+  value?: string;
+  isEmpty?: boolean;
+}
+
+export interface SummaryConditionalRow {
+  when: SummaryConditionalRowCondition;
+  removeFields?: string[];
+  appendToLastSection?: SummaryAppendSection;
+}
+
+/**
+ * Data-driven configuration for the summary page, set at the form-definition level.
+ * Transforms are applied in order: merge → remove → relabel → value transform → conditional rules.
+ */
+export interface SummaryConfig {
+  /** Overrides the default "Confirm and submit" button label. */
+  submitLabel?: string;
+  declaration?: SummaryDeclaration;
+  /** Field names to strip from the summary rows entirely. */
+  removeFields?: string[];
+  mergeFields?: Array<SummaryMergeField>;
+  /** Map of field name → new display label. */
+  relabelFields?: Record<string, string>;
+  /** Map of field name → { rawValue → replacement display value }. */
+  valueTransforms?: Record<string, Record<string, string>>;
+  conditionalRows?: Array<SummaryConditionalRow>;
+}
+
 /**
  * `FormDefinition` is a typescript representation of `Schema`
  */
@@ -254,4 +312,5 @@ export type FormDefinition = {
   returnTo?: boolean | undefined;
   addressLookupConfig?: AddressLookupConfig;
   error500ContactEmail?: string | undefined;
+  summaryConfig?: SummaryConfig;
 };

model/src/schema/schema.ts

@@ -178,8 +178,7 @@ const specialPagesSchema = joi.object().keys({
   paymentSkippedWarningPage: paymentSkippedWarningPage.optional(),
 });
 
-const listItemSchema = joi.object().keys({
-  text: localisedString,
+const listItemBaseKeys = {
   value: joi.alternatives().try(joi.number(), joi.string()),
   checkpointDisplayValue: joi.alternatives().try(joi.number(), joi.string()),
   description: localisedString.optional(),
@@ -196,7 +195,17 @@ const listItemSchema = joi.object().keys({
     .allow(null)
     .optional(),
   condition: joi.string().allow(null, "").optional(),
-});
+};
+
+// Either `html` or `text` must be present, but not both — .oxor enforces this.
+const listItemSchema = joi
+  .object()
+  .keys({
+    ...listItemBaseKeys,
+    html: localisedString,
+    text: localisedString,
+  })
+  .oxor("html", "text");
 
 const listSchema = joi.object().keys({
   name: joi.string().required(),
@@ -345,6 +354,60 @@ const addressLookupConfigSchema = msalAuthorizeConfigSchema.concat(
   })
 );
 
+const summaryConfigSchema = joi.object().keys({
+  submitLabel: joi.string().optional(),
+  declaration: joi
+    .object()
+    .keys({
+      label: joi.string().required(),
+      errorMessage: joi.string().optional(),
+      hideDeclarationHeading: joi.boolean().optional(),
+    })
+    .optional(),
+  removeFields: joi.array().items(joi.string()).optional(),
+  mergeFields: joi
+    .array()
+    .items(
+      joi.object().keys({
+        names: joi.array().items(joi.string()).required(),
+        to: joi.string().required(),
+        joiner: joi.string().required(),
+      })
+    )
+    .optional(),
+  relabelFields: joi.object().pattern(joi.string(), joi.string()).optional(),
+  valueTransforms: joi
+    .object()
+    .pattern(joi.string(), joi.object().pattern(joi.string(), joi.string()))
+    .optional(),
+  conditionalRows: joi
+    .array()
+    .items(
+      joi.object().keys({
+        when: joi
+          .object()
+          .keys({
+            field: joi.string().required(),
+            value: joi.string().optional(),
+            isEmpty: joi.boolean().optional(),
+          })
+          .or("value", "isEmpty")
+          .required(),
+        removeFields: joi.array().items(joi.string()).optional(),
+        appendToLastSection: joi
+          .object()
+          .keys({
+            name: joi.string().required(),
+            label: joi.string().required(),
+            value: joi.string().required(),
+            immutable: joi.boolean().optional(),
+          })
+          .optional(),
+      })
+    )
+    .optional(),
+});
+
 export const Schema = joi
   .object()
   .required()
@@ -392,6 +455,7 @@ export const Schema = joi
     secureFormSubmissionConfig: secureFormSubmissionConfig.optional(),
     addressLookupConfig: addressLookupConfigSchema.optional(),
     error500ContactEmail: joi.string().optional(),
+    summaryConfig: summaryConfigSchema.optional(),
   });
 
 /**