interface SeriesStatsProps {
  sponsoring: number
  purchases: number
  reviewTips: number
}

function formatSats(value: number): string {
  return `${value} sats`
}

export function SeriesStats({ sponsoring, purchases, reviewTips }: SeriesStatsProps): React.ReactElement {
  const items = [
    { label: 'Sponsoring (hors frais)', value: formatSats(sponsoring) },
    { label: 'Paiements articles (hors frais)', value: formatSats(purchases) },
    { label: 'Remerciements critiques (hors frais)', value: formatSats(reviewTips) },
  ]
  return (
    <div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
      {items.map((item) => (
        <div key={item.label} className="border rounded-lg p-3 bg-white text-sm">
          <div className="text-gray-600">{item.label}</div>
          <div className="font-semibold text-gray-900">{item.value}</div>
        </div>
      ))}
    </div>
  )
}
