import type { LogoPosition } from "@/lib/types";

function logoPositionClass(pos?: LogoPosition) {
  switch (pos) {
    case "top_left":
      return "top-0 left-0";
    case "bottom_left":
      return "bottom-0 left-0";
    case "bottom_right":
      return "bottom-0 right-0";
    default:
      return "top-0 right-0";
  }
}

interface LogoWatermarkProps {
  logo: string;
  position?: LogoPosition;
  opacity?: number;
}

export function LogoWatermark({ logo, position, opacity = 1 }: LogoWatermarkProps) {
  return (
    <div
      className={`pointer-events-none absolute z-10 p-3 ${logoPositionClass(position)}`}
      style={{ opacity }}
    >
      {logo.trimStart().startsWith("<") ? (
        <div
          dangerouslySetInnerHTML={{ __html: logo }}
          className="h-12 w-auto"
        />
      ) : (
        // eslint-disable-next-line @next/next/no-img-element
        <img src={logo} alt="" className="h-12 w-auto object-contain" />
      )}
    </div>
  );
}