40 lines
No EOL
1.5 KiB
JavaScript
Executable file
40 lines
No EOL
1.5 KiB
JavaScript
Executable file
import React, { useState } from 'react';
|
|
import Link from 'next/link';
|
|
import Navbar from 'react-bootstrap/Navbar';
|
|
import Nav from 'react-bootstrap/Nav';
|
|
import NavLink from 'react-bootstrap/NavLink';
|
|
import NavItem from 'react-bootstrap/NavItem';
|
|
import NavDropdown from 'react-bootstrap/NavDropdown';
|
|
|
|
const NavBar = (props, sections) => {
|
|
const [isOpen, setIsOpen] = useState(false);
|
|
const toggle = () => setIsOpen(prevState => !prevState);
|
|
|
|
return (
|
|
<Navbar expand="lg" collapseOnSelect bg="light" variant="light">
|
|
<Navbar.Toggle aria-controls="responsive-navbar-nav" />
|
|
<Navbar.Collapse>
|
|
<Nav className="m-auto">
|
|
<NavLink href="/">Home</NavLink>
|
|
</Nav>
|
|
<NavDropdown className="m-auto" title="Podcasts">
|
|
<NavDropdown.Item key="current" href="/podcasts/current">Current Podcasts</NavDropdown.Item>
|
|
<NavDropdown.Item key="archived" href="/podcasts/archived">Archived Podcasts</NavDropdown.Item>
|
|
</NavDropdown>
|
|
<NavItem className="m-auto">
|
|
<NavLink href="/news">News and such</NavLink>
|
|
</NavItem>
|
|
{props.sections.sections.map((section) => (
|
|
<NavDropdown className="m-auto" title={section.title}>
|
|
{section.pages.map((page) => (
|
|
<NavDropdown.Item key={page.page_slug} href={"/sections/" + page.page_slug}>{page.page_title}</NavDropdown.Item>
|
|
))}
|
|
</NavDropdown>
|
|
))}
|
|
</Navbar.Collapse>
|
|
</Navbar>
|
|
|
|
);
|
|
}
|
|
|
|
export default NavBar |