import React from 'react'
import { StyledBreadCrumbItem, BreadCrumbItemLink } from './styled'
import { BreadCrumbItemProps, BreadCrumbStyledItemProps } from './typings'

class BreadCrumbItem extends React.PureComponent<BreadCrumbItemProps> {
  render() {
    const { text, url, isActive } = this.props
    const attributes: BreadCrumbStyledItemProps = {
      'aria-current': isActive === true ? 'page' : undefined,
    }

    return url ? (
      <BreadCrumbItemLink {...attributes} text={text} to={url} target="_self" />
    ) : (
      <StyledBreadCrumbItem {...attributes}>{text}</StyledBreadCrumbItem>
    )
  }
}

export { BreadCrumbItem }
export default { BreadCrumbItem }