fix appmenu highlighting

This commit is contained in:
proddy
2020-07-17 21:21:57 +02:00
parent abbe6296ea
commit 0475211040
4 changed files with 7 additions and 10 deletions

View File

@@ -130,7 +130,7 @@ class MenuAppBar extends React.Component<MenuAppBarProps, MenuAppBarState> {
</Typography>
<Typography align="right" variant="caption" color="textPrimary">
&nbsp;&nbsp;{authenticatedContext.me.version}
&nbsp;&nbsp;v{authenticatedContext.me.version}
</Typography>
<Divider absolute />
@@ -142,6 +142,7 @@ class MenuAppBar extends React.Component<MenuAppBarProps, MenuAppBarState> {
<Divider />
</Fragment>
)}
<List>
<ListItem to='/wifi/' selected={path.startsWith('/wifi/')} button component={Link}>
<ListItemIcon>

View File

@@ -26,9 +26,9 @@ class EMSESP extends Component<RouteComponentProps> {
<Tab value={`/${PROJECT_PATH}/help`} label="EMS-ESP Help" />
</Tabs>
<Switch>
<AuthenticatedRoute exact path={`/${PROJECT_PATH}/help`} component={EMSESPHelp} />
<AuthenticatedRoute exact path={`/${PROJECT_PATH}/status`} component={EMSESPStatusController} />
<AuthenticatedRoute exact path={`/${PROJECT_PATH}/devices`} component={EMSESPDevicesController} />
<AuthenticatedRoute exact path={`/${PROJECT_PATH}/help`} component={EMSESPHelp} />
<Redirect to={`/${PROJECT_PATH}/status`} />
</Switch>
</MenuAppBar>

View File

@@ -6,20 +6,18 @@ import { List, ListItem, ListItemIcon, ListItemText } from "@material-ui/core";
import SettingsIcon from '@material-ui/icons/Settings';
import SettingsRemoteIcon from "@material-ui/icons/SettingsRemote";
// import { PROJECT_PATH } from "../api";
class ProjectMenu extends Component<RouteComponentProps> {
render() {
const path = this.props.match.url;
return (
<List>
<ListItem to='/ems-esp/' selected={path.startsWith('/ems-esp/')} button component={Link}>
<ListItem to='/ems-esp/status/' selected={path.startsWith('/ems-esp/status/')} button component={Link}>
<ListItemIcon>
<SettingsRemoteIcon />
</ListItemIcon>
<ListItemText primary="Dashboard" />
</ListItem>
<ListItem to='/ems-esp/settings' selected={path.startsWith('/ems-esp/settings/')} button component={Link}>
<ListItem to='/ems-esp/settings/' selected={path.startsWith('/ems-esp/settings/')} button component={Link}>
<ListItemIcon>
<SettingsIcon />
</ListItemIcon>

View File

@@ -1,7 +1,6 @@
import React, { Component } from 'react';
import { Redirect, Switch } from 'react-router';
import { PROJECT_PATH } from '../api';
import { AuthenticatedRoute } from '../authentication';
import EMSESP from './EMSESP';
@@ -12,17 +11,16 @@ class ProjectRouting extends Component {
render() {
return (
<Switch>
<AuthenticatedRoute exact path="/ems-esp/status" component={EMSESP} />
<AuthenticatedRoute exact path="/ems-esp/status/*" component={EMSESP} />
<AuthenticatedRoute exact path="/ems-esp/settings" component={EMSESPSettings} />
<AuthenticatedRoute exact path="/ems-esp/*" component={EMSESP} />
{
/*
* The redirect below caters for the default project route and redirecting invalid paths.
* The "to" property must match one of the routes above for this to work correctly.
*/
}
<Redirect to={`/${PROJECT_PATH}/status`} />
<Redirect to={`/ems-esp/status/`} />
</Switch>
)
}