import { cn } from "@/lib/cn";

const PALETTE = [
  "bg-gold/20 text-gold-dim dark:text-gold-bright",
  "bg-teal/20 text-teal-dim dark:text-teal",
  "bg-zong/20 text-[#5C8A16] dark:text-[#9FE032]",
  "bg-ufone/20 text-[#C2600A] dark:text-[#FF9142]",
];

function hashName(name: string) {
  let h = 0;
  for (let i = 0; i < name.length; i++) h = (h * 31 + name.charCodeAt(i)) >>> 0;
  return h;
}

export function Avatar({ name, size = "md" }: { name: string; size?: "sm" | "md" | "lg" }) {
  const initials = name
    .split(" ")
    .map((p) => p[0])
    .slice(0, 2)
    .join("")
    .toUpperCase();
  const tone = PALETTE[hashName(name) % PALETTE.length];
  const sizeClass = { sm: "h-8 w-8 text-[11px]", md: "h-10 w-10 text-xs", lg: "h-14 w-14 text-base" }[size];

  return (
    <div
      className={cn(
        "flex shrink-0 items-center justify-center rounded-full font-display font-bold",
        tone,
        sizeClass
      )}
    >
      {initials}
    </div>
  );
}