// A tab item
import React, {
  Component,
  PropTypes
} from 'react'

import {
  Link,
  withRouter
} from 'react-router'

@withRouter
export default class LinkedTab extends Component {

  render() {
    let { to, router } = this.props
    let active = router.isActive(to, true)
    let className = active ? 'active' : null
    return (
      <li className={ className }>
        <Link { ...this.props }>
          { this.props.title }
        </Link>
      </li>
    )
  }

}

LinkedTab.propTypes = {
  to: Link.propTypes.to,
  router: PropTypes.object.isRequired
}