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"
|
import Nav from "react-bootstrap/Nav"
|
||||||
|
|
||||||
export function Header ( props ) {
|
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>
|
<Container>
|
||||||
<Navbar.Brand>App</Navbar.Brand>
|
<Navbar.Brand>App</Navbar.Brand>
|
||||||
<Nav>
|
<Nav>
|
||||||
<Nav.Link href="/">Home</Nav.Link>
|
{Links}
|
||||||
<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>
|
|
||||||
</Nav>
|
</Nav>
|
||||||
</Container>
|
</Container>
|
||||||
</Navbar>)
|
</Navbar>)
|
||||||
|
|
Loading…
Reference in New Issue