import React from 'react'

export default function RisingBadge({ heatScore, rankingScore }) {
  if (!heatScore && !rankingScore) return null

  const isRising = heatScore > 5
  const isTrending = rankingScore > 50

  if (!isRising && !isTrending) return null

  return (
    <span className="inline-flex items-center gap-1">
      {isRising && (
        <span className="inline-flex items-center gap-1 px-2 py-0.5 rounded-md text-xs font-medium bg-orange-500/20 text-orange-400 border border-orange-500/30">
          <i className="fa-solid fa-fire text-[10px]" />
          Rising
        </span>
      )}
      {isTrending && (
        <span className="inline-flex items-center gap-1 px-2 py-0.5 rounded-md text-xs font-medium bg-purple-500/20 text-purple-400 border border-purple-500/30">
          <i className="fa-solid fa-arrow-trend-up text-[10px]" />
          Trending
        </span>
      )}
    </span>
  )
}