Skip to content

Commit

Permalink
Merge pull request #293 from UKHomeOffice/DRTII-696-Duplicated-non-de…
Browse files Browse the repository at this point in the history
…scriptive-page-titles

Drtii 696 duplicated non descriptive page titles
  • Loading branch information
richbirch authored Sep 30, 2024
2 parents 7b55627 + 71fc6ca commit 083a65a
Show file tree
Hide file tree
Showing 32 changed files with 1,140 additions and 970 deletions.
2 changes: 1 addition & 1 deletion build.sbt
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import sbt.Keys.resolvers

lazy val drtLibVersion = "v858"
lazy val drtLibVersion = "v898"
lazy val drtCiriumVersion = "203"
lazy val akkaHttpVersion = "10.5.3"
lazy val akkaVersion = "2.8.5"
Expand Down
2 changes: 2 additions & 0 deletions react/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
"@types/node": "^20.8.10",
"@types/react": "^18.2.36",
"@types/react-dom": "^18.2.14",
"@types/react-helmet": "^6.1.11",
"@types/sinon": "^17.0.3",
"@types/validator": "^13.11.7",
"axios": "^0.21.1",
Expand All @@ -35,6 +36,7 @@
"react": "^18.2.0",
"react-chartjs-2": "^5.2.0",
"react-dom": "^18.2.0",
"react-helmet": "^6.1.0",
"react-markdown": "^8.0.7",
"react-redux": "^8.1.3",
"react-router": "^6.18.0",
Expand Down
92 changes: 46 additions & 46 deletions react/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,66 +1,66 @@
import React, {useEffect} from 'react';
import './App.css';
import useMediaQuery from '@mui/material/useMediaQuery';
import { useTheme } from '@mui/material/styles';
import {Home} from './components/Home';
import Alerts from './components/alerts/Alerts';
import AccessRequests from './components/accessrequests/AccessRequests';
import UsersList from './components/users/UsersList';
import {Route, Routes} from "react-router-dom";
import Loading from "./components/Loading";
import Navigation from "./components/Navigation";
import {useConfig} from "./store/config";
import {Container} from "@mui/material";
import {styled} from "@mui/material/styles";
import {RegionPage} from "./components/RegionPage";
import axios from "axios";
import ApiClient from "./services/ApiClient";
import {HealthCheckEditor} from "./components/healthcheckpauseseditor/HealthCheckPausesEditor";
import {useUser} from "./store/user";
import {DropInSessionsList} from "./components/dropins/DropInSessionsList";
import {AddOrEditDropInSession} from "./components/dropins/AddOrEditDropInSession";
import {DropInSessionRegistrations} from "./components/dropins/DropInSessionRegistrations";
import {SnackbarProvider} from 'notistack';
import Link from "@mui/material/Link";
import {FeatureGuidesList} from "./components/featureguides/FeatureGuidesList";
import {AddOrEditFeatureGuide} from "./components/featureguides/AddOrEditFeatureGuide";
import {FeedbackForms} from "./components/feedback/FeedbackForms";
import {FeedbackList} from "./components/feedback/FeedbackList";
import DownloadManager from './components/downloadmanager/DownloadManager';
import {ExportConfig} from "./components/ExportConfig";
import {HealthChecks} from "./components/healthchecks/HealthChecks";
import RegionalDashboard from './components/regionalpressure/RegionalDashboard';
import RegionalDashboardDetail from './components/regionalpressure/RegionalDashboardDetail';
import React, {useEffect} from 'react'
import './App.css'
import useMediaQuery from '@mui/material/useMediaQuery'
import { useTheme } from '@mui/material/styles'
import {Home} from './components/Home'
import Alerts from './components/alerts/Alerts'
import AccessRequests from './components/accessrequests/AccessRequests'
import UsersList from './components/users/UsersList'
import {Route, Routes} from "react-router-dom"
import Loading from "./components/Loading"
import Navigation from "./components/Navigation"
import {useConfig} from "./store/config"
import {Container} from "@mui/material"
import {styled} from "@mui/material/styles"
import {RegionPage} from "./components/RegionPage"
import axios from "axios"
import ApiClient from "./services/ApiClient"
import {HealthCheckEditor} from "./components/healthcheckpauseseditor/HealthCheckPausesEditor"
import {useUser} from "./store/user"
import {DropInSessionsList} from "./components/dropins/DropInSessionsList"
import {AddOrEditDropInSession} from "./components/dropins/AddOrEditDropInSession"
import {DropInSessionRegistrations} from "./components/dropins/DropInSessionRegistrations"
import {SnackbarProvider} from 'notistack'
import Link from "@mui/material/Link"
import {FeatureGuideList} from "./components/featureguides/FeatureGuideList"
import {FeatureGuideAddOrEdit} from "./components/featureguides/FeatureGuideAddOrEdit"
import {FeedbackForms} from "./components/feedback/FeedbackForms"
import {FeedbackList} from "./components/feedback/FeedbackList"
import DownloadManager from './components/downloadmanager/DownloadManager'
import {ExportConfig} from "./components/ExportConfig"
import {HealthChecks} from "./components/healthchecks/HealthChecks"
import RegionalDashboard from './components/regionalpressure/RegionalDashboard'
import NationalDashboard from "./components/regionalpressure/NationalDashboard"

const StyledDiv = styled('div')(() => ({
textAlign: 'center',
}));
}))

const StyledContainer = styled(Container)(() => ({
textAlign: 'left',
minHeight: 500,
display: 'inline-block',
}));
}))

export const App = () => {
const {user} = useUser()
const {config} = useConfig()

const currentLocation = window.document.location;
const currentLocation = window.document.location
const logoutLink = "/oauth2/sign_out?redirect=" + currentLocation.toString()
const theme = useTheme();
const is_mobile = useMediaQuery(theme.breakpoints.down('md'));
const theme = useTheme()
const is_mobile = useMediaQuery(theme.breakpoints.down('md'))

useEffect(() => {
const trackUser = async () =>
axios
.get(ApiClient.userTrackingEndPoint)
.catch(reason => {
console.log('Unable to user tracking' + reason);
console.log('Unable to user tracking' + reason)
})

trackUser();
}, []);
trackUser()
}, [])

return (user.kind === "SignedInUser" && config.kind === "LoadedConfig") ?
<StyledDiv>
Expand Down Expand Up @@ -101,14 +101,14 @@ export const App = () => {
<Route path={"/access-requests"} element={<AccessRequests/>}/>
<Route path={"/users"} element={<UsersList/>}/>
<Route path={"/download"} element={<DownloadManager config={config.values} user={user.profile} />} />
<Route path={"/national-pressure"} element={<RegionalDashboard config={config.values} user={user.profile} />} />
<Route path={"/national-pressure/:region"} element={<RegionalDashboardDetail config={config.values} user={user.profile} />} />
<Route path={"/national-pressure"} element={<NationalDashboard config={config.values} user={user.profile} />} />
<Route path={"/national-pressure/:region"} element={<RegionalDashboard config={config.values} user={user.profile} />} />
<Route path={"/alerts"} element={<Alerts regions={config.values.portsByRegion} user={user.profile}/>}/>
<Route path={"/region/:regionName"} element={<RegionPage user={user.profile} config={config.values}/>}/>
<Route path={"/feature-guides"}>
<Route path={""} element={<FeatureGuidesList/>}/>
<Route path={"edit"} element={<AddOrEditFeatureGuide/>}/>
<Route path={"edit/:guideId"} element={<AddOrEditFeatureGuide/>}/>
<Route path={""} element={<FeatureGuideList/>}/>
<Route path={"edit"} element={<FeatureGuideAddOrEdit/>}/>
<Route path={"edit/:guideId"} element={<FeatureGuideAddOrEdit/>}/>
</Route>
<Route path={"/drop-in-sessions"}>
<Route path={""} element={<DropInSessionsList/>}/>
Expand Down
9 changes: 7 additions & 2 deletions react/src/components/ExportConfig.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,20 @@ import React from "react";
import Button from "@mui/material/Button";
import FileDownloadIcon from "@mui/icons-material/FileDownload";
import ApiClient from "../services/ApiClient";
import {Helmet} from "react-helmet";
import {adminPageTitleSuffix} from "../utils/common";

export function ExportConfig() {
return <div>
return <>
<Helmet>
<title>Export Config {adminPageTitleSuffix}</title>
</Helmet>
<h1>Export Config</h1>
<Button
sx={{maxWidth: '350px'}}
startIcon={<FileDownloadIcon/>}
href={`${ApiClient.exportConfigEndpoint}`}
target="_blank"
> Download ports config</Button>
</div>
</>
}
40 changes: 23 additions & 17 deletions react/src/components/Home.tsx
Original file line number Diff line number Diff line change
@@ -1,28 +1,34 @@
import React from 'react';
import React from 'react'

import AccessRequestForm from "./AccessRequestForm";
import {PortList} from "./PortList";
import {Box} from "@mui/material";
import {UserProfile} from "../model/User";
import {ConfigValues} from "../model/Config";
import AccessRequestForm from "./AccessRequestForm"
import {PortList} from "./PortList"
import {Box} from "@mui/material"
import {UserProfile} from "../model/User"
import {ConfigValues} from "../model/Config"
import {Helmet} from "react-helmet";


interface IProps {
user: UserProfile;
config: ConfigValues;
user: UserProfile
config: ConfigValues
}


export const Home = (props: IProps) => {
const isRccUser = () => {
return props.user.roles.includes("rcc:central") || props.user.roles.includes("rcc:heathrow") || props.user.roles.includes("rcc:north") || props.user.roles.includes("rcc:south")
}
const isRccUser = () => {
return props.user.roles.includes("rcc:central") || props.user.roles.includes("rcc:heathrow") || props.user.roles.includes("rcc:north") || props.user.roles.includes("rcc:south")
}

return <Box className="App-header">
{props.user.ports.length === 0 && !isRccUser() ?
<AccessRequestForm regions={props.config.portsByRegion} teamEmail={props.config.teamEmail}/> :
<PortList user={props.user} allRegions={props.config.portsByRegion} userPorts={props.user.ports}
drtDomain={props.config.domain} isRccUser={isRccUser()}/>
}
return <>
<Helmet>
<title>DRT</title>
</Helmet>
<Box className="App-header">
{props.user.ports.length === 0 && !isRccUser() ?
<AccessRequestForm regions={props.config.portsByRegion} teamEmail={props.config.teamEmail}/> :
<PortList user={props.user} allRegions={props.config.portsByRegion} userPorts={props.user.ports}
drtDomain={props.config.domain} isRccUser={isRccUser()}/>
}
</Box>
</>
}
95 changes: 51 additions & 44 deletions react/src/components/RegionPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ import axios from "axios";
import {useParams} from "react-router-dom";
import {StringUtils} from "../utils/StringUtils";
import ApiClient from "../services/ApiClient";
import {customerPageTitleSuffix} from "../utils/common";
import {Helmet} from "react-helmet";

interface IProps {
user: UserProfile;
Expand All @@ -31,7 +33,7 @@ export const RegionPage = (props: IProps) => {

const [downloads, setDownloads] = React.useState<Download[] | undefined>(undefined)

const { regionName } = useParams() as { regionName: string }
const {regionName = ''} = useParams()

const fetchDownloads = () => {
axios
Expand Down Expand Up @@ -62,48 +64,53 @@ export const RegionPage = (props: IProps) => {
return moment(date).format("DD/MM/YYYY")
}

const sortedDownloads = downloads ? downloads.sort((a, b) => (a.createdAt < b.createdAt ? 1 : -1)) : undefined
const sortedDownloads = downloads ? downloads.sort((a, b) => (a.createdAt < b.createdAt ? 1 : -1)) : undefined

return <div className="flex-container">
<Breadcrumbs aria-label="breadcrumb">
<Link underline="hover" color="inherit" href="/">DRT</Link>
<Typography color="text.primary">{StringUtils.ucFirst(regionName)}</Typography>
</Breadcrumbs>
{props.user.roles.includes("rcc:" + regionName.toLowerCase()) ?
<Box>
<h1>{StringUtils.ucFirst(regionName)} region</h1>
<p>You can download an arrivals export covering all port terminals in
this region.</p>
<ArrivalExport region={regionName}/>
<h2>Downloads</h2>
{sortedDownloads ?
<Grid container spacing={2}>
<Grid xs={3}><Typography fontWeight="bold">Created</Typography></Grid>
<Grid xs={6}><Typography fontWeight="bold">Date range</Typography></Grid>
<Grid xs={3}></Grid>
{sortedDownloads.map(download => {
const downloadUrl = `${ApiClient.exportRegionEndpoint}/${download.region}/${download.createdAt}`
return <>
<Grid xs={3}><Typography>{formatDateDDMMYYYYHHmm(new Date(download.createdAt))}</Typography></Grid>
<Grid xs={6}>
<Typography>{formatDateDDMMYYYY(download.startDate)} - {formatDateDDMMYYYY(download.endDate)}</Typography>
</Grid>
<Grid xs={3}><Typography>
{download.status === 'complete' ?
<Link href={downloadUrl} target={'_blank'}>Download</Link> :
download.status
}
</Typography></Grid>
</>
})}
</Grid> :
<p>No downloads yet.</p>
}
</Box> :
<Box>
<p>You don't have access to this page. To request access please get in touch with us at <a
href={"mailto:" + props.config.teamEmail}> {props.config.teamEmail}</a>.</p>
</Box>
}
</div>
return <>
<Helmet>
<title>{StringUtils.ucFirst(regionName)} - Regional Dashboard {customerPageTitleSuffix}</title>
</Helmet>
<div className="flex-container">
<Breadcrumbs aria-label="breadcrumb">
<Link underline="hover" color="inherit" href="/">DRT</Link>
<Typography color="text.primary">{StringUtils.ucFirst(regionName)}</Typography>
</Breadcrumbs>
{props.user.roles.includes("rcc:" + regionName.toLowerCase()) ?
<Box>
<h1>{StringUtils.ucFirst(regionName)} region</h1>
<p>You can download an arrivals export covering all port terminals in
this region.</p>
<ArrivalExport region={regionName}/>
<h2>Downloads</h2>
{sortedDownloads ?
<Grid container spacing={2}>
<Grid xs={3}><Typography fontWeight="bold">Created</Typography></Grid>
<Grid xs={6}><Typography fontWeight="bold">Date range</Typography></Grid>
<Grid xs={3}></Grid>
{sortedDownloads.map(download => {
const downloadUrl = `${ApiClient.exportRegionEndpoint}/${download.region}/${download.createdAt}`
return <>
<Grid xs={3}><Typography>{formatDateDDMMYYYYHHmm(new Date(download.createdAt))}</Typography></Grid>
<Grid xs={6}>
<Typography>{formatDateDDMMYYYY(download.startDate)} - {formatDateDDMMYYYY(download.endDate)}</Typography>
</Grid>
<Grid xs={3}><Typography>
{download.status === 'complete' ?
<Link href={downloadUrl} target={'_blank'}>Download</Link> :
download.status
}
</Typography></Grid>
</>
})}
</Grid> :
<p>No downloads yet.</p>
}
</Box> :
<Box>
<p>You don't have access to this page. To request access please get in touch with us at <a
href={"mailto:" + props.config.teamEmail}> {props.config.teamEmail}</a>.</p>
</Box>
}
</div>
</>
}
Loading

0 comments on commit 083a65a

Please sign in to comment.