import { APP_NAME } from '@/utils/constants';
import { cn } from '@/lib/utils';

type BrandLogoProps = {
  className?: string;
  /** Image height class; width follows aspect ratio */
  imgClassName?: string;
  alt?: string;
};

/**
 * Product wordmark from /logo/mainlogo.png (transparent background).
 */
export const BrandLogo = ({
  className,
  imgClassName,
  alt = APP_NAME,
}: BrandLogoProps) => {
  return (
    <span className={cn('inline-flex items-center', className)}>
      <img
        src="/logo/mainlogo.png"
        alt={alt}
        className={cn('h-8 w-auto select-none object-contain', imgClassName)}
        draggable={false}
      />
    </span>
  );
};