import { NavLink } from 'react-router';
import './Nav.css';

const Nav: React.FC = () => {
  return (
    <nav className="nav">
      <ul className="nav-list">
        <li>
          <NavLink
            to="/list"
            className={({ isActive }) =>
              isActive ? 'nav-link active' : 'nav-link'
            }
          >
            List
          </NavLink>
        </li>
        <li>
          <NavLink
            to="/form"
            className={({ isActive }) =>
              isActive ? 'nav-link active' : 'nav-link'
            }
          >
            Form
          </NavLink>
        </li>
      </ul>
    </nav>
  );
};

export default Nav;
