66 lines
1.4 KiB
JavaScript
66 lines
1.4 KiB
JavaScript
import React, { Component } from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import { Link } from 'react-router'
|
|
import _ from 'lodash'
|
|
|
|
const PROP_LIST = [
|
|
'matchChildRoutes',
|
|
'hardReload',
|
|
'show',
|
|
'text',
|
|
'href',
|
|
'linkClass'
|
|
]
|
|
|
|
class NavBarLink extends Component {
|
|
static propTypes = {
|
|
matchChildRoutes: PropTypes.bool,
|
|
hardReload: PropTypes.bool,
|
|
show: PropTypes.bool,
|
|
text: PropTypes.string,
|
|
href: PropTypes.string,
|
|
linkClass: PropTypes.string
|
|
}
|
|
|
|
static contextTypes = {
|
|
location: PropTypes.object
|
|
}
|
|
|
|
render = () => {
|
|
const {
|
|
matchChildRoutes,
|
|
hardReload,
|
|
show,
|
|
text,
|
|
href,
|
|
linkClass
|
|
} = this.props
|
|
const { location } = this.context
|
|
const otherProps = _.omit(this.props, PROP_LIST)
|
|
const classes = ['navBarButton', linkClass]
|
|
const active = matchChildRoutes ?
|
|
location.pathname.startsWith(href) :
|
|
location.pathname === href
|
|
if (active) classes.push('active')
|
|
if (!show) {
|
|
return null
|
|
}
|
|
if (hardReload) {
|
|
return (
|
|
<a { ...otherProps } href={href} className={classes.join(' ')}>
|
|
<div className="navBarIcon"></div>
|
|
{text}
|
|
</a>
|
|
)
|
|
}
|
|
return (
|
|
<Link { ...otherProps } to={href} className={classes.join(' ')}>
|
|
<div className="navBarIcon"></div>
|
|
{text}
|
|
</Link>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default NavBarLink
|