MAN-352 persist activity log filter values

server/@types/ActivityLog.type.ts

@@ -28,7 +28,6 @@ export interface ActivityLogFiltersResponse extends ActivityLogFilters {
   selectedFilterItems: SelectedFilterItem[]
   complianceOptions: Option[]
   baseUrl: string
-  query: ActivityLogFilters
   queryStr: string
   queryStrPrefix: string
   queryStrSuffix: string

server/middleware/filterActivityLog.ts

@@ -10,49 +10,14 @@ export const filterActivityLog: Route<void> = (req, res, next) => {
     return res.redirect(url)
   }
   const { crn } = req.params
-  const {
-    keywords = '',
-    dateFrom = '',
-    dateTo = '',
-    clearFilterKey,
-    clearFilterValue,
-  } = req.query as { [key: string]: string }
-
-  const { compliance: complianceQuery = [] } = req.query as { [key: string]: string | string[] }
-
+  const { keywords = '', dateFrom = '', dateTo = '', clearFilterKey, clearFilterValue } = req.query
+  const errors = req?.session?.errors
+  const { compliance: complianceQuery = [] } = req.query
   let compliance = complianceQuery as string[] | string
-
+  const baseUrl = `/case/${crn}/activity-log`
   if (!Array.isArray(compliance)) {
     compliance = [compliance]
   }
-
-  let query: ActivityLogFilters = { keywords, dateFrom, dateTo, compliance }
-  const hasQuery = keywords || (dateFrom && dateTo) || compliance?.length
-
-  if (req?.session?.cache?.activityLog?.filters && !req?.query?.submit && !hasQuery) {
-    query = req?.session?.cache?.activityLog?.filters
-  } else if (hasQuery) {
-    query = {
-      keywords,
-      dateFrom,
-      dateTo,
-      compliance,
-    }
-    req.session.cache = {
-      ...(req?.session?.cache || {}),
-      activityLog: {
-        ...(req?.session?.cache?.activityLog || {}),
-        filters: query,
-      },
-    }
-  }
-  query = { ...query, clearFilterKey, clearFilterValue }
-
-  const errors = req?.session?.errors
-  const baseUrl = `/case/${crn}/activity-log`
-  if (!Array.isArray(query.compliance)) {
-    query.compliance = [query.compliance]
-  }
   if (compliance?.length && clearFilterKey === 'compliance') {
     compliance = compliance.filter(value => value !== clearFilterValue)
   }
@@ -62,21 +27,19 @@ export const filterActivityLog: Route<void> = (req, res, next) => {
     { text: 'Not complied', value: 'not complied' },
   ]
   const filters: ActivityLogFilters = {
-    keywords: query.keywords && query.clearFilterKey !== 'keywords' ? query.keywords : '',
+    keywords: keywords && clearFilterKey !== 'keywords' ? (keywords as string) : '',
     dateFrom:
-      query.dateFrom && query.dateTo && !errors?.errorMessages?.dateFrom && query.clearFilterKey !== 'dateRange'
-        ? query.dateFrom
+      dateFrom && dateTo && !errors?.errorMessages?.dateFrom && clearFilterKey !== 'dateRange'
+        ? (dateFrom as string)
         : '',
     dateTo:
-      query.dateTo && query.dateFrom && !errors?.errorMessages?.dateTo && query.clearFilterKey !== 'dateRange'
-        ? query.dateTo
-        : '',
-    compliance: query.compliance,
+      dateTo && dateFrom && !errors?.errorMessages?.dateTo && clearFilterKey !== 'dateRange' ? (dateTo as string) : '',
+    compliance,
   }
 
   const getQueryString = (values: ActivityLogFilters | Record<string, string>): string => {
     const keys = [...Object.keys(filters)]
-    const queryStr: string = Object.entries(values)
+    let queryStr: string = Object.entries(values)
       .filter(([key, _value]) => keys.includes(key))
       .reduce((acc, [key, value]: [string, string | string[]], i) => {
         if (value) {
@@ -90,10 +53,13 @@ export const filterActivityLog: Route<void> = (req, res, next) => {
         }
         return acc
       }, '')
+    if (req?.query?.page) {
+      queryStr = `${queryStr}&page=${req.query.page}`
+    }
     return queryStr
   }
 
-  const queryStr = getQueryString(query)
+  const queryStr = getQueryString(req.query as Record<string, string>)
   const queryStrPrefix = queryStr ? '?' : ''
   const queryStrSuffix = queryStr ? '&' : '?'
   const redirectQueryStr = getQueryString(filters)
@@ -156,7 +122,6 @@ export const filterActivityLog: Route<void> = (req, res, next) => {
     selectedFilterItems,
     complianceOptions,
     baseUrl,
-    query,
     queryStr,
     queryStrPrefix,
     queryStrSuffix,

server/routes/activityLog.ts

@@ -66,6 +66,7 @@ export default function activityLogRoutes(router: Router, { hmppsAuthClient }: S
       res.render('pages/activity-log', {
         personActivity,
         crn,
+        query,
         queryParams,
         page,
         view,
@@ -145,7 +146,6 @@ export default function activityLogRoutes(router: Router, { hmppsAuthClient }: S
     ])
     const isActivityLog = true
     const queryParams = getQueryString(req.query)
-
     const { category } = req.query
 
     await auditService.sendAuditMessage({
@@ -173,14 +173,19 @@ export default function activityLogRoutes(router: Router, { hmppsAuthClient }: S
   })
 
   function getQueryString(params: Query): string[] {
+    console.log(params)
     const queryParams: string[] = []
-    if (params.view) {
-      queryParams.push(`view=${params.view}`)
+    const usedParams = ['view', 'requirement', 'keywords', 'dateFrom', 'dateTo', 'compliance', 'page']
+    for (const usedParam of usedParams) {
+      if (params[usedParam]) {
+        if (!Array.isArray(params[usedParam])) {
+          queryParams.push(`${usedParam}=${params[usedParam]}`)
+        } else {
+          params[usedParam].forEach(param => queryParams.push(`${usedParam}=${param}`))
+        }
+      }
     }
 
-    if (params.requirement) {
-      queryParams.push(`requirement=${params.requirement}`)
-    }
     return queryParams
   }
 }

server/views/pages/activity-log/_appointment-timeline-entry.njk

@@ -4,7 +4,7 @@
 
 {% set titleHtml %}
   <span class="govuk-heading-s govuk-!-margin-bottom-0">
-    <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}"">{{ entry.type }} at {{ entry.startDateTime | govukTime }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
+    <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}&{{filters.queryStr}}">{{ entry.type }} at {{ entry.startDateTime | govukTime }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
   </span>
 {% endset %}
 

server/views/pages/activity-log/_communication-timeline-entry.njk

@@ -1,5 +1,5 @@
 {% set titleHtml %}
-  <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}" class="govuk-!-font-weight-bold">{% include './_communication-title.njk' %} at&nbsp;{{ entry.startDateTime | govukTime }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
+  <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}&{{filters.queryStr}}" class="govuk-!-font-weight-bold">{% include './_communication-title.njk' %} at&nbsp;{{ entry.startDateTime | govukTime }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
 {% endset %}
 
 {% set html %}

server/views/pages/activity-log/_compact-timeline-entry.njk

@@ -4,7 +4,7 @@
 
 {% set titleHtml %}
   <p class="govuk-body govuk-!-margin-bottom-1" data-qa="timeline{{ loop.index }}Card">
-    <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=compact&requirement={{ requirement }}"">
+    <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=compact&requirement={{ requirement }}&{{filters.queryStr}}">
       {% if entry.isAppointment === true %}
         {{ appComplianceTag({ entry: entry, classes: 'govuk-!-margin-left-2', compact: true }) }}
         {{ entry.type }} at&nbsp;{{ entry.startDateTime | govukTime }}

server/views/pages/activity-log/_compact-view.njk

@@ -20,7 +20,7 @@
       <li>
         {% if entry.isSystemContact === true and entry.isAppointment === false and entry.isCommunication === false %}
           <div class="govuk-hint govuk-!-margin-bottom-1">
-            <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=compact&requirement={{ requirement }}"" class="app-!-inherit-colour">{{ entry.type }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
+            <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=compact&requirement={{ requirement }}&{{filters.queryStr}}" class="app-!-inherit-colour">{{ entry.type }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
           </div>
         {% else %}
           {% include "./_compact-timeline-entry.njk" %}

server/views/pages/activity-log/_filters.njk

@@ -18,7 +18,7 @@
         'data-qa': 'keywords'
       }
     },
-    value: filters.query.keywords
+    value: query.keywords
   }) }}
 {{ mojDatePicker({
   id: "dateFrom",
@@ -33,7 +33,7 @@
         'data-qa': 'date-from'
       }
     },
-    value: filters.query.dateFrom,
+    value: query.dateFrom,
     maxDate: filters.maxDate,
      errorMessage: {
       text: filters.errors.errorMessages.dateFrom.text
@@ -52,7 +52,7 @@
         'data-qa': 'date-to'
       }
   },
-  value: filters.query.dateTo,
+  value: query.dateTo,
   maxDate: filters.maxDate,
   errorMessage: {
     text: filters.errors.errorMessages.dateTo.text

server/views/pages/activity-log/_other-timeline-entry.njk

@@ -2,7 +2,7 @@
 {% set shouldPromptToRecordAnOutcome = entry.hasOutcome === false and entry.wasAbsent === false and hasAppointmentStartTimePassed and not entry.didTheyComply %}
 
 {% set titleHtml %}
-  <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}"" class="govuk-!-font-weight-bold">
+  <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}&{{filters.queryStr}}" class="govuk-!-font-weight-bold">
     {{ entry.type }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span>
   </a>
 {% endset %}

server/views/pages/activity-log/_switch-views.njk

@@ -1,14 +1,14 @@
   <ul class="toggle-menu govuk-!-margin-bottom-6">
   <li class="toggle-menu__list-item">
     {% if compactView %}
-      <a href="{{filters.baseUrl}}{{filters.queryStrPrefix}}{{filters.queryStr}}{{filters.queryStrSuffix}}requirement={{ requirement }}&page={{page}}">Default view</a>
+      <a href="{{filters.baseUrl}}{{filters.queryStrPrefix}}{{filters.queryStr}}{{filters.queryStrSuffix}}requirement={{ requirement }}}">Default view</a>
     {% else %}
       <span>Default view</span>
     {% endif %}
     </li>
  <li class="toggle-menu__list-item">
  {% if defaultView %}
-      <a href="{{filters.baseUrl}}{{filters.queryStrPrefix}}{{filters.queryStr}}{{filters.queryStrSuffix}}view=compact&requirement={{ requirement }}&page={{page}}">Compact view</a>
+      <a href="{{filters.baseUrl}}{{filters.queryStrPrefix}}{{filters.queryStr}}{{filters.queryStrSuffix}}view=compact&requirement={{ requirement }}">Compact view</a>
     {% else %}
       <span>Compact view</span>
     {% endif %}

server/views/pages/activity-log/_system-contact-timeline-entry.njk

@@ -1,6 +1,6 @@
 {% set titleHtml %}
  <span class="govuk-heading-s govuk-!-margin-bottom-0">
- <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}"" class="app-!-inherit-colour">{{ entry.type }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
+ <a href="/case/{{ crn }}/activity-log/activity/{{ entry.id }}?category={{ category }}&view=default&requirement={{ requirement }}&{{filters.queryStr}}" class="app-!-inherit-colour">{{ entry.type }}<span class="govuk-visually-hidden"> on {{ thisDate }}</span></a>
  </span>
 {% endset %}