import {withRouter} from "react-router";
import {Container, Nav, Navbar, NavbarBrand, NavItem, NavLink} from "reactstrap";
import {NavLink as RRNavLink} from "react-router-dom";
import React from "react";

const Navigation = ({location}) => {
    return (
        <Navbar className="fixed-top bg-primary" dark>
            <Container>
                <NavbarBrand className="navbar-brand">Medial XL Trade Helper</NavbarBrand>
                <Nav className="mr-auto flex-row" navbar>
                    <NavItem active={location.pathname === "/"}>
                        <NavLink tag={RRNavLink} activeClassName="active" to="/">Search</NavLink>
                    </NavItem>
                    <NavItem active={location.pathname === "/sell"}>
                        <NavLink tag={RRNavLink} activeClassName="active" to="/sell">List items</NavLink>
                    </NavItem>
                </Nav>
            </Container>
        </Navbar>
    );
};

export default withRouter(Navigation);