CDPS-80: Alerts - load data

assets/scss/pages/_alerts-page.scss

@@ -1,7 +1,6 @@
 .hmpps-action-header {
   display: flex;
-  justify-content: space-between;
-  align-items: flex-end;
+  justify-content: flex-end;
   margin: 0 0 30px 0;
 
   h2 {

cypress.config.ts

@@ -10,6 +10,7 @@ import pomApi from './integration_tests/mockApis/pom'
 import keyWorkerApi from './integration_tests/mockApis/keyWorker'
 
 export default defineConfig({
+  viewportWidth: 1152,
   chromeWebSecurity: false,
   fixturesFolder: 'integration_tests/fixtures',
   screenshotsFolder: 'integration_tests/screenshots',

integration_tests/e2e/alertsPage.cy.ts

@@ -0,0 +1,86 @@
+import Page from '../pages/page'
+import AlertsPage from '../pages/alertsPage'
+
+const visitAlertsPage = (): AlertsPage => {
+  cy.signIn({ redirectPath: '/prisoner/G6123VU/alerts' })
+  return Page.verifyOnPageWithTitle(AlertsPage, 'Active alerts')
+}
+
+const visitActiveAlertsPage = (): AlertsPage => {
+  cy.signIn({ redirectPath: '/prisoner/G6123VU/alerts/active' })
+  return Page.verifyOnPageWithTitle(AlertsPage, 'Active alerts')
+}
+
+const visitInactiveAlertsPage = (): AlertsPage => {
+  cy.signIn({ redirectPath: '/prisoner/G6123VU/alerts/inactive' })
+  return Page.verifyOnPageWithTitle(AlertsPage, 'Inactive alerts')
+}
+
+const visitEmptyAlertsPage = (): AlertsPage => {
+  cy.signIn({ redirectPath: '/prisoner/A1234BC/alerts/active' })
+  return Page.verifyOnPageWithTitle(AlertsPage, 'Active alerts')
+}
+
+context('Alerts Page', () => {
+  beforeEach(() => {
+    cy.task('reset')
+    cy.task('stubSignIn')
+    cy.task('stubAuthUser')
+  })
+
+  it('Active alerts page is displayed by default', () => {
+    visitAlertsPage()
+  })
+
+  context('Active Alerts', () => {
+    let alertsPage
+
+    beforeEach(() => {
+      cy.setupAlertsPageStubs({ prisonerNumber: 'G6123VU', bookingId: 1102484 })
+      alertsPage = visitActiveAlertsPage()
+    })
+
+    it('Displays the active alerts tab selected with correct count', () => {
+      alertsPage.selectedTab().contains('a', 'Active (80 alerts)')
+    })
+
+    it('Displays the list with 20 items', () => {
+      alertsPage.alertsList().children().should('have.length', 20)
+    })
+  })
+
+  context('Inactive Alerts', () => {
+    let alertsPage
+
+    beforeEach(() => {
+      cy.setupAlertsPageStubs({ prisonerNumber: 'G6123VU', bookingId: 1102484 })
+      alertsPage = visitInactiveAlertsPage()
+    })
+
+    it('Displays the inactive alerts tab selected with correct count', () => {
+      alertsPage.selectedTab().contains('a', 'Inactive (80 alerts)')
+    })
+
+    it('Displays the list with 20 items', () => {
+      alertsPage.alertsList().children().should('have.length', 20)
+    })
+  })
+
+  context('No Active Alerts', () => {
+    let alertsPage
+
+    beforeEach(() => {
+      cy.setupAlertsPageStubs({ prisonerNumber: 'A1234BC', bookingId: 1234567 })
+      alertsPage = visitEmptyAlertsPage()
+    })
+
+    it('Displays the active alerts tab selected with correct count', () => {
+      alertsPage.selectedTab().contains('a', 'Active (0 alerts)')
+    })
+
+    it('Displays the empty state message', () => {
+      alertsPage.alertsList().should('not.exist')
+      alertsPage.alertsEmptyState().should('contain', 'John Middle Names Saunders does not have any active alerts')
+    })
+  })
+})

integration_tests/index.d.ts

@@ -7,5 +7,6 @@ declare namespace Cypress {
     signIn(options?: { failOnStatusCode?: boolean; redirectPath?: string }): Chainable<AUTWindow>
     setupBannerStubs(options: { prisonerNumber: string }): Chainable<AUTWindow>
     setupOverviewPageStubs(options: { prisonerNumber: string; bookingId: string }): Chainable<AUTWindow>
+    setupAlertsPageStubs(options: { prisonerNumber: string; bookingId: number }): Chainable<AUTWindow>
   }
 }

integration_tests/mockApis/prison.ts

@@ -14,6 +14,11 @@ import { secondaryLanguagesMock } from '../../server/data/localMockData/secondar
 import { CaseNotesByTypeA } from '../../server/data/localMockData/caseNotes'
 import { offenderContact } from '../../server/data/localMockData/offenderContacts'
 import { mapToQueryString } from '../../server/utils/utils'
+import {
+  emptyAlertsMock,
+  pagedActiveAlertsMock,
+  pagedInactiveAlertsMock,
+} from '../../server/data/localMockData/pagedAlertsMock'
 
 const placeHolderImagePath = './../../assets/images/average-face.jpg'
 
@@ -171,50 +176,100 @@ export default {
     })
   },
 
-  stubInmateDetail: (bookingId: number) => {
+  stubPrisonerDetail: (prisonerNumber: string) => {
     return stubFor({
       request: {
         method: 'GET',
-        urlPattern: `/prison/api/bookings/${bookingId}`,
+        urlPattern: `/prison/api/prisoners/${prisonerNumber}`,
       },
       response: {
         status: 200,
         headers: {
           'Content-Type': 'application/json;charset=UTF-8',
         },
-        jsonBody: inmateDetailMock,
+        jsonBody: prisonerDetailMock,
       },
     })
   },
 
-  stubPrisonerDetail: (prisonerNumber: string) => {
+  stubSecondaryLanguages: (bookingId: number) => {
     return stubFor({
       request: {
         method: 'GET',
-        urlPattern: `/prison/api/prisoners/${prisonerNumber}`,
+        urlPattern: `/prison/api/bookings/${bookingId}/secondary-languages`,
       },
       response: {
         status: 200,
         headers: {
           'Content-Type': 'application/json;charset=UTF-8',
         },
-        jsonBody: prisonerDetailMock,
+        jsonBody: secondaryLanguagesMock,
       },
     })
   },
 
-  stubSecondaryLanguages: (bookingId: number) => {
+  stubActiveAlerts: (bookingId: number) => {
+    let jsonResp
+    if (bookingId === 1102484) {
+      jsonResp = pagedActiveAlertsMock
+    } else if (bookingId === 1234567) {
+      jsonResp = emptyAlertsMock
+    }
     return stubFor({
       request: {
         method: 'GET',
-        urlPattern: `/prison/api/bookings/${bookingId}/secondary-languages`,
+        urlPattern: `/prison/api/bookings/${bookingId}/alerts/v2\\?alertStatus=ACTIVE&size=20&sort=dateCreated%2CDESC`,
       },
       response: {
         status: 200,
         headers: {
           'Content-Type': 'application/json;charset=UTF-8',
         },
-        jsonBody: secondaryLanguagesMock,
+        jsonBody: jsonResp,
+      },
+    })
+  },
+
+  stubInactiveAlerts: (bookingId: number) => {
+    return stubFor({
+      request: {
+        method: 'GET',
+        urlPattern: `/prison/api/bookings/${bookingId}/alerts/v2\\?alertStatus=INACTIVE&size=20&sort=dateCreated%2CDESC`,
+      },
+      response: {
+        status: 200,
+        headers: {
+          'Content-Type': 'application/json;charset=UTF-8',
+        },
+        jsonBody: pagedInactiveAlertsMock,
+      },
+    })
+  },
+
+  stubInmateDetail: (bookingId: number) => {
+    let jsonResp
+    if (bookingId === 1102484) {
+      jsonResp = { ...inmateDetailMock, activeAlertCount: 80, inactiveAlertCount: 80 }
+    } else if (bookingId === 1234567) {
+      jsonResp = {
+        ...inmateDetailMock,
+        prisonerNumber: 'A1234BC',
+        bookingId: 1234567,
+        activeAlertCount: 0,
+        inactiveAlertCount: 0,
+      }
+    }
+    return stubFor({
+      request: {
+        method: 'GET',
+        urlPattern: `/prison/api/bookings/${bookingId}`,
+      },
+      response: {
+        status: 200,
+        headers: {
+          'Content-Type': 'application/json;charset=UTF-8',
+        },
+        jsonBody: jsonResp,
       },
     })
   },

integration_tests/mockApis/prisonerSearch.ts

@@ -3,6 +3,12 @@ import { PrisonerMockDataA } from '../../server/data/localMockData/prisoner'
 
 export default {
   stubPrisonerData: (prisonerNumber: string) => {
+    let jsonResp
+    if (prisonerNumber === 'G6123VU') {
+      jsonResp = PrisonerMockDataA
+    } else if (prisonerNumber === 'A1234BC') {
+      jsonResp = { ...PrisonerMockDataA, prisonerNumber: 'A1234BC', bookingId: 1234567 }
+    }
     return stubFor({
       request: {
         method: 'GET',
@@ -13,7 +19,7 @@ export default {
         headers: {
           'Content-Type': 'application/json;charset=UTF-8',
         },
-        jsonBody: PrisonerMockDataA,
+        jsonBody: jsonResp,
       },
     })
   },

integration_tests/pages/alertsPage.ts

@@ -0,0 +1,11 @@
+import Page, { PageElement } from './page'
+
+export default class AlertsPage extends Page {
+  h1 = (): PageElement => cy.get('h1')
+
+  selectedTab = (): PageElement => cy.get('.govuk-tabs__list-item.govuk-tabs__list-item--selected')
+
+  alertsList = (): PageElement => cy.get('.hmpps-alert-card-list')
+
+  alertsEmptyState = (): PageElement => cy.get('[data-qa=alerts-empty-state]')
+}

integration_tests/pages/page.ts

@@ -5,6 +5,10 @@ export default abstract class Page {
     return new constructor()
   }
 
+  static verifyOnPageWithTitle<T>(constructor: new (title: string) => T, title: string): T {
+    return new constructor(title)
+  }
+
   constructor(private readonly title: string) {
     this.checkOnPage()
   }

integration_tests/support/commands.ts

@@ -24,3 +24,10 @@ Cypress.Commands.add('setupOverviewPageStubs', ({ bookingId, prisonerNumber }) =
   cy.task('stubGetOffenderContacts', bookingId)
   cy.task('stubEventsForProfileImage', prisonerNumber)
 })
+
+Cypress.Commands.add('setupAlertsPageStubs', ({ bookingId, prisonerNumber }) => {
+  cy.task('stubPrisonerData', prisonerNumber)
+  cy.task('stubActiveAlerts', bookingId)
+  cy.task('stubInactiveAlerts', bookingId)
+  cy.task('stubInmateDetail', bookingId)
+})

server/data/enums/nameFormatStyle.ts

@@ -0,0 +1,6 @@
+// eslint-disable-next-line no-shadow,import/prefer-default-export
+export enum NameFormatStyle {
+  firstMiddleLast,
+  lastCommaFirstMiddle,
+  lastCommaFirst,
+}

server/data/interfaces/prisonApiClient.ts

@@ -13,6 +13,7 @@ import { PrisonerDetail } from '../../interfaces/prisonerDetail'
 import { InmateDetail } from '../../interfaces/prisonApi/inmateDetail'
 import { PersonalCareNeeds } from '../../interfaces/personalCareNeeds'
 import { SecondaryLanguage } from '../../interfaces/prisonApi/secondaryLanguage'
+import { PagedAlerts, PagedAlertsOptions } from '../../interfaces/prisonApi/pagedAlerts'
 
 export interface PrisonApiClient {
   getUserLocations(): Promise<Location[]>
@@ -30,4 +31,5 @@ export interface PrisonApiClient {
   getInmateDetail(bookingId: number): Promise<InmateDetail>
   getPersonalCareNeeds(bookingId: number, types?: string[]): Promise<PersonalCareNeeds>
   getSecondaryLanguages(bookingId: number): Promise<SecondaryLanguage[]>
+  getAlerts(bookingId: number, options: PagedAlertsOptions): Promise<PagedAlerts>
 }