import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";

/**
 * Shared avatar primitive for stores and creators. It uses a provider-supplied
 * avatar when one exists and otherwise keeps the honest initials fallback.
 */
export function StoreAvatar({
  name,
  avatarUrl,
  size = "default",
}: {
  name: string;
  avatarUrl?: string | null;
  size?: "sm" | "default" | "lg";
}) {
  const initials =
    name
      .trim()
      .split(/\s+/)
      .slice(0, 2)
      .map((word) => word[0]?.toUpperCase())
      .join("") || "?";

  return (
    <Avatar size={size}>
      {avatarUrl ? <AvatarImage src={avatarUrl} alt={name} /> : null}
      <AvatarFallback aria-label={name}>{initials}</AvatarFallback>
    </Avatar>
  );
}