Workflow part 2 (#140)

* Commit all the things

* Cleanup

* Set status correctly from index

* Fix check-in links

* Add special appointment details

* Fix data persisting after starting event

* Persist return url

Author: edwardhorsford

app/assets/javascript/main.js

@@ -13,7 +13,7 @@ document.addEventListener('DOMContentLoaded', () => {
       const link = e.currentTarget
       const clinicId = link.dataset.clinicId
       const eventId = link.dataset.eventId
-      const showAppointmentLink = link.dataset.showAppointmentLink === 'true'
+      const statusTagId = link.dataset.statusTagId
 
       try {
         const response = await fetch(
@@ -30,27 +30,38 @@ document.addEventListener('DOMContentLoaded', () => {
           throw new Error('Failed to check in participant')
         }
 
-        // Find the containing element by data attribute
-        const container = document.querySelector(`[data-event-status-container="${eventId}"]`)
-        if (container) {
-          let html = `
-            <strong class="nhsuk-tag">
-              Checked in
-            </strong>
-          `
+        // Update the status tag if we have an ID
+        if (statusTagId) {
+          const statusTag = document.getElementById(statusTagId)
+          if (statusTag) {
+            // Update the existing tag's text and classes
+            statusTag.textContent = 'Checked in'
+            statusTag.className = 'nhsuk-tag app-nowrap'
+          }
+        }
 
-          // Todo: this link should include the participant's name in hidden text
+        // Remove the check-in link
+        // Check if this is a modal button or a direct link
+        const isModalButton = link.closest('.app-modal')
 
-          // Add appointment link if enabled
-          if (showAppointmentLink) {
-            html += `
-            <p class="nhsuk-u-margin-top-2 nhsuk-u-margin-bottom-2">
-              <a href="/clinics/${clinicId}/events/${eventId}/start?event[workflowStatus][appointment]=started">Start appointment</a>
-            </p>
-            `
-          }
+        if (isModalButton) {
+          // For modal buttons, find the original check-in link on the main page
+          // Look for a link that opens the modal for this specific event
+          const modalId = `check-in-modal-${eventId}`
+          const originalCheckInLink = document.querySelector(`a[onclick*="openModal('${modalId}')"]`)
 
-          container.innerHTML = html
+          if (originalCheckInLink) {
+            const checkInParagraph = originalCheckInLink.closest('p')
+            if (checkInParagraph) {
+              checkInParagraph.remove()
+            }
+          }
+        } else {
+          // For direct links, remove the paragraph containing the link
+          const checkInParagraph = link.closest('p')
+          if (checkInParagraph) {
+            checkInParagraph.remove()
+          }
         }
 
         // Close any open modal (for modal-based check-ins)

app/filters/tags.js

@@ -30,7 +30,8 @@ const toTag = (status, options = {}) => {
   ].filter(Boolean).join(' ')
 
   // Generate tag HTML
-  return `<strong class="${classes}">${text}</strong>`
+  const idAttr = options.id ? ` id=\"${options.id}\"` : ''
+  return `<strong${idAttr} class="${classes}">${text}</strong>`
 }
 
 module.exports = {

app/lib/utils/event-data.js

@@ -53,13 +53,14 @@ const updateEventStatus = (data, eventId, newStatus) => {
   const eventIndex = data.events.findIndex(e => e.id === eventId)
   if (eventIndex === -1) return null
 
-  const event = data.events[eventIndex]
+  // Use temp event if it exists and matches, otherwise use the array event
+  const baseEvent = (data.event && data.event.id === eventId) ? data.event : data.events[eventIndex]
 
   const updatedEvent = {
-    ...event,
+    ...baseEvent,
     status: newStatus,
     statusHistory: [
-      ...event.statusHistory,
+      ...baseEvent.statusHistory,
       {
         status: newStatus,
         timestamp: new Date().toISOString(),
@@ -71,8 +72,10 @@ const updateEventStatus = (data, eventId, newStatus) => {
   data.events[eventIndex] = updatedEvent
 
   // Also update temp event data if it exists and matches this event
+  // Only update the status-related fields to preserve other temp changes
   if (data.event && data.event.id === eventId) {
-    data.event = { ...updatedEvent }
+    data.event.status = newStatus
+    data.event.statusHistory = updatedEvent.statusHistory
   }
 
   return updatedEvent
@@ -90,10 +93,11 @@ const updateEventData = (data, eventId, updates) => {
   const eventIndex = data.events.findIndex(e => e.id === eventId)
   if (eventIndex === -1) return null
 
-  const event = data.events[eventIndex]
+  // Use temp event if it exists and matches, otherwise use the array event
+  const baseEvent = (data.event && data.event.id === eventId) ? data.event : data.events[eventIndex]
 
   const updatedEvent = {
-    ...event,
+    ...baseEvent,
     ...updates
   }
 

app/lib/utils/status.js

@@ -7,6 +7,7 @@ const dayjs = require('dayjs')
  * @type {Object}
  */
 const STATUS_GROUPS = {
+  not_started: ['event_scheduled', 'event_checked_in'],
   completed: ['event_complete', 'event_partially_screened'],
   final: ['event_complete', 'event_partially_screened', 'event_did_not_attend', 'event_attended_not_screened', 'event_cancelled'],
   active: ['event_scheduled', 'event_checked_in', 'event_in_progress'],
@@ -35,6 +36,18 @@ const getStatus = (input) => {
   return input.status || null
 }
 
+/**
+ * Check if a status represents a not started event
+ * @param {string|Object} input - Status string or event object
+ * @returns {boolean} Whether the status is not started
+ */
+const hasNotStarted = (input) => {
+  const status = getStatus(input)
+  if (!status) return false
+  return isStatusInGroup(status, 'not_started')
+}
+
+
 /**
  * Check if a status represents a completed event
  * @param {string|Object} input - Status string or event object
@@ -248,6 +261,7 @@ const isSpecialAppointment = (event) => {
 }
 
 module.exports = {
+  hasNotStarted,
   isCompleted,
   isInProgress,
   isFinal,

app/routes/events.js

@@ -127,13 +127,12 @@ module.exports = router => {
     next()
   })
 
-  // Main route in to starting an event - used to clear any temp data
-  // Possibly not needed as if the ID doesn't match our use route would reset this - but this could
-  // be used to reset a patient back to defaults
+  // Main route in to starting an event - used to clear any temp data, set status to in progress and store the user id of the mammographer doing the appointment
   router.get('/clinics/:clinicId/events/:eventId/start', (req, res) => {
     const data = req.session.data
     const event = getEvent(data, req.params.eventId)
     const currentUser = data.currentUser
+    const returnTo = req.query.returnTo // Used by /index so we can 'start' an appointment but then go to a different page.
 
     if (event?.status !== 'event_in_progress') {
       // Update status
@@ -148,22 +147,77 @@ module.exports = router => {
       })
     }
 
-    // Explicitly delete the temp event data just in case
-    // On next request this will be recreated from the event array
-    delete data.event
-    console.log('Cleared temp event data')
+    // Parse and apply workflow status from query parameters
+    // This lets links in index.njk pre-complete certain sections
+    // Look for parameters like event[workflowStatus][section]=completed
+    if (req.query.event && req.query.event.workflowStatus) {
+      const workflowUpdates = req.query.event.workflowStatus
+      console.log('Applying workflow status updates:', workflowUpdates)
+
+      updateEventData(data, req.params.eventId, {
+        workflowStatus: workflowUpdates
+      })
+    }
+
+    // Determine redirect destination
+    // This lets us deep link in to the flow whilst still going through this setup route
+    const defaultDestination = `/clinics/${req.params.clinicId}/events/${req.params.eventId}/identity`
+    const finalDestination = returnTo
+    ? `/clinics/${req.params.clinicId}/events/${req.params.eventId}/${returnTo}`
+    : defaultDestination
 
-    res.redirect(`/clinics/${req.params.clinicId}/events/${req.params.eventId}/identity`)
+    res.redirect(finalDestination)
+  })
+
+  // Leave appointment - revert status from in_progress back to checked_in
+  router.get('/clinics/:clinicId/events/:eventId/leave', (req, res) => {
+    const { clinicId, eventId } = req.params
+    const data = req.session.data
+    const event = getEvent(data, eventId)
+
+    // Only allow leaving if the event is currently in progress
+    if (event?.status === 'event_in_progress') {
+      // Save any temporary changes before leaving
+      saveTempEventToEvent(data)
+      saveTempParticipantToParticipant(data)
+
+      // Revert status back to checked in
+      updateEventStatus(data, eventId, 'event_checked_in')
+
+      // Clear session details
+      updateEventData(data, eventId, {
+        sessionDetails: {
+          startedAt: null,
+          startedBy: null
+        }
+      })
+
+      // Clear temporary session data (now safe since we've saved changes)
+      delete data.event
+      delete data.participant
+
+      console.log('Left appointment - saved temp data, reverted status to checked_in, and cleared temp data')
+
+      // req.flash('info', 'You have left the appointment. The participant remains checked in.')
+    }
+
+    // Use referrer chain for redirect, fallback to clinic view
+    const returnUrl = getReturnUrl(`/clinics/${clinicId}`, req.query.referrerChain)
+    res.redirect(returnUrl)
   })
 
   // Event within clinic context
   router.get('/clinics/:clinicId/events/:eventId', (req, res) => {
-    res.render('events/show', {
-    })
+    const { clinicId, eventId } = req.params
+    // res.render('events/show', {
+    // })
+    res.redirect(`/clinics/${clinicId}/events/${eventId}/appointment`)
   })
 
 
 
+
+
   router.post('/clinics/:clinicId/events/:eventId/personal-details/ethnicity-answer', (req, res) => {
     const { clinicId, eventId } = req.params
     const data = req.session.data
@@ -269,6 +323,8 @@ module.exports = router => {
     const data = req.session.data
     const previousMammogram = data.event?.previousMammogramTemp
     const action = req.body.action
+    const referrerChain = req.query.referrerChain
+    const scrollTo = req.query.scrollTo
 
     const mammogramAddedMessage = 'Previous mammogram added'
 
@@ -297,7 +353,11 @@ module.exports = router => {
       req.flash('success', mammogramAddedMessage)
 
       delete data.event?.previousMammogramTemp
-      return res.redirect(`/clinics/${clinicId}/events/${eventId}`)
+      // return res.redirect(`/clinics/${clinicId}/events/${eventId}`)
+
+      const returnUrl = getReturnUrl(`/clinics/${clinicId}/events/${eventId}`, referrerChain, scrollTo)
+
+      res.redirect(returnUrl)
     }
 
     // Handle the direct cancel action from appointment-should-not-proceed.html
@@ -339,7 +399,7 @@ module.exports = router => {
 
     // If recent mammogram detected and not already coming from warning page
     if (isRecentMammogram && action !== 'continue') {
-      return res.redirect(`/clinics/${clinicId}/events/${eventId}/previous-mammograms/appointment-should-not-proceed`)
+      return res.redirect(urlWithReferrer(`/clinics/${clinicId}/events/${eventId}/previous-mammograms/appointment-should-not-proceed`, referrerChain, scrollTo))
     }
 
     // Normal flow - save the mammogram
@@ -366,7 +426,9 @@ module.exports = router => {
 
     req.flash('success', mammogramAddedMessage)
 
-    res.redirect(`/clinics/${clinicId}/events/${eventId}`)
+    const returnUrl = getReturnUrl(`/clinics/${clinicId}/events/${eventId}`, referrerChain, scrollTo)
+    res.redirect(returnUrl)
+
   })
 
   // Helper function to check if mammogram was taken within the last 6 months

app/views/_components/check-in/macro.njk

@@ -0,0 +1,5 @@
+{# app/views/_includes/check-in/macro.njk #}
+
+{% macro appCheckIn(params) %}
+  {%- include './template.njk' -%}
+{% endmacro %}

app/views/_components/check-in/template.njk

@@ -0,0 +1,51 @@
+
+{# app/views/_components/check-in/template.njk #}
+
+{% from '_components/modal/macro.njk' import appModal %}
+{% from '_components/summary-list/macro.njk' import appSummaryList as summaryList %}
+{% from '_components/summary-list/macro.njk' import appSummaryListRow %}
+
+{# Build check-in href #}
+{% set checkInHref -%}
+  /clinics/{{ params.clinicId }}/check-in/{{ params.event.id }}
+{%- endset %}
+
+{# Check if identity confirmation is enabled #}
+{% set confirmIdentityEnabled = params.confirmIdentityOnCheckIn %}
+{% set statusTagId = params.statusTagId %}
+
+{% if confirmIdentityEnabled %}
+  {% set modalId = "check-in-modal-" + params.event.id %}
+   {% set statusTagId = params.statusTagId %}
+  {% include "_includes/confirm-identity-modal.njk" %}
+{% endif %}
+
+{# Only show check-in for scheduled events #}
+{% if params.event.status === 'event_scheduled' %}
+  {% set checkInText %}
+    Check in{{ (" " + (params.participant | getShortName)) | asVisuallyHiddenText if params.participant }}
+  {% endset %}
+
+  <p class="nhsuk-u-margin-bottom-2">
+    {% if confirmIdentityEnabled %}
+      {# Modal-based check-in #}
+      <a href=""
+        class="nhsuk-link nhsuk-link--no-visited-state"
+        data-status-tag-id="{{ statusTagId }}"
+        onclick="openModal('{{ modalId }}'); return false;">
+        {{ checkInText | safe }}
+      </a>
+    {% else %}
+      {# Direct check-in without identity confirmation #}
+      <a href="{{ checkInHref }}"
+        class="nhsuk-link nhsuk-link--no-visited-state js-check-in-link"
+        data-clinic-id="{{ params.clinicId }}"
+        data-event-id="{{ params.event.id }}"
+        data-status-tag-id="{{ statusTagId }}">
+        {{ checkInText | safe }}
+      </a>
+    {% endif %}
+  </p>
+
+
+{% endif %}