init localize

app/[locale]/components/Flag.tsx

@@ -0,0 +1,32 @@
+"use client";
+
+import { useState } from "react";
+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 oder das Bild nicht geladen werden kann.
+export default function Flag({
+  team, size = 22,
+}: { team?: Team; size?: number }) {
+  const [imgFailed, setImgFailed] = useState(false);
+  const style = { width: size, height: size } as const;
+
+  if (team?.crest && !imgFailed) {
+    return (
+      <img
+        src={team.crest}
+        alt={team.code || team.localisedName || team.name}
+        className="flag"
+        style={style}
+        loading="lazy"
+        onError={() => setImgFailed(true)}
+      />
+    );
+  }
+  // Fallback: Kreis mit Ländercode
+  return (
+    <span className="flag flag-fallback" style={style} aria-hidden>
+      {team?.code?.slice(0, 2) || "··"}
+    </span>
+  );
+}