37 lines
1.2 KiB
React
37 lines
1.2 KiB
React
import React, {useState} from "react"
|
|
import {Collapse, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink} from "reactstrap";
|
|
import useAuth from "../../Hooks/auth";
|
|
import {Link} from "react-router-dom";
|
|
import {onEnter} from "../../Helpers/keys";
|
|
|
|
export default function Header() {
|
|
const [showMenu, setShowMenu] = useState(false);
|
|
const {isLoggedIn, logout} = useAuth();
|
|
|
|
return (
|
|
<Navbar color="dark" dark expand="md">
|
|
<NavbarBrand tag={Link} to="/">Lucifer</NavbarBrand>
|
|
<NavbarToggler onClick={() => setShowMenu(!showMenu)}/>
|
|
<Collapse isOpen={showMenu} navbar>
|
|
{isLoggedIn && (
|
|
<Nav className="ml-auto" navbar>
|
|
<NavItem>
|
|
<NavLink tag={Link} to="/lights">Lys</NavLink>
|
|
</NavItem>
|
|
<NavItem>
|
|
<NavLink tag={Link} to="/groups">Grupper</NavLink>
|
|
</NavItem>
|
|
<NavItem>
|
|
<NavLink tag={Link} to="/admin">Admin</NavLink>
|
|
</NavItem>
|
|
<NavItem>
|
|
<NavLink tabIndex={0}
|
|
onClick={() => logout()}
|
|
onKeyDown={onEnter(() => logout())}>Logg ut</NavLink>
|
|
</NavItem>
|
|
</Nav>
|
|
)}
|
|
</Collapse>
|
|
</Navbar>
|
|
);
|
|
} |