system-praktyk-front/src/pages/main.tsx
2020-07-13 23:10:05 +02:00

66 lines
2.5 KiB
TypeScript

import React from "react";
import { Page } from "@/pages/base";
import { Container, Typography, Button, Divider, Box, Stepper, Step, StepLabel, StepContent, Link } from "@material-ui/core";
import { InternshipForm } from "@/forms/Internship";
import { Link as RouterLink } from "react-router-dom";
import { route } from "@/routing";
import { useTranslation } from "react-i18next";
export const MainPage = () => {
const { t } = useTranslation();
return <Page my={6}>
<Container>
<Typography variant="h2">{ t("sections.my-internship.header") }</Typography>
<Stepper orientation="vertical" nonLinear>
<Step completed active={false}>
<StepLabel>
{ t('steps.personal-data.header') }
<Box>
<Typography variant="subtitle2" color="textSecondary">{ t('until', { date: '05.07.2020' }) }</Typography>
</Box>
</StepLabel>
</Step>
<Step active>
<StepLabel>{ t('steps.internship-proposal.header')}</StepLabel>
<StepContent>
<Button to={ route("internship_proposal") } variant="contained" color="primary" component={ RouterLink }>
{ t('steps.internship-proposal.form') }
</Button>
</StepContent>
</Step>
</Stepper>
</Container>
</Page>
}
export const InternshipFormPage = () => {
return <Page title="Zgłoszenie praktyki">
<Page.Header maxWidth="md">
<Page.Breadcrumbs>
<Link component={ RouterLink } to={ route("home") }>Moja praktyka</Link>
<Typography color="textPrimary">Zgłoszenie praktyki</Typography>
</Page.Breadcrumbs>
<Page.Title>Zgłoszenie praktyki</Page.Title>
</Page.Header>
<Container maxWidth={"md"}>
<InternshipForm />
</Container>
</Page>
}
export const NotFoundPage = () => {
return <Page title="Strona nie została znaleziona">
<Container>
<Typography variant="h1">404</Typography>
<Typography variant="h2">Strona nie została znaleziona</Typography>
<Box my={ 4 }>
<Divider variant="fullWidth" />
</Box>
<Button to={ route("home") } color="primary" component={ RouterLink }>strona główna</Button>
</Container>
</Page>
}