Highlight health answers with a yes response

Author: paulrobertlloyd

app/assets/stylesheets/components/_card.scss

@@ -180,3 +180,14 @@ $_orange-text-colour: nhsuk-shade(nhsuk-colour("warm-yellow"), 70%);
     }
   }
 }
+
+// Ensure border colour inside warning cards can be seen and matches
+.nhsuk-card--warning {
+  blockquote {
+    border-left-color: nhsuk-colour("black");
+  }
+
+  .nhsuk-summary-list__row {
+    border-color: nhsuk-colour("yellow");
+  }
+}

app/assets/stylesheets/vendor/nhsuk-frontend/overrides/_summary-list.scss

@@ -1,13 +1,5 @@
-@use "sass:color";
 @use "../core" as *;
 
-// Ensure border colour inside warning callout can be seen and matches
-.nhsuk-card--warning {
-  .nhsuk-summary-list__row {
-    border-color: color.scale(color.mix($nhsuk-border-colour, nhsuk-colour("yellow"), 50%), $lightness: -10%);
-  }
-}
-
 // Reduce space between summary list and button group
 .nhsuk-summary-list:has(+ .nhsuk-button-group) {
   @include nhsuk-responsive-margin(4, "bottom");

app/controllers/reply.js

@@ -15,7 +15,7 @@ import {
   Vaccination
 } from '../models.js'
 import { today } from '../utils/date.js'
-import { hasAnswersNeedingTriage } from '../utils/reply.js'
+import { countAnswersNeedingTriage } from '../utils/reply.js'
 import { formatParent } from '../utils/string.js'
 import {
   getScreenOutcomesForConsentMethod,
@@ -199,7 +199,7 @@ export const replyController = {
         },
         [`/${reply_uuid}/${type}/notify-parent`]: {},
         [`/${reply_uuid}/${type}/health-answers`]: {
-          [`/${reply_uuid}/${type}/${hasAnswersNeedingTriage(request.session.data.reply?.healthAnswers) ? 'triage' : 'check-answers'}`]: true
+          [`/${reply_uuid}/${type}/${countAnswersNeedingTriage(request.session.data.reply?.healthAnswers) ? 'triage' : 'check-answers'}`]: true
         },
         [`/${reply_uuid}/${type}/refusal-reason`]: {
           [`/${reply_uuid}/${type}/refusal-reason-details`]: {

app/locales/en.js

@@ -881,7 +881,9 @@ export const en = {
     }
   },
   healthAnswers: {
-    label: 'All answers to health questions'
+    label: 'Answers to health questions',
+    count:
+      'Answers to health questions{count, plural, =0 {} one {, including 1 Yes response} other {, including # Yes responses}}'
   },
   healthQuestions,
   home: {

app/models/consent.js

@@ -1,5 +1,5 @@
 import { Reply } from '../models.js'
-import { hasAnswersNeedingTriage } from '../utils/reply.js'
+import { countAnswersNeedingTriage } from '../utils/reply.js'
 import { formatLinkWithSecondaryText } from '../utils/string.js'
 
 /**
@@ -10,10 +10,10 @@ export class Consent extends Reply {
   /**
    * Answers in this consent response need triage
    *
-   * @returns {boolean} Answers need triage
+   * @returns {boolean} Has answers needing triage
    */
   get hasAnswersNeedingTriage() {
-    return hasAnswersNeedingTriage(this.healthAnswers)
+    return countAnswersNeedingTriage(this.healthAnswers) > 0
   }
 
   /**

app/models/patient-session.js

@@ -37,7 +37,8 @@ import {
 import {
   getConsentOutcome,
   getConsentHealthAnswers,
-  getConsentRefusalReasons
+  getConsentRefusalReasons,
+  countAnswersNeedingTriage
 } from '../utils/reply.js'
 import {
   getConsentOutcomeStatus,
@@ -614,6 +615,15 @@ export class PatientSession {
     return getConsentHealthAnswers(this)
   }
 
+  /**
+   * At least one answer in consent health answers needs triage
+   *
+   * @returns {number} Number of answers needing triage
+   */
+  get answersNeedingTriageCount() {
+    return countAnswersNeedingTriage(this.consentHealthAnswers)
+  }
+
   /**
    * Get responses with triage notes for consent health answers
    *

app/utils/reply.js

@@ -280,7 +280,7 @@ export const getHealthAnswers = (vaccine, healthCondition) => {
  * @returns {string} Triage note
  */
 export const getTriageNote = (healthAnswers, healthCondition) => {
-  if (hasAnswersNeedingTriage(healthAnswers)) {
+  if (countAnswersNeedingTriage(healthAnswers)) {
     return healthConditions[healthCondition].triageNote
   }
 }
@@ -338,19 +338,17 @@ export const getRefusalReason = (type, decision) => {
  * Has health answers needing triage
  *
  * @param {object} healthAnswers - Health answers
- * @returns {boolean} Has health answers needing triage
+ * @returns {number} Number of health answers needing triage
  */
-export const hasAnswersNeedingTriage = (healthAnswers) => {
+export const countAnswersNeedingTriage = (healthAnswers) => {
   if (!healthAnswers) {
-    return false
+    return 0
   }
 
-  // Ignore answer to asthma question, as only its sub-questions get triaged
-  const nonConditionalAnswers = Object.fromEntries(
-    Object.entries(healthAnswers).filter(([key]) => key !== 'asthma')
-  )
+  const ignoredKeys = new Set(['asthma'])
 
-  return Object.values(nonConditionalAnswers).find(
-    (answer) => answer.answer === 'Yes'
-  )
+  return Object.entries(healthAnswers)
+    .filter(([key]) => !ignoredKeys.has(key))
+    .flatMap(([, answer]) => (Array.isArray(answer) ? answer : [answer]))
+    .filter((answer) => answer.answer === 'Yes').length
 }

app/views/patient-session/_consent.njk

@@ -101,21 +101,17 @@
       }) if parent.email or parent.tel }}
     {% endfor %}
   {% endif %}
-
-  {# Health answers #}
-  {% if patientSession.consentHealthAnswers %}
-    <hr class="nhsuk-section-break nhsuk-section-break--visible nhsuk-section-break--m">
-
-    {{ appHeading({
-      classes: "nhsuk-u-margin-bottom-2",
-      level: 4,
-      size: "s",
-      title: __("healthAnswers.label")
-    }) }}
-
-    {{ summaryList({
-      classes: "app-summary-list--full-width",
-      rows: healthAnswerRows(patientSession.consentHealthAnswers)
-    }) }}
-  {% endif %}
 {% endcall %}
+
+{# Health answers #}
+{{ summaryList({
+  card: {
+    classes: "nhsuk-card--warning" if patientSession.answersNeedingTriageCount,
+    heading: __mf("healthAnswers.count", {
+      count: patientSession.answersNeedingTriageCount
+    }),
+    headingLevel: 3
+  },
+  classes: "app-summary-list--full-width",
+  rows: healthAnswerRows(patientSession.consentHealthAnswers)
+}) if patientSession.consentHealthAnswers }}