CLS2-1299 Show edit history on EYB leads

src/apps/routers.js

@@ -138,6 +138,7 @@ const reactRoutes = [
   '/investments/projects/:projectId/propositions/:propositionId/document',
   '/investments/eyb-leads',
   '/investments/eyb-leads/:eybLeadId/details',
+  '/investments/eyb-leads/:eybLeadId/edit-history',
   '/companies/:companyId/referrals/send',
   '/companies/:companyId/referrals/:referralId',
   '/contacts/:contactId/details',

src/client/components/AuditHistory/index.jsx

@@ -18,8 +18,9 @@
   fieldMapper = transformFieldName,
   excludedFields = [],
   auditType,
+  showSort = true,
 }) => (
-  <Rsrc.Paginated id={id}>
+  <Rsrc.Paginated showSort={showSort} id={id}>
     {(items) => (
       <ul>
         {transformAuditResponseToCollection(
@@ -68,6 +69,10 @@
    * The type of record. This is displayed as part of the 'no changes saved' text.
    */
   auditType: PropTypes.string.isRequired,
+  /**
+   * An option to show / hide the sort options. This is true by default.
+   */
+  showSort: PropTypes.bool,
 }
 
 export default AuditHistory

src/client/components/CollectionList/CollectionSort.jsx

@@ -12,23 +12,29 @@ const StyledSpan = styled('span')`
   color: ${DARK_GREY};
 `
 
-const CollectionSort = ({ sortOptions, totalPages, ...props }) => {
-  const actions = sortOptions ? (
-    <RoutedSelect
-      data-test="sortby"
-      name="sortBy"
-      qsParamName="sortby"
-      label="Sort by"
-    >
-      {sortOptions.map(({ name, value }, i) => {
-        return (
-          <option value={value} key={i}>
-            {name}
-          </option>
-        )
-      })}
-    </RoutedSelect>
-  ) : null
+const CollectionSort = ({
+  sortOptions,
+  totalPages,
+  showSort = true,
+  ...props
+}) => {
+  const actions =
+    sortOptions && showSort ? (
+      <RoutedSelect
+        data-test="sortby"
+        name="sortBy"
+        qsParamName="sortby"
+        label="Sort by"
+      >
+        {sortOptions.map(({ name, value }, i) => {
+          return (
+            <option value={value} key={i}>
+              {name}
+            </option>
+          )
+        })}
+      </RoutedSelect>
+    ) : null
 
   const location = useLocation()
 

src/client/components/Resource/EYBLeadAuditHistory.js

@@ -0,0 +1,6 @@
+import { createCollectionResource } from './Resource'
+
+export default createCollectionResource(
+  'Changes to EYB lead details',
+  (id) => `v4/investment-lead/eyb/${id}/audit`
+)

src/client/components/Resource/Paginated.js

@@ -104,6 +104,7 @@
     shouldPluralize,
     noResults = "You don't have any results",
     addItemUrl,
+    showSort = true,
   }) => {
     // We know better than ESLint that we are in deed in a React component
     // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -120,7 +121,6 @@
           const routePage = parseInt(qsParams.page, 10) || 1
           const totalPages = result ? Math.ceil(result.count / pageSize) : 0
           const hasZeroResults = result?.count === 0
-
           const task = getTask(name, id)
 
           return (
@@ -161,6 +161,7 @@
                       totalPages={totalPages}
                       sortOptions={sortOptions}
                       qsParamName={sortByQsParamName}
+                      showSort={showSort}
                     />
                   )}
                   {result ? children(result.results) : null}

src/client/components/Resource/Resource.jsx

@@ -233,7 +233,9 @@ export const createCollectionResource = (name, endpoint) => {
   Component.taskName = name
   Component.resourceName = name
 
-  Component.Paginated = (props) => <PaginatedResource {...props} name={name} />
+  Component.Paginated = ({ showSort = true, ...props }) => (
+    <PaginatedResource {...props} name={name} showSort={showSort} />
+  )
 
   return Component
 }

src/client/components/Resource/index.jsx

@@ -27,6 +27,7 @@ export { default as ExportExperienceCategoriesResource } from './ExportExperienc
 export { default as ExportResource } from './Export'
 export { default as ExportYearsResource } from './ExportYears'
 export { default as EYBLeadResource } from './EYBLead'
+export { default as EYBLeadAuditHistoryResource } from './EYBLeadAuditHistory'
 export { default as FDITypesResource } from './FDITypes'
 export { default as FDIValuesResource } from './FDIValues'
 export { default as HQTeamRegionOrPostsResource } from './HQTeamRegionOrPost'

src/client/components/Resource/tasks.js

@@ -99,6 +99,7 @@ import EvidenceTag from './EvidenceTag'
 import ProjectAuditHistory from './ProjectAuditHistory'
 import WinUKRegions from './WinUKRegions'
 import Referral from './Referral'
+import EYBLeadAuditHistory from './EYBLeadAuditHistory'
 
 export default {
   ...AssociatedProgramme.tasks,
@@ -202,4 +203,5 @@ export default {
   ...EvidenceTag.tasks,
   ...ProjectAuditHistory.tasks,
   ...Referral.tasks,
+  ...EYBLeadAuditHistory.tasks,
 }

src/client/modules/Companies/CompanyBusinessDetails/CompanyEditHistory/CompanyEditHistory.jsx

@@ -51,6 +51,7 @@ const CompanyEditHistory = () => {
         fieldMapper={mapFieldNameToLabel}
         excludedFields={EXCLUDED_FIELDS}
         auditType="business details"
+        showSort={false}
       />
     </DefaultLayout>
   )

src/client/modules/Contacts/ContactAuditHistory/ContactAuditHistory.jsx

@@ -19,6 +19,7 @@ const ContactAuditHistory = () => {
         fieldMapper={mapFieldNameToLabel}
         excludedFields={EXCLUDED_FIELDS}
         auditType="the contact"
+        showSort={false}
       />
     </ContactLayout>
   )

src/client/modules/Investments/EYBLeads/EYBLeadDetails.jsx

@@ -1,6 +1,9 @@
 import React from 'react'
 import { useParams } from 'react-router-dom'
 import { Link } from 'govuk-react'
+import styled from 'styled-components'
+
+import { SPACING_POINTS } from '@govuk-react/constants'
 
 import { formatDate, DATE_FORMAT_COMPACT } from '../../../utils/date-utils'
 import urls from '../../../../lib/urls'
@@ -13,103 +16,124 @@ import { EYBLeadLayout, NewWindowLink, SummaryTable } from '../../../components'
 import { NOT_SET_TEXT } from '../../../../apps/companies/constants'
 import { VALUES_VALUE_TO_LABEL_MAP } from './constants'
 
+const StyledRoot = styled('div')`
+  {
+    margin-top: ${SPACING_POINTS[4]}px;
+    margin-bottom: ${SPACING_POINTS[4]}px;
+  }
+`
 const EYBLeadDetails = () => {
   const { eybLeadId } = useParams()
   return (
     <EYBLeadLayout id={eybLeadId}>
       <EYBLeadResource id={eybLeadId}>
         {(eybLead) => {
           return (
-            <SummaryTable data-test="eyb-lead-details-table">
-              {eybLead.company ? (
-                <SummaryTable.TextRow
-                  heading="Company name"
-                  value={
-                    <Link
-                      href={urls.companies.overview.index(eybLead.company?.id)}
-                      data-test="company-link"
+            <>
+              <StyledRoot>
+                <div>
+                  Changes made to this information can be found on the{' '}
+                  <Link href={urls.investments.eybLeads.editHistory(eybLeadId)}>
+                    Edit history page
+                  </Link>
+                  .
+                </div>
+              </StyledRoot>
+              <SummaryTable data-test="eyb-lead-details-table">
+                {eybLead.company ? (
+                  <SummaryTable.TextRow
+                    heading="Company name"
+                    value={
+                      <Link
+                        href={urls.companies.overview.index(
+                          eybLead.company?.id
+                        )}
+                        data-test="company-link"
+                      >
+                        {eybLead.company.name}
+                      </Link>
+                    }
+                  />
+                ) : (
+                  <SummaryTable.TextRow
+                    heading="Company name"
+                    value={eybLead.companyName}
+                  />
+                )}
+                <SummaryTable.Row
+                  heading="Value"
+                  children={VALUES_VALUE_TO_LABEL_MAP[eybLead.isHighValue]}
+                />
+                <SummaryTable.Row
+                  heading="Sector or industry"
+                  children={eybLead.sector ? eybLead.sector.name : NOT_SET_TEXT}
+                />
+                <SummaryTable.Row
+                  heading="Location of company headquarters"
+                  children={eybLead.address?.country?.name}
+                />
+                <SummaryTable.Row
+                  heading="Submitted to EYB"
+                  children={formatDate(
+                    eybLead.triageCreated,
+                    DATE_FORMAT_COMPACT
+                  )}
+                />
+                <SummaryTable.Row heading="Company website address">
+                  {eybLead.companyWebsite ? (
+                    <NewWindowLink
+                      data-test="website-link"
+                      href={'//' + eybLead.companyWebsite}
                     >
-                      {eybLead.company.name}
-                    </Link>
+                      {eybLead.companyWebsite}
+                    </NewWindowLink>
+                  ) : (
+                    NOT_SET_TEXT
+                  )}
+                </SummaryTable.Row>
+                <SummaryTable.Row
+                  heading="When do you want to set up?"
+                  children={convertEYBChoicesToLabels(eybLead.landingTimeframe)}
+                />
+                <SummaryTable.Row
+                  heading="Do you know where you want to set up in the UK?"
+                  children={
+                    eybLead.proposedInvestmentLocationNone ? 'No' : 'Yes'
                   }
                 />
-              ) : (
-                <SummaryTable.TextRow
-                  heading="Company name"
-                  value={eybLead.companyName}
+                <SummaryTable.Row
+                  heading="Where do you want to set up in the UK?"
+                  children={formatProposedInvestmentCity(
+                    eybLead.proposedInvestmentCity
+                  )}
                 />
-              )}
-              <SummaryTable.Row
-                heading="Value"
-                children={VALUES_VALUE_TO_LABEL_MAP[eybLead.isHighValue]}
-              />
-              <SummaryTable.Row
-                heading="Sector or industry"
-                children={eybLead.sector ? eybLead.sector.name : NOT_SET_TEXT}
-              />
-              <SummaryTable.Row
-                heading="Location of company headquarters"
-                children={eybLead.address?.country?.name}
-              />
-              <SummaryTable.Row
-                heading="Submitted to EYB"
-                children={formatDate(
-                  eybLead.triageCreated,
-                  DATE_FORMAT_COMPACT
-                )}
-              />
-              <SummaryTable.Row heading="Company website address">
-                {eybLead.companyWebsite ? (
-                  <NewWindowLink
-                    data-test="website-link"
-                    href={'//' + eybLead.companyWebsite}
-                  >
-                    {eybLead.companyWebsite}
-                  </NewWindowLink>
-                ) : (
-                  NOT_SET_TEXT
-                )}
-              </SummaryTable.Row>
-              <SummaryTable.Row
-                heading="When do you want to set up?"
-                children={convertEYBChoicesToLabels(eybLead.landingTimeframe)}
-              />
-              <SummaryTable.Row
-                heading="Do you know where you want to set up in the UK?"
-                children={eybLead.proposedInvestmentLocationNone ? 'No' : 'Yes'}
-              />
-              <SummaryTable.Row
-                heading="Where do you want to set up in the UK?"
-                children={formatProposedInvestmentCity(
-                  eybLead.proposedInvestmentCity
-                )}
-              />
-              <SummaryTable.Row
-                heading="How do you plan to expand your business in the UK?"
-                children={convertEYBChoicesToLabels(eybLead.intent)}
-              />
-              <SummaryTable.Row
-                heading="How many people do you want to hire in the UK in the first 3 years?"
-                children={convertEYBChoicesToLabels(eybLead.hiring)}
-              />
-              <SummaryTable.Row
-                heading="How much do you want to spend on setting up in the first 3 years?"
-                children={eybLead.spend}
-              />
-              <SummaryTable.Row
-                heading="Full name"
-                children={eybLead.fullName}
-              />
-              <SummaryTable.Row heading="Job title" children={eybLead.role} />
-              <SummaryTable.Row
-                heading="Phone number"
-                children={eybLead.telephoneNumber}
-              />
-              <SummaryTable.Row
-                heading="Email"
-                children={eybLead.email ? eybLead.email : NOT_SET_TEXT}
-              />
-            </SummaryTable>
+                <SummaryTable.Row
+                  heading="How do you plan to expand your business in the UK?"
+                  children={convertEYBChoicesToLabels(eybLead.intent)}
+                />
+                <SummaryTable.Row
+                  heading="How many people do you want to hire in the UK in the first 3 years?"
+                  children={convertEYBChoicesToLabels(eybLead.hiring)}
+                />
+                <SummaryTable.Row
+                  heading="How much do you want to spend on setting up in the first 3 years?"
+                  children={eybLead.spend}
+                />
+                <SummaryTable.Row
+                  heading="Full name"
+                  children={eybLead.fullName}
+                />
+                <SummaryTable.Row heading="Job title" children={eybLead.role} />
+                <SummaryTable.Row
+                  heading="Phone number"
+                  children={eybLead.telephoneNumber}
+                />
+                <SummaryTable.Row
+                  heading="Email"
+                  children={eybLead.email ? eybLead.email : NOT_SET_TEXT}
+                />
+              </SummaryTable>
+            </>
           )
         }}
       </EYBLeadResource>