Skip to content

Commit

Permalink
feat: add profiles
Browse files Browse the repository at this point in the history
  • Loading branch information
@lekotros
lekotros committed Dec 2, 2022
1 parent c1c13b4 commit 59f00e0
Show file tree
Hide file tree
Showing 33 changed files with 1,571 additions and 1,175 deletions.
63 changes: 22 additions & 41 deletions app/components/BugReport.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,38 @@
import EmailIcon from '@mui/icons-material/Email';
import GitHubIcon from '@mui/icons-material/GitHub';
import HelpOutlineIcon from '@mui/icons-material/HelpOutline';
import { Box, IconButton, Stack } from '@mui/material';
import Link from 'next/link';
import React from 'react';
import DockerIcon from './icons/DockerIcon';
import theme from '../styles/theme';

const BugReport = () => {
const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);

const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
setAnchorEl(event.currentTarget);
};

const handleClose = () => {
setAnchorEl(null);
};

const open = Boolean(anchorEl);
const id = open ? 'simple-popover' : undefined;
import EmailIcon from '@mui/icons-material/Email'
import GitHubIcon from '@mui/icons-material/GitHub'
import { Box, IconButton, Stack } from '@mui/material'
import Link from 'next/link'
import React from 'react'
import DockerIcon from './icons/DockerIcon'

const BugReport = (): JSX.Element => {
return (
<Box
sx={{
position: 'absolute',
top: '10px',
right: '10px',
right: '10px'
}}
>
<Stack>
<Link href="https://github.com/ITxPT/DATA4PTTools">
<a target="_blank">
<IconButton color="primary">
<GitHubIcon />
</IconButton>
</a>
</Link>
<Link href="https://hub.docker.com/r/lekojson/greenlight">
<a target="_blank">
<IconButton color="primary">
<DockerIcon />
</IconButton>
</a>
</Link>
<Link passHref href="mailto:[email protected];[email protected];[email protected]">
<a href="https://github.com/ITxPT/DATA4PTTools" target="_blank" rel="noreferrer">
<IconButton color="primary">
<GitHubIcon />
</IconButton>
</a>
<a href="https://hub.docker.com/r/lekojson/greenlight" target="_blank" rel="noreferrer">
<IconButton color="primary">
<DockerIcon />
</IconButton>
</a>
<Link href="mailto:[email protected];[email protected];[email protected]">
<IconButton color="primary">
<EmailIcon />
</IconButton>
</Link>
</Stack>
</Box>
);
};
)
}

export default BugReport;
export default BugReport
57 changes: 57 additions & 0 deletions app/components/CardButton.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import ChevronRightIcon from '@mui/icons-material/ChevronRight'
import { Box, Card, CardContent } from '@mui/material'
import { grey, blue } from '@mui/material/colors'
import { lighten } from '@mui/material/styles'
import React from 'react'

export interface CardButtonProps {
children: JSX.Element[] | JSX.Element | string
onClick?: () => void
}

const CardButton = ({
children,
onClick
}: CardButtonProps): JSX.Element => {
const handleOnClick = (): void => {
if (onClick !== undefined) {
onClick()
}
}

return (
<Card
sx={{
borderRadius: 4,
cursor: 'pointer',
position: 'relative',
border: `1px solid ${grey[300]}`,
background: 'white',
transition: 'background-color 150ms, border-color 150ms',
'&:hover': {
borderColor: blue[200],
backgroundColor: lighten(blue[50], 0.4)
}
}}
>
<CardContent onClick={handleOnClick}>
{ children }
<Box
sx={{
position: 'absolute',
top: 0,
right: 0,
bottom: 0,
padding: '14px',
display: 'flex',
alignItems: 'center'
}}
>
<ChevronRightIcon />
</Box>
</CardContent>
</Card>
)
}

export default CardButton
147 changes: 147 additions & 0 deletions app/components/CustomConfiguration.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,147 @@
import {
Button,
FormControl,
InputLabel,
MenuItem,
Select,
SelectChangeEvent,
Stack,
Typography
} from '@mui/material'
import ChevronRightIcon from '@mui/icons-material/ChevronRight'
import React from 'react'
import { Profile, Script } from '../api/types'
import scriptData from '../public/scripts.json'

const scriptOptions = scriptData.filter(v => v.name !== 'xsd')
.map(v => ({
value: v.name,
label: v.description
}))

const Caption = ({
children
}: {
children: JSX.Element | string
}): JSX.Element => {
return (
<Typography variant="caption" component="span">{children}</Typography>
)
}

export interface CustomConfigurationProps {
onNext: (profile: Profile) => void
}

const CustomConfiguration = (props: CustomConfigurationProps): JSX.Element => {
const [schema, setSchema] = React.useState<string>('[email protected]')
const [scripts, setScripts] = React.useState<string[]>(scriptOptions.map(v => v.value))

const handleSelectSchema = (event: SelectChangeEvent): void => {
if (event.target?.name === '') {
return
}

setSchema(event.target.value)
}

const handleSelectScripts = (event: SelectChangeEvent): void => {
if (event.target?.name === '' || !Array.isArray(event.target.value)) {
return
}

setScripts(event.target.value)
}

const handleNextClick = (): void => {
const xsdScript = {
...scriptData.find(v => v.name === 'xsd'),
config: { schema }
}

props.onNext({
name: 'custom',
description: 'Custom configuration',
scripts: [xsdScript as Script, ...scripts.map(name => scriptData.find(v => v.name === name) as Script)]
})
}

return (
<Stack spacing={4}>
<Stack spacing={2}>
<Typography variant="h5">Schema</Typography>
<Typography><b>1.</b> Begin by selecting which schema to validate against</Typography>
<Typography>
<ul style={{ marginTop: 0 }}>
<li>NeTEx - The full NeTEx schema (<a href="https://github.com/NeTEx-CEN/NeTEx" target="_blank" rel="noreferrer">more info</a>)</li>
<li>NeTEx Light - NeTEx schema without constraint (<a href="https://data4pt.org/wiki/NeTEX#NeTEx-Light" target="_blank" rel="noreferrer">more info</a>)</li>
<li>EPIP - NeTEx European Passenger Information Profile (<a href="https://data4pt.org/NeTEx/GraphicKit/Documention_of_XSD_for_EPIP.html" target="_blank" rel="noreferrer">more info</a>)</li>
<li>EPIP Light - NeTEx European Passenger Information Profile</li>
</ul>
</Typography>
<FormControl>
<InputLabel id="netex-schema-label">Schema</InputLabel>
<Select
labelId="netex-schema-label"
name="netex-schema"
value={schema}
onChange={handleSelectSchema}
>
<MenuItem key="netex" value="[email protected]">NeTEx (v1.2)</MenuItem>
<MenuItem key="netex-light" value="[email protected]">NeTEx Light (v1.2)</MenuItem>
<MenuItem key="epip" value="[email protected]">EPIP (v1.1.1)</MenuItem>
<MenuItem key="epip-light" value="[email protected]">EPIP Light (v1.1.1)</MenuItem>
</Select>
</FormControl>
</Stack>
<Stack spacing={2}>
<Typography variant="h5">Rules</Typography>
<Typography><b>2.</b> In addition to the schema validation, we have also included a few optional rules that validate the consistency of the documents (work in progress)</Typography>
<Typography>
<ul style={{ marginTop: 0 }}>
<li><i>Every line is referenced</i> - Make sure every Line <Caption>{'<Line />'}</Caption> is referenced from another element.</li>
<li><i>Every scheduled stop point has a name</i> - Make sure every <Caption>{'<ScheduledStopPoint />'}</Caption> has a <Caption>{'<Name />'}</Caption> or <Caption>{'<ShortName />'}</Caption>.</li>
<li><i>Every stop place has a correct stop place type</i> - Make sure every <Caption>{'<StopPlace />'}</Caption> has a <Caption>{'<stopPlaceType />'}</Caption> and that it is of correct type.</li>
<li><i>Every stop place has a name</i> - Make sure every <Caption>{'<StopPlace />'}</Caption> has a name.</li>
<li><i>Every stop place is referenced</i> - Make sure every <Caption>{'<StopPlace />'}</Caption> is referenced from another element.</li>
<li><i>Every stop point have an arrival and departure time</i> - Make sure every <Caption>{'<ScheduledStopPointRef />'}</Caption> have an <Caption>{'<ArrivalTime />'}</Caption> and <Caption>{'<DepartureTime />'}</Caption>.</li>
<li><i>Frame defaults have a locale and timezone</i> - Validates the correctness of <Caption>{'<DefaultLocale />'}</Caption> and <Caption>{'<TimeZone />'}</Caption> inside <Caption>{'<FrameDefaults />'}</Caption>.</li>
<li><i>Locations are referencing the same point</i> - Make sure every <Caption>{'<Location />'}</Caption> in <Caption>{'<StopPlace />'}</Caption> and <Caption>{'<ScheduledStopPoint />'}</Caption> for the same <Caption>{'<StopAssignment />'}</Caption> are pointing to the same coordinates.</li>
<li><i>Passing times have increasing times</i> - Make sure passing times have increasing times and day offsets.</li>
<li><i>Stop place quay distance is reasonable</i> - Check the distance between a <Caption>{'<StopPlace />'}</Caption> and its <Caption>{'<Quay />'}</Caption>{'\''}s.</li>
</ul>
</Typography>
<FormControl>
<InputLabel id="scripts-label">Rules</InputLabel>
<Select
labelId="scripts-label"
name="scripts"
value={scripts as any}
multiple
onChange={handleSelectScripts}
>
{ scriptOptions.map(opt => (
<MenuItem
key={opt.value}
value={opt.value}
>
{opt.label}
</MenuItem>
)) }
</Select>
</FormControl>
</Stack>
<Stack alignItems="center">
<Button
variant="contained"
endIcon={<ChevronRightIcon />}
onClick={handleNextClick}
>
Next
</Button>
</Stack>
</Stack>
)
}

export default CustomConfiguration
21 changes: 11 additions & 10 deletions app/components/ErrorAlert.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
import { Alert, Snackbar } from '@mui/material';
import { Alert, Snackbar } from '@mui/material'
import React from 'react'

export type ErrorAlertProps = {
message: string;
open: boolean;
onClose: () => void;
export interface ErrorAlertProps {
message: string
open: boolean
onClose: () => void
}

const ErrorAlert = (props: ErrorAlertProps) => {
const { message, open, onClose } = props;
const ErrorAlert = (props: ErrorAlertProps): JSX.Element => {
const { message, open, onClose } = props

return (
<Snackbar
Expand All @@ -16,7 +17,7 @@ const ErrorAlert = (props: ErrorAlertProps) => {
>
<Alert severity="error" onClose={onClose}>{message}</Alert>
</Snackbar>
);
};
)
}

export default ErrorAlert;
export default ErrorAlert
Loading

0 comments on commit 59f00e0

Please sign in to comment.