import { mapRewardToIcon } from "./data"

import type { RewardIconProps } from "@/types/components/myPages/rewards"

// Original SVG aspect ratio is 358:202 (≈1.77:1)
const sizeMap = {
  small: { width: 120, height: 68 }, // 40% of card width
  medium: { width: 180, height: 102 }, // 60% of card width
  large: { width: 240, height: 135 }, // 80% of card width
} as const

export function RewardIcon({
  rewardId,
  size = "medium",
  ...props
}: RewardIconProps) {
  const IconComponent = mapRewardToIcon(rewardId)
  if (!IconComponent) return null

  return (
    <IconComponent
      {...props}
      width={sizeMap[size].width}
      height={sizeMap[size].height}
    />
  )
}