diff --git a/src/components/AuthUser/Dashboard/Dashboard.tsx b/src/components/AuthUser/Dashboard/Dashboard.tsx
index 6f3b00ae15e4a24e3c81b9f7dfbdc779b0238aac..452ed8fe75e028537f14cda215f819de93566e8e 100644
--- a/src/components/AuthUser/Dashboard/Dashboard.tsx
+++ b/src/components/AuthUser/Dashboard/Dashboard.tsx
@@ -1,14 +1,16 @@
import React, { FC } from 'react';
import Container from '@material-ui/core/Container';
import { Route, useRouteMatch } from 'react-router-dom';
-import { NonAuthRoutes } from 'api/routes';
-import { HomePage } from './HomePage/HomePage';
+import { AuthRoutes } from 'api/routes';
+import { HomePage } from 'components/AuthUser/Dashboard/HomePage/HomePage';
+import { ProfilePage } from 'components/AuthUser/Dashboard/ProfilePage/ProfilePage';
export const Dashboard: FC = () => {
const { path } = useRouteMatch();
return (
<Container maxWidth="sm">
- <Route path={`${path}/home`} component={HomePage} />
+ <Route exact path={`${path}${AuthRoutes.home}`} component={HomePage} />
+ <Route path={`${path}${AuthRoutes.profile}`} component={ProfilePage} />
</Container>
);
};
diff --git a/src/components/AuthUser/Dashboard/HomePage/HomePage.tsx b/src/components/AuthUser/Dashboard/HomePage/HomePage.tsx
index 99b3448459007f960afbfdacbfefac747d0e5d9a..972aa96cb568187105ff752f659aeb72fbe89c70 100644
--- a/src/components/AuthUser/Dashboard/HomePage/HomePage.tsx
+++ b/src/components/AuthUser/Dashboard/HomePage/HomePage.tsx
@@ -1,13 +1,18 @@
import React, { FC } from 'react';
import { createStyles, Theme, makeStyles } from '@material-ui/core/styles';
-import Drawer from '@material-ui/core/Drawer';
-import AppBar from '@material-ui/core/AppBar';
-import CssBaseline from '@material-ui/core/CssBaseline';
-import Toolbar from '@material-ui/core/Toolbar';
-import List from '@material-ui/core/List';
-import Typography from '@material-ui/core/Typography';
-import ListItem from '@material-ui/core/ListItem';
-import ListItemText from '@material-ui/core/ListItemText';
+
+import { AuthRoutes } from 'api/routes';
+import {
+ AppBar,
+ Toolbar,
+ Typography,
+ Button,
+ Drawer,
+ List,
+ ListItem,
+ ListItemText,
+} from '@material-ui/core';
+import { Link } from 'react-router-dom';
const drawerWidth = 240;
@@ -41,12 +46,14 @@ export const HomePage: FC = () => {
return (
<div className={classes.root}>
- <CssBaseline />
<AppBar position="fixed" className={classes.appBar}>
<Toolbar>
<Typography variant="h6" noWrap>
Moveaid
</Typography>
+ <Button variant="contained">
+ <Link to={`/dashboard${AuthRoutes.profile}`}>Profile</Link>
+ </Button>
</Toolbar>
</AppBar>
<Drawer
diff --git a/src/components/AuthUser/HomePage/HomePage.tsx b/src/components/AuthUser/HomePage/HomePage.tsx
deleted file mode 100644
index 99b3448459007f960afbfdacbfefac747d0e5d9a..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/HomePage/HomePage.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-import React, { FC } from 'react';
-import { createStyles, Theme, makeStyles } from '@material-ui/core/styles';
-import Drawer from '@material-ui/core/Drawer';
-import AppBar from '@material-ui/core/AppBar';
-import CssBaseline from '@material-ui/core/CssBaseline';
-import Toolbar from '@material-ui/core/Toolbar';
-import List from '@material-ui/core/List';
-import Typography from '@material-ui/core/Typography';
-import ListItem from '@material-ui/core/ListItem';
-import ListItemText from '@material-ui/core/ListItemText';
-
-const drawerWidth = 240;
-
-const useStyles = makeStyles((theme: Theme) =>
- createStyles({
- root: {
- display: 'flex',
- },
- appBar: {
- zIndex: theme.zIndex.drawer + 1,
- },
- drawer: {
- width: drawerWidth,
- flexShrink: 0,
- },
- drawerPaper: {
- width: drawerWidth,
- },
- drawerContainer: {
- overflow: 'auto',
- },
- content: {
- flexGrow: 1,
- padding: theme.spacing(3),
- },
- }),
-);
-
-export const HomePage: FC = () => {
- const classes = useStyles();
-
- return (
- <div className={classes.root}>
- <CssBaseline />
- <AppBar position="fixed" className={classes.appBar}>
- <Toolbar>
- <Typography variant="h6" noWrap>
- Moveaid
- </Typography>
- </Toolbar>
- </AppBar>
- <Drawer
- className={classes.drawer}
- variant="permanent"
- classes={{
- paper: classes.drawerPaper,
- }}
- >
- <Toolbar />
- <div className={classes.drawerContainer}>
- <List>
- {['Reservation'].map((text) => (
- <ListItem button key={text}>
- <ListItemText primary={text} />
- </ListItem>
- ))}
- </List>
- </div>
- </Drawer>
- <main className={classes.content}>
- <Toolbar />
- <Typography paragraph>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
- eiusmod tempor incididunt ut labore et dolore magna aliqua. Rhoncus
- dolor purus non enim praesent elementum facilisis leo vel. Risus at
- ultrices mi tempus imperdiet. Semper risus in hendrerit gravida rutrum
- quisque non tellus. Convallis convallis tellus id interdum velit
- laoreet id donec ultrices. Odio morbi quis commodo odio aenean sed
- adipiscing. Amet nisl suscipit adipiscing bibendum est ultricies
- integer quis. Cursus euismod quis viverra nibh cras. Metus vulputate
- eu scelerisque felis imperdiet proin fermentum leo. Mauris commodo
- quis imperdiet massa tincidunt. Cras tincidunt lobortis feugiat
- vivamus at augue. At augue eget arcu dictum varius duis at consectetur
- lorem. Velit sed ullamcorper morbi tincidunt. Lorem donec massa sapien
- faucibus et molestie ac.
- </Typography>
- <Typography paragraph>
- Consequat mauris nunc congue nisi vitae suscipit. Fringilla est
- ullamcorper eget nulla facilisi etiam dignissim diam. Pulvinar
- elementum integer enim neque volutpat ac tincidunt. Ornare suspendisse
- sed nisi lacus sed viverra tellus. Purus sit amet volutpat consequat
- mauris. Elementum eu facilisis sed odio morbi. Euismod lacinia at quis
- risus sed vulputate odio. Morbi tincidunt ornare massa eget egestas
- purus viverra accumsan in. In hendrerit gravida rutrum quisque non
- tellus orci ac. Pellentesque nec nam aliquam sem et tortor. Habitant
- morbi tristique senectus et. Adipiscing elit duis tristique
- sollicitudin nibh sit. Ornare aenean euismod elementum nisi quis
- eleifend. Commodo viverra maecenas accumsan lacus vel facilisis. Nulla
- posuere sollicitudin aliquam ultrices sagittis orci a.
- </Typography>
- </main>
- </div>
- );
-};
diff --git a/src/components/AuthUser/HomePage/MapElement.tsx b/src/components/AuthUser/HomePage/MapElement.tsx
deleted file mode 100644
index 89f7d3cdc2dc722f1075d079fd94730666af226f..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/HomePage/MapElement.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-/* eslint-disable react/jsx-props-no-spreading */
-import * as React from 'react';
-
-export const MapElement: React.FC = (props: React.SVGProps<SVGSVGElement>) => (
- <svg
- data-name="Layer 1"
- xmlns="http://www.w3.org/2000/svg"
- width={425}
- height={364.74}
- viewBox="0 0 923.8 753.71"
- {...props}
- >
- <title>map</title>
- <ellipse
- cx={1007.29}
- cy={789.73}
- rx={19.99}
- ry={48.53}
- transform="rotate(-45 849.945 919.851)"
- fill="#fff"
- opacity={0.1}
- />
- <ellipse cx={872.63} cy={705.7} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={872.63} cy={688.53} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={872.63} cy={671.36} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={872.63} cy={654.19} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={872.63} cy={637.02} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={872.63} cy={619.85} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={872.63} cy={602.68} rx={10.73} ry={14.05} fill="#3f3d56" />
- <path
- d="M912.8 485.18a51.13 51.13 0 004-5.88l-28.2-4.63 30.5.22a51.54 51.54 0 001-40.73l-40.91 21.23 37.71-27.74a51.41 51.41 0 10-84.9 57.53 51.16 51.16 0 00-5.86 9.37l36.6 19-39-13.1a51.45 51.45 0 008.29 48.27 51.4 51.4 0 1080.8 0 51.41 51.41 0 000-63.56z"
- fill="#fff"
- />
- <path
- d="M821 516.96a51.16 51.16 0 0011 31.78 51.4 51.4 0 1080.8 0c6.89-8.74-91.8-37.55-91.8-31.78z"
- opacity={0.1}
- />
- <path
- fill="#444053"
- d="M846.97 0v720l-244-34-296.61 60.51-2.39.49-236-65V56l245-56 268 56 10.19-2.15L846.97 0z"
- />
- <path
- fill="#fff"
- d="M805.97 39.32v644.21l-218.31-30.42-265.39 54.14-2.14.43-211.16-58.15V89.42l219.22-50.1 239.78 50.1 9.12-1.92 228.88-48.18z"
- />
- <path
- opacity={0.1}
- d="M602.97 686l-296.61 60.51L312.97 0l268 56 10.19-2.15L602.97 686z"
- />
- <g
- opacity={0.3}
- fill="none"
- stroke="#444053"
- strokeMiterlimit={10}
- strokeWidth={3}
- >
- <path d="M573.35 138l.12 209.5h87v-86h149l17.5-22.44M88.97 204.5h323.5l20-9h8v202h140l6 18v91h108V619M483.2 619V397.5M826.97 559.66H483.2M740.87 138v481M87.97 517.14h739M177.91 619V138M349.69 138v481M88.97 259.5l571.5 2M255.3 138.87V619" />
- <path d="M87.97 370.82h261.72L483.2 517.14M512.12 138v259.5M483.2 443.98h343.77" />
- </g>
- <path fill="#fff" d="M585.97 442h-101v-44l95.5-.5 6 17-.5 27.5z" />
- <path
- d="M535.97 214a55.28 55.28 0 00-55.28 55.28c0 30.53 55.28 129.72 55.28 129.72s55.28-99.15 55.28-129.72A55.28 55.28 0 00535.97 214zm0 78.86a24.32 24.32 0 1124.32-24.32 24.32 24.32 0 01-24.32 24.31z"
- fill="#fff"
- />
- <path
- d="M535.97 214a55.28 55.28 0 00-55.28 55.28c0 30.53 55.28 129.72 55.28 129.72s55.28-99.15 55.28-129.72A55.28 55.28 0 00535.97 214zm0 78.86a24.32 24.32 0 1124.32-24.32 24.32 24.32 0 01-24.32 24.31z"
- opacity={0.1}
- />
- <path
- d="M535.97 222a55.28 55.28 0 00-55.28 55.28c0 30.53 55.28 129.72 55.28 129.72s55.28-99.15 55.28-129.72A55.28 55.28 0 00535.97 222zm0 78.86a24.32 24.32 0 1124.32-24.32 24.32 24.32 0 01-24.32 24.31z"
- fill="#fff"
- />
- <ellipse
- cx={649.86}
- cy={806.61}
- rx={33.45}
- ry={13.78}
- transform="rotate(-23.3 403.328 1104.861)"
- fill="#fff"
- opacity={0.1}
- />
- <ellipse cx={511.39} cy={727.97} rx={7.4} ry={9.68} fill="#3f3d56" />
- <ellipse cx={511.39} cy={716.13} rx={7.4} ry={9.68} fill="#3f3d56" />
- <ellipse cx={511.39} cy={704.3} rx={7.4} ry={9.68} fill="#3f3d56" />
- <ellipse cx={511.39} cy={692.47} rx={7.4} ry={9.68} fill="#3f3d56" />
- <ellipse cx={511.39} cy={680.63} rx={7.4} ry={9.68} fill="#3f3d56" />
- <ellipse cx={511.39} cy={668.8} rx={7.4} ry={9.68} fill="#3f3d56" />
- <ellipse cx={511.39} cy={656.97} rx={7.4} ry={9.68} fill="#3f3d56" />
- <path
- d="M483.7 575.98a36.12 36.12 0 01-2.76-4l19.44-3.2-21 .16a35.54 35.54 0 01-.68-28.07l28.2 14.58-26-19.12a35.43 35.43 0 1158.51 39.65 35.55 35.55 0 014 6.46l-25.21 13.11 26.9-9a35.45 35.45 0 01-5.71 33.27 35.43 35.43 0 11-55.69 0 35.44 35.44 0 010-43.81z"
- fill="#fff"
- />
- <path
- d="M546.97 597.85a35.28 35.28 0 01-7.58 21.91 35.43 35.43 0 11-55.69 0c-4.75-6 63.27-25.85 63.27-21.91z"
- opacity={0.1}
- />
- <ellipse
- cx={186.29}
- cy={767.73}
- rx={19.99}
- ry={48.53}
- transform="rotate(-45 28.942 897.852)"
- fill="#fff"
- opacity={0.1}
- />
- <ellipse cx={51.63} cy={683.7} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={51.63} cy={666.53} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={51.63} cy={649.36} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={51.63} cy={632.19} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={51.63} cy={615.02} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={51.63} cy={597.85} rx={10.73} ry={14.05} fill="#3f3d56" />
- <ellipse cx={51.63} cy={580.68} rx={10.73} ry={14.05} fill="#3f3d56" />
- <path
- d="M91.8 463.18a51.13 51.13 0 004-5.88l-28.2-4.63 30.5.22a51.54 51.54 0 001-40.73l-40.91 21.23 37.71-27.74A51.41 51.41 0 1011 463.18a51.16 51.16 0 00-5.86 9.37l36.6 19-39-13.1a51.45 51.45 0 008.29 48.27 51.4 51.4 0 1080.8 0 51.41 51.41 0 000-63.56z"
- fill="#fff"
- />
- <path
- d="M0 494.96a51.16 51.16 0 0011 31.78 51.4 51.4 0 1080.8 0C98.69 518 0 489.19 0 494.96z"
- opacity={0.1}
- />
- </svg>
-);
diff --git a/src/components/AuthUser/HomePage/NavBar.tsx b/src/components/AuthUser/HomePage/NavBar.tsx
deleted file mode 100644
index 3d61c755d485269fafd3f0e547f58782e71c574f..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/HomePage/NavBar.tsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import React, { FC } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { Tabs, Tab } from '@material-ui/core';
-import HomeIcon from '@material-ui/icons/Home';
-import ImportContactsIcon from '@material-ui/icons/ImportContacts';
-import AccountCircleIcon from '@material-ui/icons/AccountCircle';
-
-const useStyles = makeStyles(() => ({
- tabs: {
- color: 'white',
- paddingLeft: '25px',
- paddingRight: '25px',
- paddingTop: '8px',
- paddingBottom: '35px',
- width: '100%',
- flexWrap: 'wrap',
- },
- tabPan: {
- paddingLeft: '56px',
- paddingRight: '56px',
- },
- tabIcon: {
- paddingRight: '10px',
- fontSize: '38px',
- },
- rightAlign: {
- marginLeft: 'auto',
- },
-}));
-
-export const NavBar: FC = () => {
- const classes = useStyles();
-
- const [value, setValue] = React.useState(0);
-
- const handleChange = (
- event: React.ChangeEvent<unknown>,
- newValue: number,
- ): void => {
- setValue(newValue);
- };
-
- return (
- <Tabs
- variant="scrollable"
- scrollButtons="on"
- onChange={handleChange}
- value={value}
- className={classes.tabs}
- TabIndicatorProps={{ style: { display: 'none' } }}
- >
- <Tab
- label="HomePage"
- icon={<HomeIcon className={classes.tabIcon} />}
- className={classes.tabPan}
- />
- <Tab
- label="Reservation"
- icon={<ImportContactsIcon className={classes.tabIcon} />}
- className={`${classes.tabPan} ${classes.rightAlign}`}
- />
- <Tab
- label="Profile"
- className={classes.tabPan}
- icon={<AccountCircleIcon className={classes.tabIcon} />}
- />
- </Tabs>
- );
-};
diff --git a/src/components/AuthUser/HomePage/NavBarLogin.tsx b/src/components/AuthUser/HomePage/NavBarLogin.tsx
deleted file mode 100644
index 92d00454f5ddc811637f6353b520f89db0cbcebe..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/HomePage/NavBarLogin.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import React, { FC } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { Tabs, Tab } from '@material-ui/core';
-import LockIcon from '@material-ui/icons/Lock';
-
-const useStyles = makeStyles(() => ({
- tabs: {
- color: 'white',
- paddingLeft: '25px',
- paddingRight: '25px',
- paddingTop: '8px',
- paddingBottom: '35px',
- },
- tabPan: {
- paddingLeft: '56px',
- paddingRight: '56px',
- },
- tabIcon: {
- paddingRight: '10px',
- fontSize: '38px',
- },
- rightAlign: {
- marginLeft: 'auto',
- backgroundColor: '#FFFFFF',
- },
-}));
-
-export const NavBarLogin: FC = () => {
- const classes = useStyles();
-
- const [value, setValue] = React.useState(0);
-
- const handleChange = (
- event: React.ChangeEvent<unknown>,
- newValue: number,
- ): void => {
- setValue(newValue);
- };
-
- return (
- <Tabs
- textColor="primary"
- onChange={handleChange}
- value={value}
- className={classes.tabs}
- TabIndicatorProps={{ style: { display: 'none' } }}
- >
- <Tab label="" className={classes.tabPan} />
- <Tab
- label="Login"
- icon={<LockIcon className={classes.tabIcon} />}
- className={`${classes.tabPan} ${classes.rightAlign}`}
- />
- </Tabs>
- );
-};
diff --git a/src/components/AuthUser/HomePage/Numbers.tsx b/src/components/AuthUser/HomePage/Numbers.tsx
deleted file mode 100644
index 20f38c870d04171411e355d21afe7ca52efba788..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/HomePage/Numbers.tsx
+++ /dev/null
@@ -1,137 +0,0 @@
-import React, { FC } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { Grid, Typography, CardContent, Card, Hidden } from '@material-ui/core';
-import LocalTaxiIcon from '@material-ui/icons/LocalTaxi';
-import LocationCityIcon from '@material-ui/icons/LocationCity';
-import PeopleIcon from '@material-ui/icons/People';
-
-const useStyles = makeStyles(() => ({
- root: {
- minHeight: '100vh',
- backgroundImage: `url(${'/assets/bg3.png'})`,
- backgroundRepeat: 'no-repeat',
- backgroundSize: 'cover',
- },
- rightAlign: {
- marginLeft: 'auto',
- },
- whiteText: {
- color: 'white',
- },
- imageIcon: {
- maxHeight: '50%',
- },
- paddingBottom: {
- paddingBottom: '65px',
- },
- paddingTop: {
- paddingTop: '65px',
- },
- bodyIcon: {
- fontSize: '90px',
- paddingBottom: '10px',
- paddingTop: '10px',
- },
- contIcon: {
- width: '100%',
- left: '0',
- right: '0',
- },
- noShadow: {
- border: 'none',
- boxShadow: 'none',
- backgroundColor: 'transparent',
- },
-}));
-
-export const Numbers: FC = () => {
- const classes = useStyles();
-
- return (
- <Grid item container alignItems="stretch" style={{ paddingTop: '20px' }}>
- <Grid item xs={1} lg={2} />
-
- <Grid item xs={4} lg={2} component={Card} className={classes.noShadow}>
- <CardContent>
- <Grid
- container
- spacing={0}
- direction="column"
- alignItems="center"
- justify="center"
- >
- <Grid item xs={12}>
- <LocalTaxiIcon color="primary" className={classes.bodyIcon} />
- </Grid>
- </Grid>
-
- <Typography variant="h4" align="center">
- 300
- </Typography>
-
- <Typography variant="h6" align="center">
- Rides Offered
- </Typography>
- </CardContent>
- </Grid>
-
- <Grid item xs={2} lg={1} />
-
- <Grid item xs={4} lg={2} component={Card} className={classes.noShadow}>
- <CardContent>
- <Grid
- container
- spacing={0}
- direction="column"
- alignItems="center"
- justify="center"
- >
- <Grid item xs={12}>
- <LocationCityIcon color="primary" className={classes.bodyIcon} />
- </Grid>
- </Grid>
-
- <Typography variant="h4" align="center">
- 25000
- </Typography>
-
- <Typography variant="h6" align="center">
- Kilometers
- </Typography>
- </CardContent>
- </Grid>
-
- <Grid item xs={1} />
-
- <Hidden lgUp>
- <Grid item xs={4} />
- </Hidden>
-
- <Grid item xs={4} lg={2} component={Card} className={classes.noShadow}>
- <CardContent>
- <Grid
- container
- spacing={0}
- direction="column"
- alignItems="center"
- justify="center"
- >
- <Grid item xs={12}>
- <PeopleIcon color="primary" className={classes.bodyIcon} />
- </Grid>
- </Grid>
-
- <Typography variant="h4" align="center">
- 225
- </Typography>
-
- <Typography variant="h6" align="center">
- People who used our service
- </Typography>
- </CardContent>
- </Grid>
-
- <Grid item xs={4} lg={2} />
- </Grid>
- );
-};
diff --git a/src/components/AuthUser/HomePage/Steps.tsx b/src/components/AuthUser/HomePage/Steps.tsx
deleted file mode 100644
index 2452c59d93467d111e979526541d69f24e409410..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/HomePage/Steps.tsx
+++ /dev/null
@@ -1,132 +0,0 @@
-import React, { FC } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { Grid, Typography, CardContent, Card, Hidden } from '@material-ui/core';
-import VpnKeyIcon from '@material-ui/icons/VpnKey';
-import BookmarkIcon from '@material-ui/icons/Bookmark';
-import RoomIcon from '@material-ui/icons/Room';
-
-const useStyles = makeStyles(() => ({
- bodyIcon: {
- fontSize: '90px',
- paddingBottom: '10px',
- paddingTop: '10px',
- },
- paddingBot: {
- paddingBottom: '40px',
- },
- noShadow: {
- border: 'none',
- boxShadow: 'none',
- backgroundColor: 'transparent',
- },
-}));
-
-export const Steps: FC = () => {
- const classes = useStyles();
-
- return (
- <Grid item container alignItems="stretch">
- <Grid item xs={1} lg={2} />
-
- <Grid item xs={10} lg={2} component={Card} className={classes.paddingBot}>
- <CardContent>
- <Typography variant="h4" align="center">
- STEP 1
- </Typography>
-
- <Grid
- container
- spacing={0}
- direction="column"
- alignItems="center"
- justify="center"
- >
- <Grid item xs={12}>
- <VpnKeyIcon color="primary" className={classes.bodyIcon} />
- </Grid>
- </Grid>
-
- <Typography variant="h6">
- Log In or Register an account on the site. Fill all the fields
- related to your personal information.
- </Typography>
- </CardContent>
- </Grid>
-
- <Grid item xs={1} />
-
- <Hidden lgUp>
- <Grid
- item
- xs={12}
- component={Card}
- className={`${classes.paddingBot} ${classes.noShadow}`}
- />
- <Grid item xs={1} />
- </Hidden>
-
- <Grid item xs={10} lg={2} component={Card} className={classes.paddingBot}>
- <CardContent>
- <Typography variant="h4" align="center">
- STEP 2
- </Typography>
-
- <Grid
- container
- spacing={0}
- direction="column"
- alignItems="center"
- justify="center"
- >
- <Grid item xs={12}>
- <BookmarkIcon color="primary" className={classes.bodyIcon} />
- </Grid>
- </Grid>
-
- <Typography variant="h6">
- Book in the reservation section a free ride at least 48h than your
- appointment
- </Typography>
- </CardContent>
- </Grid>
-
- <Grid item xs={1} />
- <Hidden lgUp>
- <Grid
- item
- xs={12}
- component={Card}
- className={`${classes.paddingBot} ${classes.noShadow}`}
- />
- <Grid item xs={1} />
- </Hidden>
-
- <Grid item xs={10} lg={2} component={Card} className={classes.paddingBot}>
- <CardContent>
- <Typography variant="h4" align="center">
- STEP 3
- </Typography>
-
- <Grid
- container
- spacing={0}
- direction="column"
- alignItems="center"
- justify="center"
- >
- <Grid item xs={12}>
- <RoomIcon color="primary" className={classes.bodyIcon} />
- </Grid>
- </Grid>
-
- <Typography variant="h6">
- Wait your free drive compfortably at home and reach the place you
- have booked in the reservation easily!
- </Typography>
- </CardContent>
- </Grid>
-
- <Grid item xs={1} lg={2} />
- </Grid>
- );
-};
diff --git a/src/components/AuthUser/ProfilePage/ProfilePage.md b/src/components/AuthUser/ProfilePage/ProfilePage.md
deleted file mode 100644
index d696537a13388f6329b7732a48526d52aa5a27c1..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/ProfilePage/ProfilePage.md
+++ /dev/null
@@ -1,5 +0,0 @@
-Profile page for all type of users
-
-```js
-<ProfilePage />
-```
\ No newline at end of file
diff --git a/src/components/AuthUser/ProfilePage/ProfilePage.test.tsx b/src/components/AuthUser/ProfilePage/ProfilePage.test.tsx
deleted file mode 100644
index 8b518930c141e2eb630bfcdf6bb3efbfbafb5b89..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/ProfilePage/ProfilePage.test.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { ProfilePage } from './ProfilePage';
-
-describe('<ProfilePage />', () => {
- it('renders without crashing', () => {
- const wrapper = render(<ProfilePage />);
- expect(wrapper.queryByTestId('ProfilePage')).toBeTruthy();
- });
-});
diff --git a/src/components/AuthUser/ProfilePage/ProfilePage.tsx b/src/components/AuthUser/ProfilePage/ProfilePage.tsx
deleted file mode 100644
index bf861488aa174e961acf0ed49550801a956b4249..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/ProfilePage/ProfilePage.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React, { FC } from 'react';
-import Button from '@material-ui/core/Button';
-import axios from 'axios';
-import { NonAuthRoutes } from 'api/routes';
-import { useHistory } from 'react-router-dom';
-
-export const ProfilePage: FC = () => {
- const history = useHistory();
-
- const logout = (): void => {
- axios
- .post('/api/web/login/logout')
- .then(() => history.replace(NonAuthRoutes.home));
- };
-
- return (
- <div data-testid="ProfilePage">
- <Button variant="outlined" color="default" onClick={logout}>
- Logout
- </Button>
- </div>
- );
-};
diff --git a/src/components/AuthUser/ReservationPage/Reservation/Reservation.tsx b/src/components/AuthUser/ReservationPage/Reservation/Reservation.tsx
deleted file mode 100644
index 7bdcd177cbe2f0bfa38f73c13a692ebf9b8dbc3d..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/ReservationPage/Reservation/Reservation.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import React, { FC } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import {
- Paper,
- Table,
- TableBody,
- TableCell,
- TableContainer,
- TableHead,
- TableRow,
-} from '@material-ui/core';
-
-const useStyles = makeStyles(() => ({
- noShadow: {
- border: 'none',
- boxShadow: 'none',
- backgroundColor: 'transparent',
- },
-}));
-
-function createData(
- name: string,
- value: string,
-): { name: string; value: string } {
- return { name, value };
-}
-
-const rows = [
- createData('From:', 'Via Di Quel Bozen, 45, 39037'),
- createData('Date:', '29 / 07 / 2021'),
- createData('Time:', '12:15'),
- createData('To:', 'Via del Krankenhaus, 7, 39037'),
-];
-
-export const Reservation: FC = () => {
- const classes = useStyles();
-
- return (
- <TableContainer component={Paper}>
- <Table aria-label="simple table">
- <TableHead>
- <TableRow>
- <TableCell>DriveToHospital </TableCell>
- </TableRow>
- </TableHead>
-
- <TableBody>
- {rows.map((row) => (
- <TableRow key={row.name}>
- <TableCell component="th" scope="row">
- {row.name}
- </TableCell>
- <TableCell align="right">{row.value}</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
- </TableContainer>
- );
-};
diff --git a/src/components/AuthUser/ReservationPage/ReservationPage.test.tsx b/src/components/AuthUser/ReservationPage/ReservationPage.test.tsx
deleted file mode 100644
index 628b7b5f432b5dc81f327f0d7a03a2fc5f775bfe..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/ReservationPage/ReservationPage.test.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { ReservationPage } from './ReservationPage';
-
-describe('<ReservationPage />', () => {
- it('renders without crashing', () => {
- const wrapper = render(<ReservationPage />);
- expect(wrapper.queryByTestId('Reservation')).toBeTruthy();
- });
-});
diff --git a/src/components/AuthUser/ReservationPage/ReservationPage.tsx b/src/components/AuthUser/ReservationPage/ReservationPage.tsx
deleted file mode 100644
index cada8c6f2c50311d9ec2467773c135fc85ff9f32..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/ReservationPage/ReservationPage.tsx
+++ /dev/null
@@ -1,257 +0,0 @@
-import React, { FC } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import {
- CssBaseline,
- Grid,
- Typography,
- Hidden,
- createMuiTheme,
- responsiveFontSizes,
- MuiThemeProvider,
- Dialog,
- DialogActions,
- DialogContent,
- DialogContentText,
- DialogTitle,
- TextField,
- Button,
-} from '@material-ui/core';
-import AddIcon from '@material-ui/icons/Add';
-import Fab from '@material-ui/core/Fab';
-
-import { Reservation } from 'components/AuthUser/ReservationPage/Reservation/Reservation';
-import { NavBar } from '../HomePage/NavBar';
-
-let themeResp = createMuiTheme();
-themeResp = responsiveFontSizes(themeResp);
-
-const useStyles = makeStyles(() => ({
- root: {
- minHeight: '36vh',
- backgroundImage: `url(${'/assets/bg7.png'})`,
- backgroundRepeat: 'no-repeat',
- backgroundSize: 'cover',
- },
- rightAlign: {
- marginLeft: 'auto',
- },
- whiteText: {
- color: 'white',
- },
- imageIcon: {
- maxHeight: '50%',
- },
- paddingBottom: {
- paddingBottom: '65px',
- },
- paddingTop: {
- paddingTop: '65px',
- },
- bodyIcon: {
- fontSize: '90px',
- paddingBottom: '10px',
- paddingTop: '10px',
- },
- contIcon: {
- width: '100%',
- left: '0',
- right: '0',
- },
- noShadow: {
- border: 'none',
- boxShadow: 'none',
- backgroundColor: 'transparent',
- },
- extendedIcon: {
- fontSize: '50px',
- },
- fab: {
- margin: '10px 90px 80px 10px',
- bottom: '0',
- right: '0',
- position: 'fixed',
- padding: '45px',
- },
- fabSmall: {
- margin: '10px 45px 70px 10px',
- bottom: '0',
- right: '0',
- position: 'fixed',
- padding: '35px',
- },
-}));
-
-export const ReservationPage: FC = () => {
- const classes = useStyles();
-
- const [open, setOpen] = React.useState(false);
-
- const handleClickOpen = (): void => {
- setOpen(true);
- };
-
- const handleClose = (): void => {
- setOpen(false);
- };
-
- return (
- <div data-testid="Reservation">
- <Grid container direction="column" className={classes.paddingBottom}>
- <div className={classes.root}>
- <CssBaseline />
-
- <Grid item>
- <NavBar />
- </Grid>
-
- <Dialog
- open={open}
- onClose={handleClose}
- aria-labelledby="form-dialog-title"
- >
- <DialogTitle id="form-dialog-title">
- Book New Reservation
- </DialogTitle>
- <DialogContent>
- <DialogContentText>
- Write here below the details of your next reservation
- </DialogContentText>
- <TextField
- autoFocus
- margin="dense"
- id="name"
- label="Name Reservation"
- type="text"
- fullWidth
- />
- <TextField
- autoFocus
- margin="dense"
- id="name"
- label="Date"
- type="date"
- fullWidth
- InputLabelProps={{ shrink: true }}
- />
- <TextField
- autoFocus
- margin="dense"
- id="name"
- label="Department Time"
- type="time"
- fullWidth
- InputLabelProps={{ shrink: true }}
- />
- <TextField
- autoFocus
- margin="dense"
- id="name"
- label="Destination"
- type="text"
- fullWidth
- />
- </DialogContent>
- <DialogActions>
- <Button onClick={handleClose} color="primary">
- Cancel
- </Button>
- <Button onClick={handleClose} color="primary" variant="contained">
- Subscribe
- </Button>
- </DialogActions>
- </Dialog>
-
- <MuiThemeProvider theme={themeResp}>
- <Grid item container className={classes.paddingBottom}>
- <Grid item xs={1} md={2} lg={2} />
-
- <Grid item xs={10} md={6} lg={4}>
- <Typography variant="h2" className={classes.whiteText}>
- Plan Here Your
- </Typography>
- <Typography variant="h1" className={classes.whiteText}>
- RESERVATIONS
- </Typography>
- </Grid>
-
- <Grid item xs={1} />
- </Grid>
- </MuiThemeProvider>
- </div>
-
- <Hidden mdDown>
- <Fab
- color="primary"
- size="large"
- aria-label="add"
- className={classes.fab}
- onClick={handleClickOpen}
- >
- <AddIcon className={classes.extendedIcon} />
- </Fab>
- </Hidden>
-
- <Hidden lgUp>
- <Fab
- color="primary"
- size="small"
- aria-label="add"
- className={classes.fabSmall}
- >
- <AddIcon />
- </Fab>
- </Hidden>
-
- <Grid item container className={classes.paddingTop}>
- <Grid item xs={2} />
- <Grid item xs={8}>
- <Typography variant="h3">Your Next Reservations</Typography>
- </Grid>
- <Grid item xs={2} />
- </Grid>
-
- <Grid item container style={{ paddingTop: '20px' }}>
- <Grid item xs={1} lg={2} />
- <Grid item xs={10} lg={8}>
- <Reservation />
- </Grid>
- <Grid item xs={1} lg={2} />
- </Grid>
-
- <Grid item container style={{ paddingTop: '20px' }}>
- <Grid item xs={1} lg={2} />
- <Grid item xs={10} lg={8}>
- <Reservation />
- </Grid>
- <Grid item xs={1} lg={2} />
- </Grid>
-
- <Grid item container style={{ paddingTop: '20px' }}>
- <Grid item xs={1} lg={2} />
- <Grid item xs={10} lg={8}>
- <Reservation />
- </Grid>
- <Grid item xs={1} lg={2} />
- </Grid>
-
- <Grid item container className={classes.paddingTop}>
- <Grid item xs={2} />
- <Grid item xs={8}>
- <Typography variant="h3" align="right">
- Your Past Reservations
- </Typography>
- </Grid>
- <Grid item xs={2} />
- </Grid>
-
- <Grid item container style={{ paddingTop: '20px' }}>
- <Grid item xs={1} lg={2} />
- <Grid item xs={10} lg={8}>
- <Reservation />
- </Grid>
- <Grid item xs={1} lg={2} />
- </Grid>
- </Grid>
- </div>
- );
-};
diff --git a/src/components/AuthUser/SignInForm/SignInForm.tsx b/src/components/AuthUser/SignInForm/SignInForm.tsx
index b7c0ea3c997ededeaa613eebfde57b0fcbf02788..de15be65417186219acd40a3c04547f2192774ba 100644
--- a/src/components/AuthUser/SignInForm/SignInForm.tsx
+++ b/src/components/AuthUser/SignInForm/SignInForm.tsx
@@ -4,26 +4,19 @@ import { SubmitHandler, useForm } from 'react-hook-form';
import { Button } from '@material-ui/core';
import { InputField } from 'components/AuthUser/InputField/InputField';
import { useHistory } from 'react-router-dom';
-import { AuthRoutes } from 'api/routes';
+import { AuthRoutes, NonAuthRoutes } from 'api/routes';
import { AuthContext } from 'components/AuthUser/AuthContext';
import { useStyles } from './useStyles';
-import { fetchCookie } from './fetchCookie';
import { CredentialsType } from './CredentialsType';
-const defaultValues: CredentialsType = {
+const defaultValues = {
username: '',
password: '',
};
export const SignInForm: FC = () => {
- const [isCookieFetched, setIsCookieFetched] = useState<string>('');
-
- useEffect(() => {
- if (!isCookieFetched) fetchCookie(setIsCookieFetched);
- }, [isCookieFetched]);
-
const history = useHistory();
- const { setRole } = useContext(AuthContext);
+ const { setRole, setIsAuth } = useContext(AuthContext);
const { control, errors, setError, handleSubmit } = useForm<CredentialsType>({
defaultValues,
@@ -38,7 +31,7 @@ export const SignInForm: FC = () => {
{
username: values.username,
password: values.password,
- csrfmiddlewaretoken: isCookieFetched,
+ csrfmiddlewaretoken: localStorage.getItem('COOKIE'),
},
{
headers: {
@@ -47,6 +40,7 @@ export const SignInForm: FC = () => {
},
)
.then((response) => {
+ console.log(response);
if (response.data.status === 'fail') {
setError('username', {
type: 'server',
@@ -58,7 +52,8 @@ export const SignInForm: FC = () => {
});
} else if (response.data.status === 'success') {
setRole(response.data.role);
- history.replace(AuthRoutes.dashboard);
+ setIsAuth(true);
+ history.replace(`${AuthRoutes.dashboard}${AuthRoutes.home}`);
}
});
};
diff --git a/src/components/AuthUser/SignInForm/fetchCookie.ts b/src/components/AuthUser/SignInForm/fetchCookie.ts
deleted file mode 100644
index 206d307c8c59049e41bd9795e8547394f4054428..0000000000000000000000000000000000000000
--- a/src/components/AuthUser/SignInForm/fetchCookie.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import axios from 'axios';
-
-/**
- *
- * Ask and set csrf cookie to server.
- * @param setIsCookieFetched function to set the state isCookieFetched.
- * @returns null
- */
-export const fetchCookie = async (
- setIsCookieFetched: React.Dispatch<React.SetStateAction<string>>,
-): Promise<unknown> => {
- const response = await axios('/api/web/csrf');
- setIsCookieFetched(response.data.token);
- return null;
-};