import React from 'react'

import Badge from '../Badge/Badge'
import { type HeaderProps } from './ScoreCardType'
import styles from './_score-card.module.scss'

const Header = ({ title, subtitle, badgeProps }: HeaderProps) => {
  return (
    <div className={styles.headerWrap}>
      <div className={styles.headerTitle}>
        {title}
        {badgeProps ? <Badge {...badgeProps} /> : null}
      </div>
      {subtitle ? (
        <div className={styles.headerSubtitle}>{subtitle}</div>
      ) : null}
    </div>
  )
}

export default Header