make secondary navigation collapsable // save collapse status in local storage

This commit is contained in:
Eduard Heimbuch
2020-02-25 09:49:23 +01:00
parent 1c681ea588
commit 7fe8b58e7d
5 changed files with 122 additions and 39 deletions

View File

@@ -9,6 +9,8 @@ type Props = {
activeOnlyWhenExact?: boolean;
activeWhenMatch?: (route: any) => boolean;
children?: ReactNode;
collapsed?: boolean;
onCollapsed?: (newStatus: boolean) => void;
};
class SubNavigation extends React.Component<Props> {
@@ -22,7 +24,7 @@ class SubNavigation extends React.Component<Props> {
}
renderLink = (route: any) => {
const { to, icon, label } = this.props;
const { to, icon, label, collapsed } = this.props;
let defaultIcon = "fas fa-cog";
if (icon) {
@@ -36,8 +38,11 @@ class SubNavigation extends React.Component<Props> {
return (
<li>
<Link className={this.isActive(route) ? "is-active" : ""} to={to}>
<i className={classNames(defaultIcon, "fa-fw")} /> {label}
<Link
className={classNames(this.isActive(route) ? "is-active" : "", collapsed ? "has-text-centered" : "")}
to={to}
>
<i className={classNames(defaultIcon, "fa-fw")} /> {collapsed ? "" : label}
</Link>
{children}
</li>