aboutsummaryrefslogtreecommitdiff
path: root/modern/src/MainPage.js
diff options
context:
space:
mode:
authorAnton Tananaev <anton.tananaev@gmail.com>2020-07-25 12:36:19 -0700
committerAnton Tananaev <anton.tananaev@gmail.com>2020-07-25 12:36:19 -0700
commitd69bb2b2c3053c2c61e4e5d7029751debcfb0dd9 (patch)
treea8acdb87aea6c39ba1c0712186a2be1dadaff181 /modern/src/MainPage.js
parent94be29b98ef9ca509c38c2576dc56828a788937e (diff)
downloadetbsa-traccar-web-d69bb2b2c3053c2c61e4e5d7029751debcfb0dd9.tar.gz
etbsa-traccar-web-d69bb2b2c3053c2c61e4e5d7029751debcfb0dd9.tar.bz2
etbsa-traccar-web-d69bb2b2c3053c2c61e4e5d7029751debcfb0dd9.zip
Implement simple route report
Diffstat (limited to 'modern/src/MainPage.js')
-rw-r--r--modern/src/MainPage.js49
1 files changed, 15 insertions, 34 deletions
diff --git a/modern/src/MainPage.js b/modern/src/MainPage.js
index bc79247..1ab151f 100644
--- a/modern/src/MainPage.js
+++ b/modern/src/MainPage.js
@@ -1,72 +1,53 @@
-import React, { useEffect } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import { sessionActions } from './store';
-import { useHistory } from 'react-router-dom';
+import React from 'react';
+import { useSelector } from 'react-redux';
import { isWidthUp, makeStyles, withWidth } from '@material-ui/core';
import Drawer from '@material-ui/core/Drawer';
import ContainerDimensions from 'react-container-dimensions';
import LinearProgress from '@material-ui/core/LinearProgress';
-
import DeviceList from './DeviceList';
import MainMap from './MainMap';
import MainToobar from './MainToolbar';
-import SocketController from './SocketController';
const useStyles = makeStyles(theme => ({
root: {
- height: "100vh",
- display: "flex",
- flexDirection: "column"
+ height: '100%',
+ display: 'flex',
+ flexDirection: 'column',
},
content: {
flexGrow: 1,
- overflow: "hidden",
- display: "flex",
- flexDirection: "row",
+ overflow: 'hidden',
+ display: 'flex',
+ flexDirection: 'row',
[theme.breakpoints.down('xs')]: {
- flexDirection: "column-reverse"
+ flexDirection: 'column-reverse',
}
},
drawerPaper: {
position: 'relative',
[theme.breakpoints.up('sm')]: {
- width: 350
+ width: 350,
},
[theme.breakpoints.down('xs')]: {
- height: 250
+ height: 250,
}
},
mapContainer: {
- flexGrow: 1
- }
+ flexGrow: 1,
+ },
}));
const MainPage = ({ width }) => {
- const dispatch = useDispatch();
const authenticated = useSelector(state => state.session.authenticated);
const classes = useStyles();
- const history = useHistory();
-
- useEffect(() => {
- if (!authenticated) {
- fetch('/api/session').then(response => {
- if (response.ok) {
- dispatch(sessionActions.authenticated(true));
- } else {
- history.push('/login');
- }
- });
- }
- }, [authenticated]);
return !authenticated ? (<LinearProgress />) : (
<div className={classes.root}>
- <SocketController />
<MainToobar />
<div className={classes.content}>
<Drawer
- anchor={isWidthUp('sm', width) ? "left" : "bottom"}
- variant="permanent"
+ anchor={isWidthUp('sm', width) ? 'left' : 'bottom'}
+ variant='permanent'
classes={{ paper: classes.drawerPaper }}>
<DeviceList />
</Drawer>