import { Navbar, Nav, Container } from "react-bootstrap";
import { Link } from "react-router-dom";

export function AppNav() {
  return (
    <Navbar bg="dark" variant="dark" expand="sm" className="py-0">
      <Container className="me-auto">
        <Navbar.Brand as={Link} to="/">
          N-DRIVE
        </Navbar.Brand>
        <Navbar.Toggle aria-controls="collapse-navbar-nav" />
        <Navbar.Collapse id="collapse-navbar-nav">
          <Nav className="me-auto">
            <Nav.Link as={Link} to="/">
              Home
            </Nav.Link>
            <Nav.Link as={Link} to="/version">
              Version
            </Nav.Link>
            <Nav.Link as={Link} to="/network">
              Network
            </Nav.Link>
          </Nav>
        </Navbar.Collapse>
      </Container>
    </Navbar>
  );
}

export function Footer() {
  return <p className="footer">Made with {"<3"} by James Pace.</p>;
}