Modify Navbar view for different users dpending on login
This commit is contained in:
parent
f1e29a7ca4
commit
84f5672aca
|
@ -3,15 +3,19 @@ import Navbar from "react-bootstrap/Navbar"
|
|||
import Nav from "react-bootstrap/Nav"
|
||||
|
||||
export function Header ( props ) {
|
||||
return ( <Navbar>
|
||||
// props.items is the value of nav state in App.js
|
||||
// create a collection of navigation items
|
||||
const Links = props.items.map( (item, itemkey) => {
|
||||
return (
|
||||
<Nav.Link href={item.link} key={itemkey}> {item.label} </Nav.Link>
|
||||
)
|
||||
} )
|
||||
return (
|
||||
<Navbar>
|
||||
<Container>
|
||||
<Navbar.Brand>App</Navbar.Brand>
|
||||
<Nav>
|
||||
<Nav.Link href="/">Home</Nav.Link>
|
||||
<Nav.Link href="/about">About</Nav.Link>
|
||||
<Nav.Link href="/contact">Contact</Nav.Link>
|
||||
<Nav.Link href="/signup">Create Account</Nav.Link>
|
||||
<Nav.Link href="/signin">Sign in</Nav.Link>
|
||||
{Links}
|
||||
</Nav>
|
||||
</Container>
|
||||
</Navbar>)
|
||||
|
|
Loading…
Reference in New Issue