WIP: feature/change-consent-detail-to-read-only

src/client/modules/Contacts/ContactDetails/ConsentDetails.jsx

@@ -0,0 +1,69 @@
+import React from 'react'
+import { isNil } from 'lodash'
+
+import { SectionHeader } from '../../../components'
+import { transformContactConsents } from './transformers'
+
+const ConsentText = ({ consent }) => {
+  const message = (domain, topicNames, consentGiven) => {
+    let consentedMessage = `This contact has ${consentGiven ? 'given' : 'not given'} consent to ${domain}`
+    if (!topicNames) {
+      return ''
+    } else if (topicNames.length == 1) {
+      consentedMessage += ` and topic ${topicNames[0]}`
+    } else if (topicNames.length > 1) {
+      consentedMessage += ` and topics: ${topicNames.join(', ')}`
+    }
+    return consentedMessage + '.'
+  }
+
+  const topicsWithNames = (topics) =>
+    topics.length > 0
+      ? topics.filter((topic) => topic.name).map((topic) => topic.name)
+      : undefined
+
+  const consentedTopicNames = topicsWithNames(consent.consentedTopics)
+  const notConsentedTopicNames = topicsWithNames(consent.notConsentedTopics)
+
+  const consentedMessage = message(consent.domain, consentedTopicNames, true)
+  const notConsentedMessage = message(
+    consent.domain,
+    notConsentedTopicNames,
+    false
+  )
+
+  const finalMessage = []
+  if (consentedMessage) {
+    finalMessage.push(consentedMessage)
+  }
+  if (notConsentedMessage) {
+    if (consentedMessage) {
+      finalMessage.push(' ')
+    }
+    finalMessage.push(notConsentedMessage)
+  }
+
+  return <p>{finalMessage.join('')}</p>
+}
+
+const ConsentDetails = ({ contact }) => {
+  const consents = transformContactConsents(contact)
+  return (
+    <div>
+      <SectionHeader type="contact-consent">Contact consents</SectionHeader>
+      {isNil(consents) ? (
+        <p data-test="no-contact-consents">
+          There is no consent data available for this contact
+        </p>
+      ) : (
+        <>
+          {consents.map((consent) => {
+            return <ConsentText consent={consent} />
+          })}
+        </>
+      )}
+    </div>
+  )
+}
+
+export default ConsentDetails

src/client/modules/Contacts/ContactDetails/ContactDetails.jsx

@@ -16,6 +16,7 @@ import {
 import { ID, TASK_ARCHIVE_CONTACT } from './state'
 import ArchiveForm from '../../../components/ArchiveForm'
 import ContactLayout from '../../../components/Layout/ContactLayout'
+import ConsentDetails from './ConsentDetails'
 
 const getAddress = (contact, companyAddress) => {
   const address = contact.addressSameAsCompany
@@ -103,6 +104,8 @@ const ContactDetails = ({ contactId, companyAddress, permissions }) => (
             </Button>
           ) : null}
 
+          <ConsentDetails contact={contact} />
+
           <ArchiveForm
             id={ID}
             submissionTaskName={TASK_ARCHIVE_CONTACT}

src/client/modules/Contacts/ContactDetails/__test__/transformers.test.js

@@ -0,0 +1,76 @@
+import 'core-js/proposals/array-grouping-v2'
+import { transformContactConsents } from '../transformers'
+
+describe('transformContactConsents', () => {
+  context('When a falsey contact is passed', () => {
+    it('Should return undefined', () => {
+      expect(transformContactConsents(undefined)).to.be.undefined
+    })
+  })
+
+  context('When a contact has no consent data', () => {
+    it('Should return undefined', () => {
+      expect(transformContactConsents({})).to.be.undefined
+    })
+  })
+
+  context('When a contact with a single unique value for domain', () => {
+    it('Should return a single domain with a single topic', () => {
+      expect(
+        transformContactConsents({
+          consentData: [
+            {
+              topic: 'Topic 1',
+              sourceSystem: 'System A',
+              consentDomain: 'International',
+              emailContactConsent: false,
+              telephoneContactConsent: false,
+            },
+          ],
+        })
+      ).to.deep.equal([
+        {
+          domain: 'International',
+          consentedTopics: [],
+          notConsentedTopics: [{ consent: false, name: 'Topic 1' }],
+        },
+      ])
+    })
+  })
+
+  context('When a contact has multiple values for domain', () => {
+    it('Should return a single domain with multiple topics', () => {
+      expect(
+        transformContactConsents({
+          consentData: [
+            {
+              topic: 'Topic 1',
+              sourceSystem: 'System A',
+              consentDomain: 'International',
+              emailContactConsent: false,
+              telephoneContactConsent: false,
+            },
+            {
+              topic: 'Topic 2',
+              sourceSystem: 'System A',
+              consentDomain: 'International',
+              emailContactConsent: false,
+              telephoneContactConsent: true,
+            },
+          ],
+        })
+      ).to.deep.equal([
+        {
+          domain: 'International',
+          consentedTopics: [
+            {
+              consent: true,
+              name: 'Topic 2',
+            },
+          ],
+          notConsentedTopics: [{ consent: false, name: 'Topic 1' }],
+        },
+      ])
+    })
+  })
+})

src/client/modules/Contacts/ContactDetails/transformers.js

@@ -0,0 +1,30 @@
+export const transformContactConsents = (contact) => {
+  if (!contact || !contact.consentData) {
+    return undefined
+  }
+
+  const domainGroupedConsent = Object.groupBy(
+    contact.consentData,
+    ({ consentDomain }) => consentDomain
+  )
+
+  return Object.entries(domainGroupedConsent).map((domain) => ({
+    domain: domain[0],
+    consentedTopics: domain[1]
+      .filter(
+        (topic) => topic.emailContactConsent || topic.telephoneContactConsent
+      )
+      .map((topic) => ({
+        consent: true,
+        name: topic.topic,
+      })),
+    notConsentedTopics: domain[1]
+      .filter(
+        (topic) => !topic.emailContactConsent && !topic.telephoneContactConsent
+      )
+      .map((topic) => ({
+        consent: false,
+        name: topic.topic,
+      })),
+  }))
+}