/**
 * LeagueLogo
 *
 * Pure UI component for displaying league logos.
 * Renders an optimized image with fallback on error.
 */

import Image from 'next/image';

export interface LeagueLogoProps {
  leagueId: string;
  alt: string;
  className?: string;
}

export function LeagueLogo({ leagueId, alt, className = '' }: LeagueLogoProps) {
  return (
    <Image
      src={`/media/leagues/${leagueId}/logo`}
      alt={alt}
      width={100}
      height={100}
      className={`object-contain ${className}`}
      onError={(e) => {
        // Fallback to default logo
        (e.target as HTMLImageElement).src = '/default-league-logo.png';
      }}
    />
  );
}