diff options
-rw-r--r-- | modern/src/components/reports/ReportNavbar.js | 4 | ||||
-rw-r--r-- | modern/src/reports/ReportLayoutPage.js | 20 |
2 files changed, 19 insertions, 5 deletions
diff --git a/modern/src/components/reports/ReportNavbar.js b/modern/src/components/reports/ReportNavbar.js index 674db3a4..3167c758 100644 --- a/modern/src/components/reports/ReportNavbar.js +++ b/modern/src/components/reports/ReportNavbar.js @@ -3,7 +3,7 @@ import { AppBar, Toolbar, Typography, IconButton } from '@material-ui/core'; import MenuIcon from '@material-ui/icons/Menu'; import t from '../../common/localization'; -const ReportNavbar = ({ openDrawer, setOpenDrawer }) => { +const ReportNavbar = ({ openDrawer, setOpenDrawer, reportTitle }) => { return ( <AppBar position="fixed" color="inherit"> @@ -16,7 +16,7 @@ const ReportNavbar = ({ openDrawer, setOpenDrawer }) => { <MenuIcon /> </IconButton> <Typography variant="h6" noWrap> - {t('reportTitle')} + {t('reportTitle')} {reportTitle ? `/ ${reportTitle}` : ''} </Typography> </Toolbar> </AppBar> diff --git a/modern/src/reports/ReportLayoutPage.js b/modern/src/reports/ReportLayoutPage.js index ed7fe544..42804004 100644 --- a/modern/src/reports/ReportLayoutPage.js +++ b/modern/src/reports/ReportLayoutPage.js @@ -1,5 +1,5 @@ -import React, { useState } from 'react'; -import { useHistory } from 'react-router-dom'; +import React, { useState, useEffect } from 'react'; +import { useHistory, useLocation } from 'react-router-dom'; import { Grid, Typography, Divider, Drawer, makeStyles, IconButton, Hidden } from '@material-ui/core'; import TimelineIcon from '@material-ui/icons/Timeline'; import PauseCircleFilledIcon from '@material-ui/icons/PauseCircleFilled'; @@ -61,12 +61,26 @@ const routes = [ const ReportLayoutPage = ({ children, filter, }) => { const classes = useStyles(); const history = useHistory(); + const location = useLocation(); const [openDrawer, setOpenDrawer] = useState(false); + const [reportTitle, setReportTitle] = useState(); + + useEffect(() => { + routes.forEach(route => { + switch (location.pathname) { + case `${route.href}`: + setReportTitle(route.name); + break; + default: + break; + } + }); + }, []); return ( <div className={classes.root}> <Hidden only={['lg', 'xl']}> - <ReportNavbar openDrawer={openDrawer} setOpenDrawer={setOpenDrawer} /> + <ReportNavbar openDrawer={openDrawer} setOpenDrawer={setOpenDrawer} reportTitle={reportTitle} /> <Drawer variant="temporary" open={openDrawer} |