D-03: refine add-break flow entry points and check answers

app/routes/bookings.js

@@ -49,6 +49,7 @@ function bookings (router, shared) {
       return {
         availId: avail.id,
         label: avail.label,
+        addBreakHref: `/sites/${site.id}/session/${avail.id}/${ctx.anchorDate}/breaks/add`,
         type: avail.type,
         startTime: avail.startTime,
         endTime: avail.endTime,

app/routes/sessions.js

@@ -436,8 +436,10 @@ function sessions (router, shared) {
       sessionLabel: avail.label,
       date: req.params.date,
       draft,
+      affectedCount: (draft.affectedBookingIds || []).length,
       formAction: `${getSessionBreaksBaseHref(req.site.id, avail.id, req.params.date)}/check`,
       backHref,
+      bookingsHref: `${getSessionBreaksBaseHref(req.site.id, avail.id, req.params.date)}/warning`,
       changeHref: draft.breakAction === 'change' && Number.isInteger(draft.breakIndex)
         ? `${getSessionBreaksBaseHref(req.site.id, avail.id, req.params.date)}/${draft.breakIndex}/change`
         : (draft.breakAction === 'add' ? `${getSessionBreaksBaseHref(req.site.id, avail.id, req.params.date)}/add` : null)

app/views/sites/bookings.html

@@ -51,6 +51,7 @@ <h1 class="nhsuk-heading-l">
               <div class="app-session__header">
                 <h2 class="app-session__title nhsuk-heading-m">{{ session.label }}</h2>
                 <div class="app-session__actions">
+                  <a href="{{ session.addBreakHref }}" class="nhsuk-button nhsuk-button--secondary nhsuk-button--small">Add break</a>
                   <a href="/sites/{{ site.id }}/session/{{ session.availId }}/{{ date }}" class="nhsuk-button nhsuk-button--secondary nhsuk-button--small">Change</a>
                 </div>
               </div>

app/views/sites/session-break-check.html

@@ -1,6 +1,6 @@
 {% extends 'layout.html' %}
 
-{% set pageName = "Check break changes — " + site.name %}
+{% set pageName = "Check your answers — " + site.name %}
 
 {% block beforeContent %}
   {{ backLink({ href: backHref }) }}
@@ -10,60 +10,59 @@
 <div class="nhsuk-grid-row">
   <div class="nhsuk-grid-column-two-thirds">
 
-    <h1 class="nhsuk-heading-xl">Check break changes</h1>
+    <h1 class="nhsuk-heading-xl">Check your answers</h1>
 
-    <div class="app-summary-card">
-      <div class="app-summary-card__title-wrapper">
-        <h2 class="app-summary-card__title">Session details</h2>
-      </div>
-      <div class="app-summary-card__content">
-        {{ summaryList({ rows: [
-          {
-            key: { text: "Session" },
-            value: { text: sessionLabel }
-          },
-          {
-            key: { text: "Date" },
-            value: { text: date | formatDateLong }
-          }
-        ] }) }}
-      </div>
-    </div>
+    <p class="nhsuk-body">Review the break changes before saving.</p>
 
-    <div class="app-summary-card">
-      <div class="app-summary-card__title-wrapper">
-        <h2 class="app-summary-card__title">Break details</h2>
-        {% if changeHref %}
-          <ul class="app-summary-card__actions">
-            <li class="app-summary-card__action">
-              <a href="{{ changeHref }}">Change<span class="nhsuk-u-visually-hidden"> break details</span></a>
-            </li>
-          </ul>
-        {% endif %}
-      </div>
-      <div class="app-summary-card__content">
-        {{ summaryList({ rows: [
-          {
-            key: { text: "Action" },
-            value: { text: "Remove break" if draft.breakAction === "remove" else ("Change break" if draft.breakAction === "change" else "Add break") }
-          },
-          {
-            key: { text: "Time" },
-            value: { text: (draft.breakStart | formatTime) + " to " + (draft.breakEnd | formatTime) }
-          }
-        ] }) }}
-      </div>
-    </div>
+    {% set summaryRows = [
+      {
+        key: { text: "Session" },
+        value: { text: sessionLabel }
+      },
+      {
+        key: { text: "Date" },
+        value: { text: date | formatDateLong }
+      },
+      {
+        key: { text: "Action" },
+        value: { text: "Remove break" if draft.breakAction === "remove" else ("Change break" if draft.breakAction === "change" else "Add break") }
+      },
+      {
+        key: { text: "Time" },
+        value: { text: (draft.breakStart | formatTime) + " to " + (draft.breakEnd | formatTime) },
+        actions: {
+          items: [{
+            href: changeHref,
+            text: "Change",
+            visuallyHiddenText: "break details"
+          }]
+        } if changeHref
+      }
+    ] %}
 
-    {% if draft.affectedBookingIds.length > 0 %}
-      {% call insetText({}) %}
-        <p>
-          {% if draft.bookingsChoice === "cancel" %}
-            {{ draft.affectedBookingIds.length }} {{ "booking will" if draft.affectedBookingIds.length === 1 else "bookings will" }} be cancelled when you save these changes.
-          {% else %}
-            {{ draft.affectedBookingIds.length }} {{ "booking will" if draft.affectedBookingIds.length === 1 else "bookings will" }} move to Kept bookings so {{ "it can" if draft.affectedBookingIds.length === 1 else "they can" }} be rescheduled.
-          {% endif %}
-        </p>
+    {% if affectedCount > 0 %}
+      {% set summaryRows = (summaryRows.push({
+        key: { text: "Bookings affected" },
+        value: { text: affectedCount }
+      }), summaryRows) %}
+      {% set summaryRows = (summaryRows.push({
+        key: { text: "What do you want to do with bookings" },
+        value: { text: "Keep bookings" if draft.bookingsChoice === "keep" else ("Cancel " + affectedCount + " " + ("booking" if affectedCount === 1 else "bookings")) },
+        actions: {
+          items: [{
+            href: bookingsHref,
+            text: "Change",
+            visuallyHiddenText: "what to do with bookings"
+          }]
+        }
+      }), summaryRows) %}
+    {% endif %}
+
+    {{ summaryList({ rows: summaryRows }) }}
+
+    {% if affectedCount > 0 and draft.bookingsChoice === "cancel" %}
+      {% call warningCallout({ heading: "You are about to remove " + affectedCount + " " + ("booking" if affectedCount === 1 else "bookings") }) %}
+        <p>This cannot be undone.</p>
       {% endcall %}
     {% endif %}
 

docs/decisions/round-1.md

@@ -24,6 +24,8 @@ This log captures the decisions indicated by round 1 research findings and notes
 - Impact: This should make break creation and day-level adjustments more discoverable and reduce avoidable editing errors.
 - Related assumptions: A-08 time blocks are understood as availability; A-11 implicit breaks are understood; A-20 splitting time blocks to create breaks is discoverable.
 - Recommendation: Introduce an add-breaks flow that takes users directly from the daily availability view into a simpler break-editing journey.
+- Implementation note: The daily bookings screen now includes an Add break button beside Change at session level. This opens the add-break flow with empty time fields. The row-level Add break link remains because it is still useful for prefilling the selected free period's time range.
+- Implementation note: The add-break check answers step now uses a more standard NHS check answers layout so it is visually distinct from the change overview page and less likely to be mistaken for another edit screen.
 - Priority: High
 
 ## D-04: Test a schedule pattern that supports different times on different days