Commit 3d718d3a authored by Florent Chehab's avatar Florent Chehab
Browse files

Basic routing working fine, need to work on operationability with redux

parent 8831488e
Pipeline #26500 failed with stages
in 1 minute and 21 seconds
......@@ -4,10 +4,13 @@ import { Provider } from "react-redux";
import store from "../store/index";
import Dashboard from "./Dashboard";
import { BrowserRouter as Router, Route } from 'react-router-dom';
const App = () => (
<Provider store={store}>
<Dashboard />
<Router>
<Route path="/:filter?" component={Dashboard} />
</Router>
</Provider>
);
......
......@@ -21,9 +21,17 @@ import UnivMapReloadButton from './UnivMapReloadButton';
import Paper from '@material-ui/core/Paper';
import { mainListItems, secondaryListItems } from './listItems';
// import route Components here
import {
universitiesInvalidated
} from '../actions/universities';
BrowserRouter as Router,
Route,
Link,
Switch,
Redirect
} from 'react-router-dom';
import PageMap from './PageMap';
import PageHome from './PageHome';
const drawerWidth = 240;
......@@ -136,9 +144,8 @@ class Dashboard extends React.Component {
</IconButton>
</div>
<Divider />
<List>{mainListItems}</List>
<Divider />
<List>{secondaryListItems}</List>
......@@ -146,22 +153,8 @@ class Dashboard extends React.Component {
<main className={classes.content}>
<Paper className={classes.myPaper}>
<Grid container spacing={24}>
<Grid item xs={11}>
<Typography variant="display1" gutterBottom>
Exploration Cartographique
</Typography>
</Grid>
<Grid item xs={1}>
<UnivMapReloadButton/>
</Grid>
</Grid>
<UnivMap />
</Paper>
<Route path="/app/" exact={true} component={PageHome} />
<Route path="/app/map" component={PageMap} />
</main>
......
import React from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Typography from '@material-ui/core/Typography';
import Paper from '@material-ui/core/Paper';
const styles = theme => ({
myPaper: {
padding: 16
}
});
class PageHome extends React.Component {
render() {
const { classes } = this.props;
return (
<Paper className={classes.myPaper}>
<Typography variant="display1">
Accueil du site, coucou :)
</Typography>
</Paper>
);
}
}
PageHome.propTypes = {
classes: PropTypes.object.isRequired,
};
export default withStyles(styles)(PageHome);
// Inspired by https://github.com/mui-org/material-ui/tree/master/docs/src/pages/page-layout-examples/dashboard
import React from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import UnivMap from './UnivMap';
import UnivMapReloadButton from './UnivMapReloadButton';
import Paper from '@material-ui/core/Paper';
const styles = theme => ({
myPaper: {
padding: 16
}
});
class PageMap extends React.Component {
render() {
const { classes } = this.props;
return (
<Paper className={classes.myPaper}>
<Grid container spacing={24}>
<Grid item xs={11}>
<Typography variant="display1" gutterBottom>
Exploration Cartographique
</Typography>
</Grid>
<Grid item xs={1}>
<UnivMapReloadButton />
</Grid>
</Grid>
<UnivMap />
</Paper>
);
}
}
PageMap.propTypes = {
classes: PropTypes.object.isRequired,
};
export default withStyles(styles)(PageMap);
......@@ -31,7 +31,7 @@ class UnivMap extends Component {
}
return (
<Map center={[51, 0]} zoom={2} style={{ height: "800px" }}>
<Map center={[35, 0]} zoom={2} style={{ height: "800px" }}>
<LayersControl position="topright">
<LayersControl.BaseLayer name="OpenStreetMap France" checked={false}>
<TileLayer
......
......@@ -33,7 +33,6 @@ class UnivMapReloadButton extends Component {
const mapStateToProps = (state) => {
console.log("ici", state)
return {
invalidated: state.universitiesInvalidated
};
......
......@@ -7,17 +7,30 @@ import MapIcon from '@material-ui/icons/Map';
import LocationCityIcon from '@material-ui/icons/LocationCity';
import PeopleIcon from '@material-ui/icons/People';
import BarChartIcon from '@material-ui/icons/BarChart';
import LayersIcon from '@material-ui/icons/Layers';
import HomeIcon from '@material-ui/icons/Home';
import AssignmentIcon from '@material-ui/icons/Assignment';
import { NavLink } from 'react-router-dom'
export const mainListItems = (
<div>
<ListItem button>
<ListItemIcon>
<MapIcon />
</ListItemIcon>
<ListItemText primary="Carte" />
</ListItem>
<NavLink to={'/app/'}>
{/* TODO add styling */}
<ListItem button>
<ListItemIcon>
<HomeIcon />
</ListItemIcon>
<ListItemText primary="Accueil" />
</ListItem>
</NavLink>
<NavLink to={'/app/map/'}>
<ListItem button>
<ListItemIcon>
<MapIcon />
</ListItemIcon>
<ListItemText primary="Carte" />
</ListItem>
</NavLink>
<ListItem button>
<ListItemIcon>
<LocationCityIcon />
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment