import { getIso } from '@/lib/iso-codes'

interface Props {
  name: string
  iso2?: string | null
  size?: 'sm' | 'md' | 'lg' | 'xl'
  className?: string
}

const sizes = { sm: 'text-lg', md: 'text-2xl', lg: 'text-4xl', xl: 'text-[60px]' }

export function TeamFlag({ name, iso2, size = 'md', className = '' }: Props) {
  const code = iso2 ?? getIso(name)
  return (
    <span
      className={`fi fi-${code} rounded-sm inline-block flex-shrink-0 ${sizes[size]} ${className}`}
      title={name}
    />
  )
}