CDPS-207: Empty states for address fields (#175)

server/data/localMockData/addressSummary.ts

@@ -0,0 +1,23 @@
+import { GovSummaryItem } from '../../interfaces/govSummaryItem'
+
+// eslint-disable-next-line import/prefer-default-export
+export const addressSummaryMock: GovSummaryItem[] = [
+  {
+    key: { text: 'Address' },
+    value: { html: 'Flat 7, premises address, street field<br/>Leeds<br/>West Yorkshire<br/>LS1 AAA<br/>England' },
+  },
+  {
+    key: { text: 'Type of address' },
+    value: { html: 'Discharge - Permanent Housing<br/>HDC Address<br/>Other' },
+  },
+  {
+    key: { text: 'Phone' },
+    value: { html: '4444555566<br/>0113444444<br/>0113 333444<br/>0800 222333' },
+  },
+  {
+    key: { text: 'Comment' },
+    value: {
+      text: 'comment field goes here.  comment field goes here.  comment field goes here.  comment field goes here.  comment field goes here.  comment field goes here.  comment field goes here.  comment field goes here.  comment field goes here.',
+    },
+  },
+]

server/interfaces/govSummaryItem.ts

@@ -1,6 +1,6 @@
 export interface GovSummaryItem {
   key: { text: string }
-  value: { text: string }
+  value: { text?: string; html?: string }
 }
 
 export interface GovSummaryGroup {

server/interfaces/pages/personalPage.ts

@@ -1,4 +1,5 @@
 import { Address } from '../address'
+import { GovSummaryItem } from '../govSummaryItem'
 
 export interface PersonalDetails {
   age: string
@@ -124,6 +125,7 @@ export interface PersonalPage {
   identityNumbers: IdentityNumbers
   property: PropertyItem[]
   addresses: Addresses
+  addressSummary: GovSummaryItem[]
   nextOfKin: NextOfKin[]
   physicalCharacteristics: PhysicalCharacteristics
   security: Security

server/services/personalPageService.test.ts

@@ -17,6 +17,7 @@ import { mockReasonableAdjustments } from '../data/localMockData/reasonableAdjus
 import { personalCareNeedsMock } from '../data/localMockData/personalCareNeedsMock'
 import { formatDate } from '../utils/dateHelpers'
 import { identifiersMock } from '../data/localMockData/identifiersMock'
+import { addressSummaryMock } from '../data/localMockData/addressSummary'
 
 describe('PersonalPageService', () => {
   let prisonApiClient: PrisonApiClient
@@ -231,7 +232,7 @@ describe('PersonalPageService', () => {
 
   describe('Addresses', () => {
     it('Maps the data from the API for the primary address', async () => {
-      const { addresses } = await new PersonalPageService(prisonApiClient).get(PrisonerMockDataA)
+      const { addresses, addressSummary } = await new PersonalPageService(prisonApiClient).get(PrisonerMockDataA)
       const expectedAddress = mockAddresses[0]
       const expectedPhones = ['4444555566', '0113444444', '0113 333444', '0800 222333']
       const expectedTypes = ['Discharge - Permanent Housing', 'HDC Address', 'Other']
@@ -251,6 +252,8 @@ describe('PersonalPageService', () => {
       expect(premise).toEqual(expectedAddress.premise)
       expect(street).toEqual(expectedAddress.street)
       expect(town).toEqual(expectedAddress.town)
+
+      expect(addressSummary).toEqual(addressSummaryMock)
     })
   })
 

server/services/personalPageService.ts

@@ -10,7 +10,7 @@ import {
   PropertyItem,
 } from '../interfaces/pages/personalPage'
 import { Prisoner } from '../interfaces/prisoner'
-import { formatName, yearsBetweenDateStrings } from '../utils/utils'
+import { addressToLines, formatName, yearsBetweenDateStrings } from '../utils/utils'
 import { getProfileInformationValue, ProfileInformationType } from '../interfaces/prisonApi/profileInformation'
 import {
   getOffenderIdentifierValue,
@@ -26,6 +26,7 @@ import { PropertyContainer } from '../interfaces/prisonApi/propertyContainer'
 import { ReferenceCode, ReferenceCodeDomain } from '../interfaces/prisonApi/referenceCode'
 import { formatDate } from '../utils/dateHelpers'
 import { getMostRecentAddress } from '../utils/getMostRecentAddress'
+import { GovSummaryItem } from '../interfaces/govSummaryItem'
 
 export default class PersonalPageService {
   private prisonApiClient: PrisonApiClient
@@ -42,7 +43,7 @@ export default class PersonalPageService {
       prisonerDetail,
       secondaryLanguages,
       property,
-      addresses,
+      addressList,
       contacts,
       healthReferenceCodes,
       healthTreatmentReferenceCodes,
@@ -59,11 +60,14 @@ export default class PersonalPageService {
       this.prisonApiClient.getIdentifiers(bookingId),
     ])
 
+    const addresses: Addresses = this.addresses(addressList)
+
     return {
       personalDetails: this.personalDetails(prisonerData, inmateDetail, prisonerDetail, secondaryLanguages),
       identityNumbers: this.identityNumbers(prisonerData, identifiers),
       property: this.property(property),
-      addresses: this.addresses(addresses),
+      addresses,
+      addressSummary: this.addressSummary(addresses),
       nextOfKin: await this.nextOfKin(contacts),
       physicalCharacteristics: this.physicalCharacteristics(prisonerData, inmateDetail),
       security: {
@@ -80,6 +84,33 @@ export default class PersonalPageService {
     }
   }
 
+  private addressSummary(addresses: Addresses): GovSummaryItem[] {
+    const addressSummary: GovSummaryItem[] = []
+
+    if (addresses) {
+      addressSummary.push({
+        key: { text: 'Address' },
+        value: { html: addressToLines(addresses.address).join('<br/>') },
+      })
+      addressSummary.push({
+        key: { text: 'Type of address' },
+        value: { html: addresses.addressTypes.join('<br/>') },
+      })
+      addressSummary.push({
+        key: { text: 'Phone' },
+        value: { html: addresses.phones?.length ? addresses.phones.join('<br/>') : 'Not entered' },
+      })
+      if (addresses.comment) {
+        addressSummary.push({
+          key: { text: 'Comment' },
+          value: { text: addresses.comment },
+        })
+      }
+    }
+
+    return addressSummary
+  }
+
   private personalDetails(
     prisonerData: Prisoner,
     inmateDetail: InmateDetail,
@@ -183,7 +214,7 @@ export default class PersonalPageService {
     return {
       isPrimaryAddress: !!mostRecentAddress,
       noFixedAddress: mostRecentAddress?.noFixedAddress,
-      comment: mostRecentAddress?.comment || '',
+      comment: mostRecentAddress?.comment,
       phones: mostRecentAddress?.phones.map(phone => phone.number) || [],
       addressTypes:
         mostRecentAddress?.addressUsages

server/views/partials/personalPage/addresses.njk

@@ -1,22 +1,5 @@
 {% from "../../macros/summaryCardMacro.njk" import summaryCard %}
 {% from "govuk/components/summary-list/macro.njk" import govukSummaryList %}
-{% if addresses %}
-{% set addressHtml %}
-  {% for line in addresses.address | addressToLines %}
-    {{ line }}<br />
-  {% endfor %}
-{% endset %}
-{% set phoneHtml %}
-  {% for number in addresses.phones %}
-    {{ number }}<br />
-  {% endfor %}
-{% endset %}
-{% set addressTypesHtml %}
-  {% for type in addresses.addressTypes %}
-    {{ type }}<br />
-  {% endfor %}
-{% endset %}
-{% endif %}
 {%- call summaryCard({title: "Addresses", id: "addresses"}) -%}
   <div class="govuk-grid-row" data-qa="addresses">
     <div class="govuk-grid-column-full">
@@ -25,12 +8,7 @@
       {% elseif addresses and addresses.isPrimaryAddress %}
       <p class="govuk-body">Primary</p>
       {{ govukSummaryList({
-          rows: [
-            { key: { text: "Address"}, value: { html: addressHtml } },
-            { key: { text: "Type of address"}, value: { html: addressTypesHtml } },
-            { key: { text: "Phone"}, value: { html: phoneHtml } },
-            { key: { text: "Comments"}, value: { text: addresses.comment } }
-          ]
+          rows: addressSummary
       }) }}
       <p class="govuk-body">Added on <span data-qa="address-added-on">{{ addresses.addedOn | formatDate }}</span></p>
       {% elseif addresses and not addresses.isPrimaryAddress %}