diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx index 7850d048e0a7884822f9126856141c4fdaf0f318..8be689b1e4b4e342a369461ae8b1782cdd5a5af8 100644 --- a/src/components/Navbar/Navbar.tsx +++ b/src/components/Navbar/Navbar.tsx @@ -60,6 +60,17 @@ export const Navbar = () => { {t('Nav.ECOGESTURES')} </NavLink> </li> + <li className="c-nav-item"> + <NavLink + to="/report" + className="c-nav-link" + activeClassName="is-active" + > + <StyledIcon className="c-nav-icon off" icon={ParameterIconOff} /> + <StyledIcon className="c-nav-icon on" icon={ParameterIconOn} /> + {t('Nav.report')} + </NavLink> + </li> <li className="c-nav-item"> <NavLink to="/options" diff --git a/src/components/Report/MonthlyReport.tsx b/src/components/Report/MonthlyReport.tsx new file mode 100644 index 0000000000000000000000000000000000000000..1f948fa63c6b7ce75b6080e01397cb036abe3fe6 --- /dev/null +++ b/src/components/Report/MonthlyReport.tsx @@ -0,0 +1,7 @@ +import React from 'react' + +const MonthlyReport = () => { + return <div>Votre bilan mensuel</div> +} + +export default MonthlyReport diff --git a/src/components/Report/ReportView.tsx b/src/components/Report/ReportView.tsx new file mode 100644 index 0000000000000000000000000000000000000000..bc2b81ba73ddc14e82394eba1d58548336537710 --- /dev/null +++ b/src/components/Report/ReportView.tsx @@ -0,0 +1,26 @@ +import React, { useState } from 'react' +import CozyBar from 'components/Header/CozyBar' +import Header from 'components/Header/Header' +import Content from 'components/Content/Content' +import MonthlyReport from 'components/Report/MonthlyReport' + +const ReportView: React.FC = () => { + const [headerHeight, setHeaderHeight] = useState<number>(0) + const defineHeaderHeight = (height: number) => { + setHeaderHeight(height) + } + return ( + <> + <CozyBar titleKey={'report.viewTitle'} /> + <Header + setHeaderHeight={defineHeaderHeight} + desktopTitleKey={'report.viewTitle'} + ></Header> + <Content height={headerHeight}> + <MonthlyReport /> + </Content> + </> + ) +} + +export default ReportView diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx index 7b9cf70c6720ac0b89b59b74ac8ba032672e7104..3e73837839545e6f0697e7a1ac604561bfe565a1 100644 --- a/src/components/Routes/Routes.tsx +++ b/src/components/Routes/Routes.tsx @@ -13,6 +13,7 @@ import EcogestureView from 'components/Ecogesture/EcogestureView' import OptionsView from 'components/Options/OptionsView' import FAQView from 'components/FAQ/FAQView' import LegalNoticeView from 'components/LegalNotice/LegalNoticeView' +import ReportView from 'components/Report/ReportView' const Routes = () => { return ( @@ -76,6 +77,7 @@ const Routes = () => { </> )} /> + <Route path="/report" component={ReportView} /> <Redirect from="/" to="/consumption" /> <Redirect from="*" to="/consumption" /> </Switch> diff --git a/src/locales/fr.json b/src/locales/fr.json index a4931fb5bcabe8c7d61cf7d2f990e8e1fb1373ff..2f2e5599974b4d65c1914a5260d9bf16fc0f468c 100644 --- a/src/locales/fr.json +++ b/src/locales/fr.json @@ -15,7 +15,8 @@ "options": "Options", "profile": "Profil", "connectors": "connecteurs", - "graphs": "graphes" + "graphs": "graphes", + "report": "Bilan" }, "COMMON": { "APP_TITLE": "Ecolyo", @@ -305,5 +306,8 @@ "contact": "Veuillez prendre contact directement avec eux.", "accessButton": "Accéder aux connecteurs", "later": "Plus tard" + }, + "report": { + "viewTitle": "Votre bilan" } }