Navigate to placeholder occupancy view

e2e/pages/match/occupancyViewScreen.ts

@@ -0,0 +1,15 @@
+import { Page, expect } from '@playwright/test'
+import { BasePage } from '../basePage'
+import { Premises } from '../../../server/@types/shared'
+
+export class OccupancyViewScreen extends BasePage {
+  static async initialize(page: Page, premisesName: Premises['name']) {
+    await expect(page.locator('h1')).toContainText(`View spaces in ${premisesName}`)
+
+    return new OccupancyViewScreen(page)
+  }
+
+  async clickContinue() {
+    await this.page.getByRole('link', { name: 'Continue' }).first().click()
+  }
+}

e2e/steps/match.ts

@@ -1,22 +1,12 @@
 import { Page } from '@playwright/test'
 import { visitDashboard } from './apply'
-import { ConfirmPage, ConfirmationPage } from '../pages/match'
 import { E2EDatesOfPlacement } from './assess'
 import { ListPage, PlacementRequestPage } from '../pages/workflow'
 import { ApprovedPremisesApplication as Application, Premises } from '../../server/@types/shared'
 import { ApTypeLabel } from '../../server/utils/apTypeLabels'
 import { SearchScreen } from '../pages/match/searchScreen'
 import { BookingScreen } from '../pages/match/bookingScreen'
-
-export const confirmBooking = async (page: Page) => {
-  const confirmPage = new ConfirmPage(page)
-  await confirmPage.clickConfirm()
-}
-
-export const shouldShowBookingConfirmation = async (page: Page) => {
-  const confirmationPage = new ConfirmationPage(page)
-  await confirmationPage.shouldShowSuccessMessage()
-}
+import { OccupancyViewScreen } from '../pages/match/occupancyViewScreen'
 
 export const matchAndBookApplication = async ({
   applicationId,
@@ -79,6 +69,11 @@ export const matchAndBookApplication = async ({
   const premisesName = await searchScreen.retrieveFirstAPName()
   await searchScreen.selectFirstAP()
 
+  // Then I should see the occupancy view screen for that AP
+  const occupancyViewScreen = await OccupancyViewScreen.initialize(page, premisesName)
+  // And I continue to booking
+  await occupancyViewScreen.clickContinue()
+
   // Then I should see the booking screen for that AP
   const bookingScreen = await BookingScreen.initialize(page, premisesName)
 

server/controllers/match/index.ts

@@ -3,6 +3,7 @@
 import PlacementRequestController from './placementRequestsController'
 import SpaceSearchController from './search/spaceSearchController'
 import BookingsController from './placementRequests/bookingsController'
+import OccupancyViewController from './placementRequests/occupancyViewController'
 import SpaceBookingsController from './placementRequests/spaceBookingsController'
 
 import type { Services } from '../../services'
@@ -18,11 +19,13 @@ export const controllers = (services: Services) => {
   const spaceSearchController = new SpaceSearchController(spaceService, placementRequestService)
   const placementRequestBookingsController = new BookingsController(placementRequestService)
   const spaceBookingsController = new SpaceBookingsController(placementRequestService, spaceService)
+  const occupancyViewController = new OccupancyViewController(placementRequestService)
 
   return {
     placementRequestController,
     spaceSearchController,
     placementRequestBookingsController,
     spaceBookingsController,
+    occupancyViewController,
   }
 }

server/controllers/match/placementRequests/occupancyViewController.test.ts

@@ -0,0 +1,62 @@
+import type { NextFunction, Request, Response } from 'express'
+import { DeepMocked, createMock } from '@golevelup/ts-jest'
+
+import { PlacementRequestService } from '../../../services'
+import { personFactory, placementRequestDetailFactory } from '../../../testutils/factories'
+import OccupancyViewController from './occupancyViewController'
+
+describe('OccupancyViewController', () => {
+  const token = 'SOME_TOKEN'
+
+  const request: DeepMocked<Request> = createMock<Request>({ user: { token } })
+  const response: DeepMocked<Response> = createMock<Response>({})
+  const next: DeepMocked<NextFunction> = createMock<NextFunction>({})
+
+  const placementRequestService = createMock<PlacementRequestService>({})
+
+  let occupancyViewController: OccupancyViewController
+
+  beforeEach(() => {
+    jest.resetAllMocks()
+    occupancyViewController = new OccupancyViewController(placementRequestService)
+  })
+
+  describe('view', () => {
+    it('should render the occupancy view template', async () => {
+      const person = personFactory.build({ name: 'John Wayne' })
+      const placementRequestDetail = placementRequestDetailFactory.build({ person })
+      const startDate = '2024-07-26'
+      const durationDays = '40'
+      const premisesName = 'Hope House'
+      const premisesId = 'abc123'
+      const apType = 'esap'
+
+      placementRequestService.getPlacementRequest.mockResolvedValue(placementRequestDetail)
+
+      const query = {
+        startDate,
+        durationDays,
+        premisesName,
+        premisesId,
+        apType,
+      }
+
+      const params = { id: placementRequestDetail.id }
+
+      const requestHandler = occupancyViewController.view()
+
+      await requestHandler({ ...request, params, query }, response, next)
+
+      expect(response.render).toHaveBeenCalledWith('match/placementRequests/occupancyView/view', {
+        pageHeading: `View spaces in ${premisesName}`,
+        placementRequest: placementRequestDetail,
+        premisesName,
+        premisesId,
+        apType,
+        startDate,
+        durationDays,
+      })
+      expect(placementRequestService.getPlacementRequest).toHaveBeenCalledWith(token, placementRequestDetail.id)
+    })
+  })
+})

server/controllers/match/placementRequests/occupancyViewController.ts

@@ -0,0 +1,29 @@
+import type { Request, Response, TypedRequestHandler } from 'express'
+import { ApType } from '@approved-premises/api'
+import { PlacementRequestService } from '../../../services'
+
+interface NewRequest extends Request {
+  params: { id: string }
+  query: { startDate: string; durationDays: string; premisesName: string; premisesId: string; apType: ApType }
+}
+
+export default class {
+  constructor(private readonly placementRequestService: PlacementRequestService) {}
+
+  view(): TypedRequestHandler<Request, Response> {
+    return async (req: NewRequest, res: Response) => {
+      const placementRequest = await this.placementRequestService.getPlacementRequest(req.user.token, req.params.id)
+      const { startDate, durationDays, premisesName, premisesId, apType } = req.query
+
+      res.render('match/placementRequests/occupancyView/view', {
+        pageHeading: `View spaces in ${premisesName}`,
+        placementRequest,
+        premisesName,
+        premisesId,
+        apType,
+        startDate,
+        durationDays,
+      })
+    }
+  }
+}

server/paths/match.ts

@@ -13,6 +13,7 @@ const v2Match = {
     },
     spaceBookings: {
       new: v2SpaceBookingsPath.path('new'),
+      viewSpaces: v2SpaceBookingsPath.path('view-spaces'),
       create: v2SpaceBookingsPath,
     },
   },

server/routes/match.ts

@@ -17,6 +17,7 @@ export default function routes(controllers: Controllers, router: Router, service
     spaceSearchController,
     placementRequestBookingsController,
     spaceBookingsController,
+    occupancyViewController,
   } = controllers
 
   get(paths.placementRequests.show.pattern, placementRequestController.show(), { auditEvent: 'SHOW_PLACEMENT_REQUEST' })
@@ -46,6 +47,10 @@ export default function routes(controllers: Controllers, router: Router, service
     auditEvent: 'NEW_SPACE_BOOKING',
   })
 
+  get(paths.v2Match.placementRequests.spaceBookings.viewSpaces.pattern, occupancyViewController.view(), {
+    auditEvent: 'OCCUPANCY_VIEW',
+  })
+
   post(paths.v2Match.placementRequests.spaceBookings.create.pattern, spaceBookingsController.create(), {
     auditEvent: 'CREATE_SPACE_BOOKING',
   })

server/utils/match/index.test.ts

@@ -38,6 +38,7 @@ import {
   placementRequestSummaryListForMatching,
   postcodeRow,
   premisesNameRow,
+  redirectToSpaceBookingsNew,
   requirementsHtmlString,
   spaceBookingPersonNeedsSummaryCardRows,
   spaceBookingPremisesSummaryCardRows,
@@ -272,6 +273,39 @@ describe('matchUtils', () => {
     })
   })
 
+  describe('Continue to Occupancy View', () => {
+    it('returns a link to the Occupancy View page', () => {
+      const placementRequestId = '123'
+      const premisesName = 'Hope House'
+      const premisesId = 'abc'
+      const apType = 'pipe'
+      const startDate = '2022-01-01'
+      const durationDays = '1'
+
+      redirectToSpaceBookingsNew({
+        placementRequestId,
+        premisesName,
+        premisesId,
+        apType,
+        startDate,
+        durationDays,
+      })
+
+      expect(
+        `${paths.v2Match.placementRequests.spaceBookings.viewSpaces({ id: placementRequestId })}${createQueryString(
+          {
+            premisesName,
+            premisesId,
+            apType,
+            startDate,
+            durationDays,
+          },
+          { addQueryPrefix: true },
+        )}`,
+      )
+    })
+  })
+
   describe('confirmationSummaryCardRows', () => {
     it('should call the correct row functions', () => {
       const spaceSearchResult = spaceSearchResultFactory.build()

server/utils/match/index.ts

@@ -84,6 +84,33 @@ export const summaryCardLink = ({
   apType: string
   startDate: string
   durationDays: string
+}): string => {
+  return `${matchPaths.v2Match.placementRequests.spaceBookings.viewSpaces({ id: placementRequestId })}${createQueryString(
+    {
+      premisesName,
+      premisesId,
+      apType,
+      startDate,
+      durationDays,
+    },
+    { addQueryPrefix: true },
+  )}`
+}
+
+export const redirectToSpaceBookingsNew = ({
+  placementRequestId,
+  premisesName,
+  premisesId,
+  apType,
+  startDate,
+  durationDays,
+}: {
+  placementRequestId: string
+  premisesName: string
+  premisesId: string
+  apType: string
+  startDate: string
+  durationDays: string
 }): string => {
   return `${matchPaths.v2Match.placementRequests.spaceBookings.new({ id: placementRequestId })}${createQueryString(
     {

server/views/match/placementRequests/occupancyView/view.njk

@@ -0,0 +1,21 @@
+{% from "govuk/components/summary-list/macro.njk" import govukSummaryList %}
+{% from "govuk/components/button/macro.njk" import govukButton %}
+{% from "govuk/components/back-link/macro.njk" import govukBackLink %}
+
+{% extends "../../layout-with-details.njk" %}
+
+{% set pageTitle = applicationName + " - " + pageHeading %}
+
+{% block beforeContent %}
+    {{ govukBackLink({
+        text: "Back to other APs",
+        href: paths.v2Match.placementRequests.search.spaces({ id: placementRequest.id })
+    }) }}
+{% endblock %}
+
+{% block content %}
+    <h1 class="govuk-heading-l">{{ pageHeading }}</h1>
+    <a class="govuk-button" href="{{ MatchUtils.redirectToSpaceBookingsNew({placementRequestId: placementRequest.id, premisesName: premisesName, premisesId: premisesId, apType: apType, startDate: startDate, durationDays: durationDays }) }}">
+        Continue
+    </a>
+{% endblock %}