import React from "react";

function initialsFrom(name: string): string {
  const parts = name.trim().split(/\s+/).filter(Boolean);
  if (parts.length === 0) return "?";
  return parts
    .slice(0, 2)
    .map(p => p[0]!.toUpperCase())
    .join("");
}

export function UserAvatar({ name, className = "" }: { name: string; className?: string }) {
  return (
    <div
      className={
        "shrink-0 rounded-full bg-brand-600 text-white flex items-center justify-center font-semibold " +
        (className || "w-10 h-10 text-sm")
      }
    >
      {initialsFrom(name)}
    </div>
  );
}