Add export wins rejected tab (#6550)

src/apps/routers.js

@@ -30,6 +30,7 @@ const reactRoutes = [
   '/exportwins/:winId/edit',
   '/exportwins/won',
   '/exportwins/sent',
+  '/exportwins/rejected',
   '/exportwins/:winId/details',
   '/companies/:companyId/dnb-hierarchy',
   '/companies/:companyId/company-tree',

src/client/components/CollectionList/CollectionItem.jsx

@@ -75,6 +75,7 @@ const CollectionItem = ({
   titleRenderer = null,
   useReactRouter = false,
   buttons,
+  buttonRenderer,
   footerRenderer,
   footerdata,
 }) => (
@@ -129,7 +130,18 @@ const CollectionItem = ({
     ) : (
       <Metadata rows={metadata} />
     )}
-    {buttons && <StyledButtonWrapper>{buttons}</StyledButtonWrapper>}
+    {/* 
+      TODO: Tech-debt, this needs to be refactored so we have a consistent
+      way of rendering buttons, ideally we should use the buttonRenderer
+      prop as a function that returns a JSX element and do away with the
+      buttons prop altogether as it's completely inflexible.
+    */}
+    {buttons ? (
+      <StyledButtonWrapper>{buttons}</StyledButtonWrapper>
+    ) : buttonRenderer ? (
+      buttonRenderer()
+    ) : null}
+
     {footerRenderer && (
       <StyledFooterWrapper>{footerRenderer(footerdata)} </StyledFooterWrapper>
     )}
@@ -161,6 +173,7 @@ CollectionItem.propTypes = {
   type: PropTypes.string,
   metadataRenderer: PropTypes.func,
   titleRenderer: PropTypes.func,
+  buttonRenderer: PropTypes.func,
   footerRenderer: PropTypes.func,
 }
 

src/client/modules/ExportWins/index.jsx → src/client/modules/ExportWins/Status/ExportWinsTabNav.jsx

@@ -1,15 +1,16 @@
 import React from 'react'
 import { capitalize } from 'lodash'
 
-import { DefaultLayout } from '../../components'
-import TabNav from '../../components/TabNav'
+import { DefaultLayout } from '../../../components'
+import TabNav from '../../../components/TabNav'
+import WinsRejectedList from './WinsRejectedList'
 import WinsSentList from './WinsSentList'
 import WinsWonTable from './WinsWonTable'
-import urls from '../../../lib/urls'
+import urls from '../../../../lib/urls'
 
 const TITLE = /([^\/]+$)/
 
-const ExportWins = ({ location }) => {
+const ExportWinsTabNav = ({ location }) => {
   const title = TITLE.exec(location.pathname)[0]
   return (
     <DefaultLayout
@@ -25,6 +26,10 @@ const ExportWins = ({ location }) => {
         label="Export wins tab nav"
         routed={true}
         tabs={{
+          [urls.companies.exportWins.rejected()]: {
+            label: 'Rejected',
+            content: <WinsRejectedList />,
+          },
           [urls.companies.exportWins.sent()]: {
             label: 'Sent',
             content: <WinsSentList />,
@@ -39,4 +44,4 @@ const ExportWins = ({ location }) => {
   )
 }
 
-export default ExportWins
+export default ExportWinsTabNav

src/client/modules/ExportWins/Status/Redirect.jsx

@@ -0,0 +1,11 @@
+import React from 'react'
+import { Redirect } from 'react-router-dom'
+
+import urls from '../../../../lib/urls'
+
+// Redirect from /exportwins to /exportwins/rejected
+const ExportsWinsRedirect = () => (
+  <Redirect to={urls.companies.exportWins.rejected()} />
+)
+
+export default ExportsWinsRedirect

src/client/modules/ExportWins/Status/WinsRejectedList.jsx

@@ -0,0 +1,63 @@
+import React from 'react'
+import { Link as ReactRouterLink } from 'react-router-dom'
+import { Button } from 'govuk-react'
+import styled from 'styled-components'
+
+import ExportWinsResource from '../../../components/Resource/ExportWins'
+import { currencyGBP } from '../../../utils/number-utils'
+import { formatMediumDate } from '../../../utils/date'
+import { CollectionItem } from '../../../components'
+import { WIN_FILTERS } from './constants'
+import urls from '../../../../lib/urls'
+
+const ButtonContainer = styled('div')({
+  marginTop: 10,
+})
+
+export default () => (
+  <ExportWinsResource.Paginated
+    id="export-wins-rejected"
+    payload={{ confirmed: WIN_FILTERS.REJECTED }}
+  >
+    {(page) => (
+      <ul>
+        {page.map((item) => (
+          <li key={item.id}>
+            <CollectionItem
+              headingText={item.company.name}
+              headingUrl={urls.companies.overview.index(item.company.id)}
+              metadata={[
+                { label: 'Destination:', value: item.country.name },
+                {
+                  label: 'Contact name:',
+                  // TODO: This needs to be a link, the MetadataItem
+                  // needs to take a JSX element as a paramter.
+                  value: item.company_contacts[0].name,
+                },
+                {
+                  label: 'Total value:',
+                  value: currencyGBP(item.total_expected_export_value),
+                },
+                { label: 'Date won:', value: formatMediumDate(item.date) },
+                {
+                  label: 'Date modified:',
+                  value: formatMediumDate(item.modified_on),
+                },
+              ]}
+              buttonRenderer={() => (
+                <ButtonContainer>
+                  <Button
+                    as={ReactRouterLink}
+                    to={urls.companies.exportWins.details(item.id)}
+                  >
+                    Review export win
+                  </Button>
+                </ButtonContainer>
+              )}
+            />
+          </li>
+        ))}
+      </ul>
+    )}
+  </ExportWinsResource.Paginated>
+)

src/client/modules/ExportWins/Status/WinsSentList.jsx

@@ -0,0 +1,58 @@
+import React from 'react'
+import { Link as ReactRouterLink } from 'react-router-dom'
+import { Button } from 'govuk-react'
+import styled from 'styled-components'
+
+import ExportWinsResource from '../../../components/Resource/ExportWins'
+import { currencyGBP } from '../../../utils/number-utils'
+import { formatMediumDate } from '../../../utils/date'
+import { CollectionItem } from '../../../components'
+import { WIN_FILTERS } from './constants'
+import urls from '../../../../lib/urls'
+
+const ButtonContainer = styled('div')({
+  marginTop: 10,
+})
+
+export default () => (
+  <ExportWinsResource.Paginated
+    id="export-wins-sent"
+    payload={{ confirmed: WIN_FILTERS.SENT }}
+  >
+    {(page) => (
+      <ul>
+        {page.map((item) => (
+          <li key={item.id}>
+            <CollectionItem
+              headingText={item.company.name}
+              headingUrl={urls.companies.overview.index(item.company.id)}
+              metadata={[
+                { label: 'Destination: ', value: item.country.name },
+                {
+                  label: 'Contact name:',
+                  // TODO: This needs to be a link, the MetadataItem
+                  // needs to take a JSX element
+                  value: item.company_contacts[0].name,
+                },
+                {
+                  label: 'Total value: ',
+                  value: currencyGBP(item.total_expected_export_value),
+                },
+                { label: 'Date won: ', value: formatMediumDate(item.date) },
+                { label: 'First sent: ', value: '???' },
+                { label: 'Last sent: ', value: '???' },
+              ]}
+              buttonRenderer={() => (
+                <ButtonContainer>
+                  <Button as={ReactRouterLink} onClick={() => alert('TODO')}>
+                    Resend export win
+                  </Button>
+                </ButtonContainer>
+              )}
+            />
+          </li>
+        ))}
+      </ul>
+    )}
+  </ExportWinsResource.Paginated>
+)

src/client/modules/ExportWins/WinsWonTable.jsx → src/client/modules/ExportWins/Status/WinsWonTable.jsx

@@ -3,11 +3,11 @@ import { Link as ReactRouterLink } from 'react-router-dom'
 import { Table, Link } from 'govuk-react'
 import styled from 'styled-components'
 
-import ExportWinsResource from '../../components/Resource/ExportWins'
-import { currencyGBP } from '../../utils/number-utils'
-import { formatMediumDate } from '../../utils/date'
+import ExportWinsResource from '../../../components/Resource/ExportWins'
+import { currencyGBP } from '../../../utils/number-utils'
+import { formatMediumDate } from '../../../utils/date'
 import { WIN_FILTERS } from './constants'
-import urls from '../../../lib/urls'
+import urls from '../../../../lib/urls'
 
 const NoWrapCell = styled(Table.Cell)`
   white-space: nowrap;

src/client/routes.js

@@ -16,9 +16,9 @@ import {
 } from './modules/ExportPipeline/ExportForm'
 import ExportFormDelete from './modules/ExportPipeline/ExportDelete'
 import ExportDetails from './modules/ExportPipeline/ExportDetails'
-import ExportWins from './modules/ExportWins/'
+import ExportWinsTabNav from './modules/ExportWins/Status/ExportWinsTabNav'
 import { CreateExportWin, EditExportWin } from './modules/ExportWins/Form'
-import ExportWinsRedirect from './modules/ExportWins/Redirect'
+import ExportWinsRedirect from './modules/ExportWins/Status/Redirect'
 import ExportWinDetails from './modules/ExportWins/Details'
 import CompanyHierarchy from './modules/Companies/CompanyHierarchy'
 import CompanyTree from './modules/Companies/CompanyHierarchy/CompanyTree'
@@ -464,15 +464,20 @@ const routes = {
     },
   ],
   exportWins: [
+    {
+      path: '/exportwins/rejected',
+      module: 'datahub:companies',
+      component: ExportWinsTabNav,
+    },
     {
       path: '/exportwins/sent',
       module: 'datahub:companies',
-      component: ExportWins,
+      component: ExportWinsTabNav,
     },
     {
       path: '/exportwins/won',
       module: 'datahub:companies',
-      component: ExportWins,
+      component: ExportWinsTabNav,
     },
     {
       path: '/exportwins',

src/lib/urls.js

@@ -222,8 +222,9 @@ module.exports = {
       index: url('/exportwins'),
       create: url('/exportwins/create'),
       details: url('/exportwins', '/:winId/details'),
-      won: url('/exportwins/won'),
+      rejected: url('/exportwins/rejected'),
       sent: url('/exportwins/sent'),
+      won: url('/exportwins/won'),
     },
     overview: {
       index: url('/companies', '/:companyId/overview'),

test/a11y/cypress/config/urlTestExclusions.js

@@ -7,7 +7,6 @@ export const urlTestExclusions = [
   { url: '/companies/:companyId/edit-history' },
   { url: '/companies/:companyId/exports' },
   { url: '/exportwins/' },
-  { url: '/exportwins/sent/' },
   { url: '/companies/:companyId/investments/large-capital-profile' },
   { url: '/companies/:companyId/account-management' },
   { url: '/company-lists/' },
@@ -143,6 +142,7 @@ export const urlTestExclusions = [
   { url: '/oauth/sign-out/' },
   { url: '/exportwins/1/details' },
   { url: '/exportwins/sent/' },
+  { url: '/exportwins/rejected/' },
   { url: '/companies/e59a2b0f-7d84-4de7-bc1e-f70339f4255f/overview' },
   // Exclude all metadata
   { url: '/api-proxy/v4/metadata/likelihood-to-land' },