Create NavBar

[ndswimming92]

User Story - what the user should see and experience

When a user logs in they should see the NavBar with:

• [ ] Logo
• [ ] Notes Link
• [ ] Notes+ Link
• [ ] Search Bar
• [ ] Login/Logout button

Acceptance Criteria - illustrates the scope of the individual ticket

Example -

Dev Notes - dev work that needs to be completed for this ticket

Example Code:

export default function NavBar() {
  return (
    <Navbar collapseOnSelect expand="lg" bg="dark" variant="dark">
      <Container>
        <Link passHref href="/members">
          <Navbar.Brand>Swim Team Roster</Navbar.Brand>
        </Link>
        <Navbar.Toggle aria-controls="responsive-navbar-nav" />
        <Navbar.Collapse className="justify-content-end">
          <Nav className="ml-auto">
            {/* CLOSE NAVBAR ON LINK SELECTION: https://stackoverflow.com/questions/72813635/collapse-on-select-react-bootstrap-navbar-with-nextjs-not-working */}
            <Link passHref href="/members">
              <Nav.Link>Team</Nav.Link>
            </Link>
            <Link passHref href="/member/new">
              <Nav.Link>Add Member</Nav.Link>
            </Link>
            <Button type="button" className="btn-danger" onClick={signOut}>
              Log Out
            </Button>
          </Nav>
        </Navbar.Collapse>
      </Container>
    </Navbar>
  );
}