From f8257a107d7a92658674ccb380ca3c15e23c22f6 Mon Sep 17 00:00:00 2001
From: Paul Gain <paul@javexconsulting.com>
Date: Mon, 11 Mar 2024 17:39:41 +0000
Subject: [PATCH] Add the export win success page

After a user has added an export win they will be redirected to
a success page. This page guides them on what will happen next.
---
 src/apps/routers.js                           |  1 +
 .../components/LocalHeader/FlashMessages.jsx  | 18 ++++--
 .../modules/ExportWins/Form/ExportWinForm.jsx |  4 +-
 .../modules/ExportWins/Form/Success.jsx       | 55 +++++++++++++++++++
 src/client/routes.js                          |  6 ++
 src/lib/urls.js                               |  1 +
 test/a11y/cypress/config/urlTestExclusions.js |  1 +
 7 files changed, 81 insertions(+), 5 deletions(-)
 create mode 100644 src/client/modules/ExportWins/Form/Success.jsx

diff --git a/src/apps/routers.js b/src/apps/routers.js
index 7105da04ce0..8315ccdd516 100644
--- a/src/apps/routers.js
+++ b/src/apps/routers.js
@@ -33,6 +33,7 @@ const reactRoutes = [
   '/exportwins/sent',
   '/exportwins/rejected',
   '/exportwins/:winId/details',
+  '/exportwins/:winId/success',
   '/exportwins/:winId/customer-feedback',
   '/companies/:companyId/dnb-hierarchy',
   '/companies/:companyId/company-tree',
diff --git a/src/client/components/LocalHeader/FlashMessages.jsx b/src/client/components/LocalHeader/FlashMessages.jsx
index 87a7875c492..cc586d851b9 100644
--- a/src/client/components/LocalHeader/FlashMessages.jsx
+++ b/src/client/components/LocalHeader/FlashMessages.jsx
@@ -66,7 +66,7 @@ const FlashMessages = ({
     getFlashMessages()
     return () => clearFlashMessages()
   }, [])
-  return !isEmpty(flashMessages) ? (
+  return isEmpty(flashMessages) ? null : (
     <UnorderedList listStyleType="none" data-test="flash">
       {Object.entries(flashMessages).map(([type, messages]) => {
         /*
@@ -82,20 +82,30 @@ const FlashMessages = ({
                 <li key={body}>
                   <StyledStatusMessage colour={messageColours[parts[0]]}>
                     <StyledHeading>{heading}</StyledHeading>
-                    <StyledBody dangerouslySetInnerHTML={{ __html: body }} />
+                    {typeof body === 'string' ? (
+                      <StyledBody dangerouslySetInnerHTML={{ __html: body }} />
+                    ) : (
+                      <StyledBody>{body}</StyledBody>
+                    )}
                   </StyledStatusMessage>
                 </li>
               ))
             : messages.map((body, i) => (
                 <li key={i}>
                   <StyledStatusMessage colour={messageColours[type]}>
-                    <StyledMessage dangerouslySetInnerHTML={{ __html: body }} />
+                    {typeof body === 'string' ? (
+                      <StyledMessage
+                        dangerouslySetInnerHTML={{ __html: body }}
+                      />
+                    ) : (
+                      <StyledMessage>{body}</StyledMessage>
+                    )}
                   </StyledStatusMessage>
                 </li>
               ))
       })}
     </UnorderedList>
-  ) : null
+  )
 }
 
 const flashMessagePropTypes = {
diff --git a/src/client/modules/ExportWins/Form/ExportWinForm.jsx b/src/client/modules/ExportWins/Form/ExportWinForm.jsx
index c79b25354dc..9a4cb002208 100644
--- a/src/client/modules/ExportWins/Form/ExportWinForm.jsx
+++ b/src/client/modules/ExportWins/Form/ExportWinForm.jsx
@@ -62,7 +62,9 @@ const ExportWinForm = ({
           id="export-win-form"
           showStepInUrl={true}
           cancelRedirectTo={() => urls.companies.exportWins.sent()}
-          redirectTo={() => urls.companies.exportWins.sent()}
+          redirectTo={(result) =>
+            urls.companies.exportWins.success(result.data.id)
+          }
           analyticsFormName="exportWinForm"
           submissionTaskName={TASK_GET_EXPORT_WINS_SAVE_FORM}
           initialValuesTaskName={initialValuesTaskName}
diff --git a/src/client/modules/ExportWins/Form/Success.jsx b/src/client/modules/ExportWins/Form/Success.jsx
new file mode 100644
index 00000000000..c214fbd47e1
--- /dev/null
+++ b/src/client/modules/ExportWins/Form/Success.jsx
@@ -0,0 +1,55 @@
+import React from 'react'
+import { H4 } from '@govuk-react/heading'
+
+import ExportWin from '../../../components/Resource/ExportWin'
+import { ExportWinsLink, VerticalSpacer } from '../Details'
+import { DefaultLayout } from '../../../components'
+import urls from '../../../../lib/urls'
+
+const ExportWinSuccess = ({ winId }) => (
+  <ExportWin.Inline id={winId}>
+    {(exportWin) =>
+      exportWin &&
+      `The export win ${exportWin.nameOfExport} to ${exportWin.country.name} has been` +
+        ` sent to ${exportWin.companyContacts[0].email} for review and confirmation.`
+    }
+  </ExportWin.Inline>
+)
+
+const Success = ({ match }) => (
+  <DefaultLayout
+    pageTitle="Success"
+    breadcrumbs={[
+      {
+        link: urls.dashboard.index(),
+        text: 'Home',
+      },
+      {
+        link: urls.companies.exportWins.index(),
+        text: 'Export wins',
+      },
+      {
+        text: 'Success',
+      },
+    ]}
+    flashMessages={{
+      success: [<ExportWinSuccess winId={match.params.winId} />],
+    }}
+  >
+    <H4 data-test="heading" as="h2">
+      What happens next?
+    </H4>
+    <p data-test="review">
+      The customer will review the export win and have the option to provide
+      feedback.
+    </p>
+    <p data-test="email">
+      You will be sent an email once the customer has responded.
+    </p>
+    <VerticalSpacer>
+      <ExportWinsLink />
+    </VerticalSpacer>
+  </DefaultLayout>
+)
+
+export default Success
diff --git a/src/client/routes.js b/src/client/routes.js
index f3aa10c680d..e476f19a984 100644
--- a/src/client/routes.js
+++ b/src/client/routes.js
@@ -20,6 +20,7 @@ import ExportWinsTabNav from './modules/ExportWins/Status/ExportWinsTabNav'
 import { CreateExportWin, EditExportWin } from './modules/ExportWins/Form'
 import ExportWinsRedirect from './modules/ExportWins/Status/Redirect'
 import ExportWinDetails from './modules/ExportWins/Details'
+import Success from './modules/ExportWins/Form/Success'
 import CompanyHierarchy from './modules/Companies/CompanyHierarchy'
 import CompanyTree from './modules/Companies/CompanyHierarchy/CompanyTree'
 import Community from './modules/Community'
@@ -507,6 +508,11 @@ const routes = {
       module: 'datahub:companies',
       component: CreateExportWin,
     },
+    {
+      path: '/exportwins/:winId/success',
+      module: 'datahub:companies',
+      component: Success,
+    },
     {
       path: '/exportwins/:winId/edit',
       module: 'datahub:companies',
diff --git a/src/lib/urls.js b/src/lib/urls.js
index c7f2cf31dd1..d7b1c080923 100644
--- a/src/lib/urls.js
+++ b/src/lib/urls.js
@@ -230,6 +230,7 @@ module.exports = {
         '/companies',
         '/:companyId/export/:exportId/exportwins/create'
       ),
+      success: url('/exportwins', '/:winId/success'),
       customerFeedback: url('/exportwins', '/:winId/customer-feedback'),
     },
     overview: {
diff --git a/test/a11y/cypress/config/urlTestExclusions.js b/test/a11y/cypress/config/urlTestExclusions.js
index 4860c3b5809..85b4233cfe9 100644
--- a/test/a11y/cypress/config/urlTestExclusions.js
+++ b/test/a11y/cypress/config/urlTestExclusions.js
@@ -150,6 +150,7 @@ export const urlTestExclusions = [
   { url: '/exportwins/sent/' },
   { url: '/exportwins/rejected/' },
   { url: '/exportwins/:winId/edit' },
+  { url: '/exportwins/:winId/thankyou' },
   { url: '/exportwins/:winId/customer-feedback' },
   { url: '/companies/:companyId/export/:exportId/exportwins/create' },