Kirubel-Kibru-Yaltopia
89440985f1
Some checks failed
Deploy to Cloudflare Workers / deploy (push) Has been cancelled
38 lines
1.0 KiB
TypeScript
38 lines
1.0 KiB
TypeScript
import Image from "next/image";
|
|
import { getTeamLogoUrl } from "@/lib/utils";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export function TeamBadge({
|
|
name,
|
|
logoPath,
|
|
size = "md",
|
|
className,
|
|
}: {
|
|
name: string;
|
|
logoPath?: string | null;
|
|
size?: "sm" | "md" | "lg";
|
|
className?: string;
|
|
}) {
|
|
const logoUrl = getTeamLogoUrl(logoPath);
|
|
const sizes = { sm: 24, md: 32, lg: 48 };
|
|
const dim = sizes[size];
|
|
|
|
return (
|
|
<div className={cn("flex items-center gap-2", className)}>
|
|
<div
|
|
className="relative flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-white/10"
|
|
style={{ width: dim, height: dim }}
|
|
>
|
|
{logoUrl ? (
|
|
<Image src={logoUrl} alt={name} width={dim} height={dim} className="object-cover" />
|
|
) : (
|
|
<span className="text-xs font-bold text-cyan-400">
|
|
{name.slice(0, 2).toUpperCase()}
|
|
</span>
|
|
)}
|
|
</div>
|
|
<span className="truncate font-medium">{name}</span>
|
|
</div>
|
|
);
|
|
}
|