From 8e1c9e0f5aa5bbc6bc2a39cab969a091aafc5fc5 Mon Sep 17 00:00:00 2001 From: Edmond De Los Reyes Date: Wed, 23 Oct 2024 13:45:59 +0100 Subject: [PATCH 1/5] Implement EW migration alert banner messages --- .../components/CompanyLocalHeader/index.jsx | 9 ++- .../modules/ExportWins/Form/ExportWinForm.jsx | 50 +++++++------- .../modules/ExportWins/Form/constants.js | 11 ++- .../ExportWins/Status/ExportWinsTabNav.jsx | 19 +++++ .../modules/ExportWins/Status/constants.js | 7 ++ .../specs/companies/export/index-spec.js | 31 +++++++++ .../edit-export-win-pending-spec.js.js | 69 ++++++++++++------- 7 files changed, 136 insertions(+), 60 deletions(-) diff --git a/src/client/components/CompanyLocalHeader/index.jsx b/src/client/components/CompanyLocalHeader/index.jsx index 1b19a231cc6..11c364373c6 100644 --- a/src/client/components/CompanyLocalHeader/index.jsx +++ b/src/client/components/CompanyLocalHeader/index.jsx @@ -26,6 +26,7 @@ import { } from '../../modules/Companies/utils' import { RelatedCompaniesCountResource } from '../Resource' import { companyState2Props } from './state' +import { WINS_HISTORIC_ALERT_BANNER } from '../../modules/ExportWins/Status/ExportWinsTabNav' const LocalHeaderTradingNames = styled(H4)` font-weight: normal; @@ -121,7 +122,7 @@ const hasManagedAccountDetails = (company) => const CompanyLocalHeader = ({ breadcrumbs, - flashMessages, + flashMessages = [], company, csrfToken, }) => @@ -133,7 +134,11 @@ const CompanyLocalHeader = ({ company.id, company.name )} - flashMessages={flashMessages} + flashMessages={ + breadcrumbs[0]?.text === 'Exports' + ? [[WINS_HISTORIC_ALERT_BANNER, ...flashMessages]] + : flashMessages + } > diff --git a/src/client/modules/ExportWins/Form/ExportWinForm.jsx b/src/client/modules/ExportWins/Form/ExportWinForm.jsx index dc28c6c327e..fb47246ff61 100644 --- a/src/client/modules/ExportWins/Form/ExportWinForm.jsx +++ b/src/client/modules/ExportWins/Form/ExportWinForm.jsx @@ -4,7 +4,6 @@ import { Link } from 'govuk-react' import { connect } from 'react-redux' import styled from 'styled-components' import pluralize from 'pluralize' -import { FONT_SIZE } from '@govuk-react/constants' import FlashMessages from '../../../components/LocalHeader/FlashMessages' import { steps, EMAIL, STEP_TO_EXCLUDED_FIELDS_MAP } from './constants' @@ -22,22 +21,11 @@ import { ExportWinSuccess } from './Success' import State from '../../../components/State' import urls from '../../../../lib/urls' import SummaryStep from './SummaryStep' -import { - Form, - FormLayout, - DefaultLayout, - StatusMessage, -} from '../../../components' +import { Form, FormLayout, DefaultLayout } from '../../../components' +import { WINS_HISTORIC_ALERT_BANNER } from '../Status/ExportWinsTabNav' const FORM_ID = 'export-win-form' -const StyledStatusMessage = styled(StatusMessage)({ - fontSize: FONT_SIZE.SIZE_20, - fontWeight: 700, - marginTop: 25, - marginBottom: 5, -}) - const StyledParagraph = styled('p')({ fontWeight: 'bold', }) @@ -93,6 +81,28 @@ const ExportWinForm = ({ heading={heading} subheading={subheading} breadcrumbs={breadcrumbs} + flashMessages={[ + [ + isEditing ? ( + <> + + {WINS_HISTORIC_ALERT_BANNER} + + {currentStepName === steps.SUMMARY ? ( + <> + + To edit an export win: edit each section that needs + changing then return to the summary page. When you + are happy with all the changes save the page. + + + ) : excludedStepFields ? ( + + ) : null} + + ) : null, + ], + ]} localHeaderChildren={ isEditing ? ( currentStepName === steps.SUMMARY ? ( @@ -104,24 +114,12 @@ const ExportWinForm = ({ }} /> )} - - To edit an export win - - Edit each section that needs changing then return to - the summary page. When you are happy with all the - changes save the page. - - {winStatus === WIN_STATUS.PENDING && ( )} - ) : excludedStepFields ? ( - - - ) : null ) : null } diff --git a/src/client/modules/ExportWins/Form/constants.js b/src/client/modules/ExportWins/Form/constants.js index 9155582980c..6c985970d8c 100644 --- a/src/client/modules/ExportWins/Form/constants.js +++ b/src/client/modules/ExportWins/Form/constants.js @@ -53,13 +53,12 @@ export const bothGoodsAndServices = { } export const STEP_TO_EXCLUDED_FIELDS_MAP = { - [steps.OFFICER_DETAILS]: ['Lead officer name'], - [steps.CUSTOMER_DETAILS]: ['Export experience'], + [steps.CUSTOMER_DETAILS]: ['export experience.'], [steps.WIN_DETAILS]: [ - 'Summary of the support given', - 'Destination country', - 'Date won', - 'Type of win and Value', + 'summary of the support given', + 'destination country', + 'date won', + 'type of win and value.', ], } diff --git a/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx b/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx index d73a771e21f..430983d4c06 100644 --- a/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx +++ b/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx @@ -1,6 +1,7 @@ import React from 'react' import { useLocation } from 'react-router-dom' import { capitalize } from 'lodash' +import { Link } from 'govuk-react' import { DefaultLayout } from '../../../components' import TabNav from '../../../components/TabNav' @@ -8,9 +9,26 @@ import WinsRejectedList from './WinsRejectedList' import WinsPendingList from './WinsPendingList' import WinsConfirmedList from './WinsConfirmedList' import urls from '../../../../lib/urls' +import { HISTORIC_ALERT_MESSAGE } from './constants' const LAST_WORD = /([^\/]+)$/ +export const WINS_HISTORIC_ALERT_BANNER = ( + <> + {[HISTORIC_ALERT_MESSAGE.ELEMENT].concat(' ')} + {[ + + {HISTORIC_ALERT_MESSAGE.URI_ELEMENT} + , + ].concat('.')} + +) + const ExportWinsTabNav = () => { const location = useLocation() const match = LAST_WORD.exec(location.pathname) @@ -28,6 +46,7 @@ const ExportWinsTabNav = () => { }, { text: capitalize(title) }, ]} + flashMessages={[[WINS_HISTORIC_ALERT_BANNER]]} > { function assertTable({ rows, caption, action }) { @@ -67,6 +70,10 @@ describe('Company Export tab', () => { }) }) + it('should render historic export win banner message', () => { + assertHistoricExportWinsMessage() + }) + it('should render the "Exports" table', () => { assertExportsTable(company.dnbCorp.id, [ { label: 'Export win category', value: 'None' }, @@ -191,3 +198,27 @@ describe('Company Export tab', () => { }) }) }) + +describe("Other Company tabs - should't be shown banner message in the other tabs", () => { + ;[ + 'overview', + 'activity', + 'business-details', + 'contacts', + 'account-management', + 'investments/projects', + 'orders', + ].forEach((slug) => + it(slug, () => { + cy.visit(`/companies/${company.dnbCorp.id}/${slug}`) + + // We need to wait for company name appear... + cy.contains(company.dnbCorp.name) + + // ...so that this waits for whent the data has been loaded and rendered + cy.contains('Historic export wins have now moved to Data Hub').should( + 'not.exist' + ) + }) + ) +}) diff --git a/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js b/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js index 287f3657db0..c9993345dde 100644 --- a/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js +++ b/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js @@ -1,9 +1,41 @@ import { exportWinsFaker } from '../../fakers/export-wins' import urls from '../../../../../src/lib/urls' import { company, formFields } from './constants' +import { HISTORIC_ALERT_MESSAGE } from '../../../../../src/client/modules/ExportWins/Status/constants' const exportWin = exportWinsFaker() +export const assertHistoricExportWinsMessage = () => { + cy.get('[data-test="status-message"]') + .should('contain', HISTORIC_ALERT_MESSAGE.ELEMENT) + .should('contain.text', HISTORIC_ALERT_MESSAGE.URI_ELEMENT) + .find('a') + .should('have.attr', 'href', HISTORIC_ALERT_MESSAGE.URI_LINK) +} + +const assertCustomerDetailsMessage = () => { + cy.get('[data-test="status-message"]').should( + 'contain.text', + 'Contact exportwins@businessandtrade.gov.uk if you need to update the section: export experience.' + ) +} + +const assertWinDetailsMessage = () => { + cy.get('[data-test="status-message"]').should( + 'contain.text', + 'Contact exportwins@businessandtrade.gov.uk if you need to update the sections: ' + + 'summary of the support given, destination country, date won, type of win and value.' + ) +} + +const assertSummaryMessage = () => { + cy.get('[data-test="status-message"]').should( + 'contain.text', + 'To edit an export win: edit each section that needs changing then return to the summary page. ' + + 'When you are happy with all the changes save the page.' + ) +} + describe('Editing a pending export win', () => { beforeEach(() => { cy.intercept('GET', '/api-proxy/v4/export-win/*', exportWin).as( @@ -41,10 +73,7 @@ describe('Editing a pending export win', () => { urls.companies.exportWins.editOfficerDetails(company.id, exportWin.id) ) cy.wait(['@apiGetExportWin', '@apiTeamType', '@apiHqTeam']) - cy.get('[data-test="status-message"]').should( - 'have.text', - 'Contact exportwins@businessandtrade.gov.uk if you need to update the section: Lead officer name' - ) + assertHistoricExportWinsMessage() }) }) @@ -54,7 +83,7 @@ describe('Editing a pending export win', () => { urls.companies.exportWins.editCreditForThisWin(company.id, exportWin.id) ) cy.wait(['@apiGetExportWin', '@apiTeamType', '@apiHqTeam']) - cy.get('[data-test="status-message"]').should('not.exist') + assertHistoricExportWinsMessage() }) }) @@ -67,12 +96,8 @@ describe('Editing a pending export win', () => { }) it('should render an edit status message', () => { - cy.get('[data-test="status-message"]') - .should('exist') - .should( - 'have.text', - 'Contact exportwins@businessandtrade.gov.uk if you need to update the section: Export experience' - ) + assertHistoricExportWinsMessage() + assertCustomerDetailsMessage() }) it('should not render Export experience', () => { @@ -91,13 +116,8 @@ describe('Editing a pending export win', () => { }) it('should render an edit status message', () => { - cy.get('[data-test="status-message"]') - .should('exist') - .should( - 'have.text', - 'Contact exportwins@businessandtrade.gov.uk if you need to update the sections: ' + - 'Summary of the support given, Destination country, Date won, Type of win and Value' - ) + assertHistoricExportWinsMessage() + assertWinDetailsMessage() }) it('should not render a hint', () => { @@ -137,7 +157,8 @@ describe('Editing a pending export win', () => { urls.companies.exportWins.editSupportProvided(company.id, exportWin.id) ) cy.wait(['@apiGetExportWin']) - cy.get('[data-test="status-message"]').should('not.exist') + cy.get('[data-test="status-message"]') + assertHistoricExportWinsMessage() }) }) @@ -145,12 +166,8 @@ describe('Editing a pending export win', () => { it('should render an edit status message', () => { cy.visit(urls.companies.exportWins.editSummary(company.id, exportWin.id)) cy.wait(['@apiGetExportWin']) - cy.get('[data-test="status-message"]').should( - 'contain', - 'To edit an export win' + - 'Edit each section that needs changing then return to the summary page. ' + - 'When you are happy with all the changes save the page.' - ) + assertHistoricExportWinsMessage() + assertSummaryMessage() }) it('should render a lead officer name contact link', () => { @@ -249,7 +266,7 @@ describe('Editing a pending export win', () => { cy.get('[data-test="resend-export-win"]').click() cy.wait('@apiResendExportWin') cy.get('[data-test="flash"]').should( - 'have.text', + 'contain.text', `The export win ${exportWin.name_of_export} to ${exportWin.country.name} has been sent to ${exportWin.company_contacts[0].email} for review and confirmation.` ) }) From 624450be768004b4baf533015d2dc066c83a175c Mon Sep 17 00:00:00 2001 From: Edmond De Los Reyes Date: Mon, 25 Nov 2024 14:07:50 +0000 Subject: [PATCH 2/5] Implement naming convention --- src/client/modules/ExportWins/Form/ExportWinForm.jsx | 4 ++-- .../modules/ExportWins/Status/ExportWinsTabNav.jsx | 12 ++++++------ src/client/modules/ExportWins/Status/constants.js | 2 +- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/client/modules/ExportWins/Form/ExportWinForm.jsx b/src/client/modules/ExportWins/Form/ExportWinForm.jsx index fb47246ff61..2fb7eb28bd0 100644 --- a/src/client/modules/ExportWins/Form/ExportWinForm.jsx +++ b/src/client/modules/ExportWins/Form/ExportWinForm.jsx @@ -22,7 +22,7 @@ import State from '../../../components/State' import urls from '../../../../lib/urls' import SummaryStep from './SummaryStep' import { Form, FormLayout, DefaultLayout } from '../../../components' -import { WINS_HISTORIC_ALERT_BANNER } from '../Status/ExportWinsTabNav' +import { HistoricWinsAlertBanner } from '../Status/ExportWinsTabNav' const FORM_ID = 'export-win-form' @@ -86,7 +86,7 @@ const ExportWinForm = ({ isEditing ? ( <> - {WINS_HISTORIC_ALERT_BANNER} + {HistoricWinsAlertBanner} {currentStepName === steps.SUMMARY ? ( <> diff --git a/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx b/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx index 430983d4c06..e2f060b3b56 100644 --- a/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx +++ b/src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx @@ -9,21 +9,21 @@ import WinsRejectedList from './WinsRejectedList' import WinsPendingList from './WinsPendingList' import WinsConfirmedList from './WinsConfirmedList' import urls from '../../../../lib/urls' -import { HISTORIC_ALERT_MESSAGE } from './constants' +import { HISTORIC_WINS_ALERT_MESSAGE } from './constants' const LAST_WORD = /([^\/]+)$/ -export const WINS_HISTORIC_ALERT_BANNER = ( +export const HistoricWinsAlertBanner = ( <> - {[HISTORIC_ALERT_MESSAGE.ELEMENT].concat(' ')} + {[HISTORIC_WINS_ALERT_MESSAGE.ELEMENT].concat(' ')} {[ - {HISTORIC_ALERT_MESSAGE.URI_ELEMENT} + {HISTORIC_WINS_ALERT_MESSAGE.URI_ELEMENT} , ].concat('.')} @@ -46,7 +46,7 @@ const ExportWinsTabNav = () => { }, { text: capitalize(title) }, ]} - flashMessages={[[WINS_HISTORIC_ALERT_BANNER]]} + flashMessages={[[HistoricWinsAlertBanner]]} > Date: Mon, 25 Nov 2024 14:24:59 +0000 Subject: [PATCH 3/5] Move Export Wins Banner message to Company Export page --- src/client/components/CompanyLocalHeader/index.jsx | 9 ++------- .../modules/Companies/CompanyExports/ExportsIndex.jsx | 2 ++ 2 files changed, 4 insertions(+), 7 deletions(-) diff --git a/src/client/components/CompanyLocalHeader/index.jsx b/src/client/components/CompanyLocalHeader/index.jsx index 11c364373c6..1b19a231cc6 100644 --- a/src/client/components/CompanyLocalHeader/index.jsx +++ b/src/client/components/CompanyLocalHeader/index.jsx @@ -26,7 +26,6 @@ import { } from '../../modules/Companies/utils' import { RelatedCompaniesCountResource } from '../Resource' import { companyState2Props } from './state' -import { WINS_HISTORIC_ALERT_BANNER } from '../../modules/ExportWins/Status/ExportWinsTabNav' const LocalHeaderTradingNames = styled(H4)` font-weight: normal; @@ -122,7 +121,7 @@ const hasManagedAccountDetails = (company) => const CompanyLocalHeader = ({ breadcrumbs, - flashMessages = [], + flashMessages, company, csrfToken, }) => @@ -134,11 +133,7 @@ const CompanyLocalHeader = ({ company.id, company.name )} - flashMessages={ - breadcrumbs[0]?.text === 'Exports' - ? [[WINS_HISTORIC_ALERT_BANNER, ...flashMessages]] - : flashMessages - } + flashMessages={flashMessages} > diff --git a/src/client/modules/Companies/CompanyExports/ExportsIndex.jsx b/src/client/modules/Companies/CompanyExports/ExportsIndex.jsx index 23375b68934..5a018652323 100644 --- a/src/client/modules/Companies/CompanyExports/ExportsIndex.jsx +++ b/src/client/modules/Companies/CompanyExports/ExportsIndex.jsx @@ -21,6 +21,7 @@ import { transformExportCountries, } from './transformers' import DefaultLayoutBase from '../../../components/Layout/DefaultLayoutBase' +import { HistoricWinsAlertBanner } from '../../ExportWins/Status/ExportWinsTabNav' const StyledSummaryTable = styled(SummaryTable)` margin-top: 0; @@ -41,6 +42,7 @@ const ExportsIndex = () => { company={company} breadcrumbs={[{ text: 'Exports' }]} pageTitle="Export" + flashMessages={[[HistoricWinsAlertBanner]]} > Date: Mon, 25 Nov 2024 14:26:47 +0000 Subject: [PATCH 4/5] Remove redundant test --- .../specs/companies/export/index-spec.js | 24 ------------------- .../edit-export-win-pending-spec.js.js | 8 +++---- 2 files changed, 4 insertions(+), 28 deletions(-) diff --git a/test/functional/cypress/specs/companies/export/index-spec.js b/test/functional/cypress/specs/companies/export/index-spec.js index 79a81a43e95..ba6b19562f0 100644 --- a/test/functional/cypress/specs/companies/export/index-spec.js +++ b/test/functional/cypress/specs/companies/export/index-spec.js @@ -198,27 +198,3 @@ describe('Company Export tab', () => { }) }) }) - -describe("Other Company tabs - should't be shown banner message in the other tabs", () => { - ;[ - 'overview', - 'activity', - 'business-details', - 'contacts', - 'account-management', - 'investments/projects', - 'orders', - ].forEach((slug) => - it(slug, () => { - cy.visit(`/companies/${company.dnbCorp.id}/${slug}`) - - // We need to wait for company name appear... - cy.contains(company.dnbCorp.name) - - // ...so that this waits for whent the data has been loaded and rendered - cy.contains('Historic export wins have now moved to Data Hub').should( - 'not.exist' - ) - }) - ) -}) diff --git a/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js b/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js index c9993345dde..f4556326e3b 100644 --- a/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js +++ b/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js @@ -1,16 +1,16 @@ import { exportWinsFaker } from '../../fakers/export-wins' import urls from '../../../../../src/lib/urls' import { company, formFields } from './constants' -import { HISTORIC_ALERT_MESSAGE } from '../../../../../src/client/modules/ExportWins/Status/constants' +import { HISTORIC_WINS_ALERT_MESSAGE } from '../../../../../src/client/modules/ExportWins/Status/constants' const exportWin = exportWinsFaker() export const assertHistoricExportWinsMessage = () => { cy.get('[data-test="status-message"]') - .should('contain', HISTORIC_ALERT_MESSAGE.ELEMENT) - .should('contain.text', HISTORIC_ALERT_MESSAGE.URI_ELEMENT) + .should('contain', HISTORIC_WINS_ALERT_MESSAGE.ELEMENT) + .should('contain.text', HISTORIC_WINS_ALERT_MESSAGE.URI_ELEMENT) .find('a') - .should('have.attr', 'href', HISTORIC_ALERT_MESSAGE.URI_LINK) + .should('have.attr', 'href', HISTORIC_WINS_ALERT_MESSAGE.URI_LINK) } const assertCustomerDetailsMessage = () => { From 874fe07ebfa14a997370259d8a9fb6b01fef1043 Mon Sep 17 00:00:00 2001 From: Edmond De Los Reyes Date: Thu, 28 Nov 2024 11:03:24 +0000 Subject: [PATCH 5/5] Revert lead officer details banner message --- src/client/modules/ExportWins/Form/constants.js | 1 + .../specs/export-win/edit-export-win-pending-spec.js.js | 8 ++++++++ 2 files changed, 9 insertions(+) diff --git a/src/client/modules/ExportWins/Form/constants.js b/src/client/modules/ExportWins/Form/constants.js index 6c985970d8c..d2d24611b5c 100644 --- a/src/client/modules/ExportWins/Form/constants.js +++ b/src/client/modules/ExportWins/Form/constants.js @@ -53,6 +53,7 @@ export const bothGoodsAndServices = { } export const STEP_TO_EXCLUDED_FIELDS_MAP = { + [steps.OFFICER_DETAILS]: ['lead officer name.'], [steps.CUSTOMER_DETAILS]: ['export experience.'], [steps.WIN_DETAILS]: [ 'summary of the support given', diff --git a/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js b/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js index f4556326e3b..63deaac91a9 100644 --- a/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js +++ b/test/functional/cypress/specs/export-win/edit-export-win-pending-spec.js.js @@ -20,6 +20,13 @@ const assertCustomerDetailsMessage = () => { ) } +const assertLeadOfficerDetailsMessage = () => { + cy.get('[data-test="status-message"]').should( + 'contain.text', + 'Contact exportwins@businessandtrade.gov.uk if you need to update the section: lead officer name.' + ) +} + const assertWinDetailsMessage = () => { cy.get('[data-test="status-message"]').should( 'contain.text', @@ -74,6 +81,7 @@ describe('Editing a pending export win', () => { ) cy.wait(['@apiGetExportWin', '@apiTeamType', '@apiHqTeam']) assertHistoricExportWinsMessage() + assertLeadOfficerDetailsMessage() }) })