import Image from "next/image";
import { cn } from "@/lib/utils";
import { buildStorageUrl } from "./BaseUrl";

const sizeMap = {
  xxs: "h-5 w-5",
  xs: "h-8 w-8",
  sm: "h-10 w-10",
  chat: "h-14 w-14",
  md: "h-[72px] w-[72px]",
  lg: "h-[120px] w-[120px]",
  xl: "h-[280px] w-[280px]",
};

type ProfileAvatarProps = {
  src?: string | null;
  alt?: string;
  size?: keyof typeof sizeMap;
  rounded?: "2xl" | "xl" | "full";
  className?: string;
  fallback?: string;
};

function ProfileAvatar({
  src,
  alt = "",
  size = "md",
  rounded = "2xl",
  className,
  fallback = "/images/fake-avatar.png",
}: ProfileAvatarProps) {
  const roundedClass =
    rounded === "full"
      ? "rounded-full"
      : rounded === "xl"
        ? "rounded-xl"
        : "rounded-2xl";

  const imageSrc = src ? buildStorageUrl(src) : fallback;

  return (
    <Image
      src={imageSrc}
      alt={alt}
      width={280}
      height={280}
      unoptimized
      className={cn(
        "profile-avatar aspect-square object-cover shrink-0",
        sizeMap[size],
        roundedClass,
        className
      )}
    />
  );
}

export default ProfileAvatar;
