jku-iis-project-mawen/src/Navigation.js

import React, { useState }  from "react";
import {withRouter} from "react-router-dom";
import {
  Collapse,
  Navbar,
  NavbarToggler,
  NavbarBrand,
  Nav,
  NavItem,
  NavLink
} from 'reactstrap';

const Navigation = (props) => {
  const [isOpen, setIsOpen] = useState(false);
  const toggle = () => setIsOpen(!isOpen);

  return (
    <Navbar color="dark" dark expand="md">

      <NavbarBrand href="/">
        MAWEN
      </NavbarBrand>

      {/* hamburger menu */}
      <NavbarToggler onClick={toggle} />

      <Collapse isOpen={isOpen} navbar>
        <Nav className="mr-auto" navbar>
          <NavItem>
            <NavLink href="/addition">
              Addition
            </NavLink>
          </NavItem>
          <NavItem>
            <NavLink href="/subtraction">
              Subtraktion
            </NavLink>
          </NavItem>
        </Nav>
      </Collapse>

    </Navbar>
  );
}

export default withRouter(Navigation);