"use client";

import { Team } from "@/lib/types";

// Zeigt die Flagge/das Wappen eines Teams. Fällt auf ein neutrales Rund
// zurück, wenn keine crest-URL vorliegt. SVG-Crests (football-data) skalieren
// sauber; das Rendern als rundes Bild gibt den Flaggen-Look aus dem Screenshot.
export default function Flag({
  team, size = 22,
}: { team?: Team; size?: number }) {
  const style = { width: size, height: size } as const;
  if (team?.crest) {
    return (
      <img
        src={team.crest}
        alt={team.code || team.name}
        className="flag"
        style={style}
        loading="lazy"
      />
    );
  }
  // Fallback: Kreis mit Ländercode
  return (
    <span className="flag flag-fallback" style={style} aria-hidden>
      {team?.code?.slice(0, 2) || "··"}
    </span>
  );
}