import React from 'react'
import classnames from 'classnames'

type HeadlineProps = {
  headline: string
  showPremiumLabel?: boolean
  isLargeHeadline?: boolean
}

const Headline: React.FC<HeadlineProps> = ({
  headline,
  showPremiumLabel = false,
  isLargeHeadline = false,
}) => {
  if (!headline) {
    return <></>
  }

  const headlineClassnames = classnames({
    'o-topper__headline': true,
    [`o-topper__headline--large`]: isLargeHeadline,
  })

  return (
    <h1 className={headlineClassnames}>
      <span className="headline__text">{headline}</span>
      {showPremiumLabel && (
        <span className="headline__premium-badge o-labels o-labels--small o-labels--content-premium">
          Premium
        </span>
      )}
    </h1>
  )
}

export default Headline
