Merge pull request #6587 from uktrade/fix/export-win-urls

Refactor export wins create URLs for consistency
uktrade · Mar 7, 2024 · 2b1632b · 2b1632b
2 parents 977661c + 8ad610c
commit 2b1632b
Show file tree

Hide file tree

Showing 9 changed files with 45 additions and 46 deletions.
diff --git a/src/apps/routers.js b/src/apps/routers.js
@@ -26,7 +26,8 @@ const reactRoutes = [
   '/export/:exportId/details',
   '/export/:exportId/delete',
   '/exportwins',
-  '/exportwins/create',
+  '/companies/:companyId/exportwins/create',
+  '/companies/:companyId/export/:exportId/exportwins/create',
   '/exportwins/:winId/edit',
   '/exportwins/won',
   '/exportwins/sent',

diff --git a/src/client/modules/ExportWins/Form/CustomerDetailsStep.jsx b/src/client/modules/ExportWins/Form/CustomerDetailsStep.jsx
@@ -1,9 +1,7 @@
 import React from 'react'
-import { useLocation } from 'react-router-dom'
 import { H3 } from '@govuk-react/heading'
 
 import ResourceOptionsField from '../../../components/Form/elements/ResourceOptionsField'
-import { getQueryParamsFromLocation } from '../../../../client/utils/url'
 import { Step, FieldTypeahead } from '../../../components'
 import { idNamesToValueLabels } from '../../../utils'
 import { StyledHintParagraph } from './styled'
@@ -15,11 +13,7 @@ import {
   BusinessPotentialResource,
 } from '../../../components/Resource'
 
-const CustomerDetailsStep = () => {
-  const location = useLocation()
-  const queryParams = getQueryParamsFromLocation(location)
-  const companyId = queryParams.company
-
+const CustomerDetailsStep = ({ companyId }) => {
   return (
     <Step name={steps.CUSTOMER_DETAILS}>
       <H3 data-test="step-heading">Customer details</H3>

diff --git a/src/client/modules/ExportWins/Form/ExportWinForm.jsx b/src/client/modules/ExportWins/Form/ExportWinForm.jsx
@@ -22,14 +22,20 @@ const CompanyName = ({ companyId }) => (
 
 const ExportWinForm = ({
   title,
+  exportId,
   companyId,
   exportWinId,
   initialValuesTaskName,
   initialValuesPayload,
   csrfToken,
   currentAdviserId,
 }) => {
-  const stepProps = { isEditing: !!exportWinId }
+  const stepProps = {
+    isEditing: !!exportWinId,
+    exportId,
+    companyId,
+    exportWinId,
+  }
   return (
     <DefaultLayout
       heading={title}

diff --git a/src/client/modules/ExportWins/Form/OfficerDetailsStep.jsx b/src/client/modules/ExportWins/Form/OfficerDetailsStep.jsx
@@ -1,11 +1,10 @@
 import React from 'react'
-import { useLocation } from 'react-router-dom'
 import { H3 } from '@govuk-react/heading'
 
 import ResourceOptionsField from '../../../components/Form/elements/ResourceOptionsField'
 import * as validators from './validators'
 import { useFormContext } from '../../../../client/components/Form/hooks'
-import { getQueryParamsFromLocation } from '../../../../client/utils/url'
+
 import urls from '../../../../lib/urls'
 import { steps } from './constants'
 import {
@@ -18,23 +17,18 @@ import {
   FieldTypeahead,
 } from '../../../components'
 
-const OfficerDetailsStep = () => {
+const OfficerDetailsStep = ({ companyId, exportId, exportWinId }) => {
   const { values } = useFormContext()
-  const location = useLocation()
-  const queryParams = getQueryParamsFromLocation(location)
-
   return (
     <Step
       name={steps.OFFICER_DETAILS}
       cancelUrl={
-        queryParams.export
-          ? urls.exportPipeline.details(queryParams.export)
-          : queryParams.companywin
-            ? urls.companies.exportWins.checkBeforeSending(
-                queryParams.companywin
-              )
-            : queryParams.company
-              ? urls.companies.overview.index(queryParams.company)
+        exportId
+          ? urls.exportPipeline.details(exportId)
+          : exportWinId
+            ? urls.companies.exportWins.checkBeforeSending(exportWinId)
+            : companyId
+              ? urls.companies.overview.index(companyId)
               : null
       }
     >

diff --git a/src/client/modules/ExportWins/Form/index.jsx b/src/client/modules/ExportWins/Form/index.jsx
@@ -1,36 +1,31 @@
 import React from 'react'
 
 import { TASK_GET_EXPORT_WIN, TASK_GET_EXPORT_PROJECT } from './state'
-import { getQueryParamsFromLocation } from '../../../utils/url'
 import ExportWinForm from './ExportWinForm'
 
 // If we're converting an export project to an export win
 // then we'll have the export id, otherwise we're creating
 // the export win from scratch.
-export const CreateExportWin = ({ location }) => {
-  const queryParams = getQueryParamsFromLocation(location)
+export const CreateExportWin = ({ match }) => {
+  const exportId = match.params.exportId
   return (
     <ExportWinForm
       title="Add export win"
-      companyId={queryParams.company}
-      initialValuesTaskName={
-        queryParams.export ? TASK_GET_EXPORT_PROJECT : null
-      }
-      initialValuesPayload={{
-        id: queryParams.export ? queryParams.export : null,
-      }}
+      exportId={exportId}
+      companyId={match.params.companyId}
+      initialValuesTaskName={exportId ? TASK_GET_EXPORT_PROJECT : null}
+      initialValuesPayload={{ id: exportId }}
     />
   )
 }
 
 // Here we're editing an existing win so we'll have the
 // export win id.
-export const EditExportWin = ({ location, match }) => {
-  const queryParams = getQueryParamsFromLocation(location)
+export const EditExportWin = ({ match }) => {
   return (
     <ExportWinForm
       title="Edit export win"
-      companyId={queryParams.company}
+      companyId={match.params.companyId}
       exportWinId={match.params.winId}
       initialValuesTaskName={TASK_GET_EXPORT_WIN}
       initialValuesPayload={{

diff --git a/src/client/routes.js b/src/client/routes.js
@@ -498,7 +498,12 @@ const routes = {
       component: ExportWinDetails,
     },
     {
-      path: '/exportwins/create',
+      path: '/companies/:companyId/exportwins/create',
+      module: 'datahub:companies',
+      component: CreateExportWin,
+    },
+    {
+      path: '/companies/:companyId/export/:exportId/exportwins/create',
       module: 'datahub:companies',
       component: CreateExportWin,
     },

diff --git a/src/lib/urls.js b/src/lib/urls.js
@@ -225,9 +225,11 @@ module.exports = {
       rejected: url('/exportwins/rejected'),
       edit: url('/exportwins', '/:winId/edit'),
       details: url('/exportwins', '/:winId/details'),
-      create: url('/exportwins/create?company=', ':companyId'),
-      createFromExport: (companyId, exportId) =>
-        `/exportwins/create?company=${companyId}&export=${exportId}`,
+      create: url('/companies', '/:companyId/exportwins/create'),
+      createFromExport: url(
+        '/companies',
+        '/:companyId/export/:exportId/exportwins/create'
+      ),
       customerFeedback: url('/exportwins', '/:winId/customer-feedback'),
     },
     overview: {

diff --git a/test/a11y/cypress/config/urlTestExclusions.js b/test/a11y/cypress/config/urlTestExclusions.js
@@ -151,6 +151,8 @@ export const urlTestExclusions = [
   { url: '/exportwins/rejected/' },
   { url: '/exportwins/:winId/edit' },
   { url: '/exportwins/:winId/customer-feedback' },
+  { url: '/companies/:companyId/export/:exportId/exportwins/create' },
+
   { url: '/companies/e59a2b0f-7d84-4de7-bc1e-f70339f4255f/overview' },
   // Exclude all metadata
   { url: '/api-proxy/v4/metadata/likelihood-to-land' },

diff --git a/test/functional/cypress/specs/export-win/add-export-win-spec.js b/test/functional/cypress/specs/export-win/add-export-win-spec.js
@@ -31,12 +31,12 @@ const year = twelveMonthsAgo.getFullYear()
 
 const create = urls.companies.exportWins.create(company.id)
 
-const officerDetailsStep = create + '&step=officer_details'
-const creditForThisWinStep = create + '&step=credit_for_this_win'
-const customerDetailsStep = create + '&step=customer_details'
-const winDetailsStep = create + '&step=win_details'
-const supportProvidedStep = create + '&step=support_provided'
-const checkBeforeSendingStep = create + '&step=check_before_sending'
+const officerDetailsStep = create + '?step=officer_details'
+const creditForThisWinStep = create + '?step=credit_for_this_win'
+const customerDetailsStep = create + '?step=customer_details'
+const winDetailsStep = create + '?step=win_details'
+const supportProvidedStep = create + '?step=support_provided'
+const checkBeforeSendingStep = create + '?step=check_before_sending'
 
 const formFields = {
   officerDetails: {