1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

filter some menu items based on Web3 status

This commit is contained in:
Matthias Kretschmann 2019-04-04 14:07:16 +02:00
parent d42453a93e
commit 9b9cbfaff3
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 33 additions and 14 deletions

View File

@ -1,12 +1,28 @@
import React from 'react'
import { NavLink } from 'react-router-dom'
import { ReactComponent as Logo } from '@oceanprotocol/art/logo/logo.svg'
import { User } from '../../context/User'
import AccountStatus from '../molecules/AccountStatus'
import styles from './Header.module.scss'
import menu from '../../data/menu.json'
import meta from '../../data/meta.json'
const MenuItem = ({ item, isWeb3 }: { item: any; isWeb3: boolean }) => {
if (item.web3 && !isWeb3) return null
return (
<NavLink
to={item.link}
className={styles.link}
activeClassName={styles.linkActive}
exact
>
{item.title}
</NavLink>
)
}
const Header = () => (
<header className={styles.header}>
<div className={styles.headerContent}>
@ -16,17 +32,17 @@ const Header = () => (
</NavLink>
<nav className={styles.headerMenu}>
{menu.map(item => (
<NavLink
key={item.title}
to={item.link}
className={styles.link}
activeClassName={styles.linkActive}
exact
>
{item.title}
</NavLink>
))}
<User.Consumer>
{states =>
menu.map(item => (
<MenuItem
key={item.title}
item={item}
isWeb3={states.isWeb3}
/>
))
}
</User.Consumer>
</nav>
<AccountStatus className={styles.accountStatus} />
</div>

View File

@ -1,15 +1,18 @@
[
{
"title": "Publish",
"link": "/publish"
"link": "/publish",
"web3": true
},
{
"title": "History",
"link": "/history"
"link": "/history",
"web3": true
},
{
"title": "Faucet",
"link": "/faucet"
"link": "/faucet",
"web3": true
},
{
"title": "About",