import Image from "next/image";
import Link from "next/link";

interface LogoProps {
  /** Size of the logo icon in pixels (default: 28 for nav, 64 for home) */
  size?: number;
  /** Whether to show the "Jenado Unlimited" text next to the icon (default: false) */
  withText?: boolean;
  /** Additional CSS classes */
  className?: string;
  /** Whether to wrap in a Link to home (default: true) */
  link?: boolean;
}

export function Logo({
  size = 28,
  withText = false,
  className = "",
  link = true,
}: LogoProps) {
  const height = Math.round(size * (1077 / 939));

  const content = (
    <span className={`inline-flex items-center gap-3 ${className}`}>
      <span className="logo block" style={{ width: size, height }}>
        <Image
          src="/logo.svg"
          alt="Jenado Unlimited"
          width={size}
          height={height}
          className="h-full w-full object-contain"
          unoptimized
        />
      </span>
      {withText && (
        <span className="text-lg font-medium tracking-[-0.01em] text-[var(--color-heading)]">
          Jenado Unlimited
        </span>
      )}
    </span>
  );

  if (link) {
    return (
      <Link href="/" aria-label="Jenado Unlimited">
        {content}
      </Link>
    );
  }
  return content;
}
