import * as classNames from "classnames";
import * as React from "react";

import { Image } from "../Image";
import { getImageSrc } from "../../utilities/image"

export enum LogoVersion {
  Version1 = "1",
  Version2 = "2",
}

export interface ILogoProps {
  onClick?: () => void;
  imagePrefix?: string;
  version?: LogoVersion;
  white?: boolean;
}

export const Logo = ({
  onClick,
  imagePrefix,
  white,
  version = LogoVersion.Version2
}: ILogoProps) => (
  <div className={classNames("logo", {
    [`logo--${version}`]: version,
    [`logo--with-click`]: onClick,
  })} onClick={onClick}>
    <Image src={getImageSrc(imagePrefix, `aircam-${version}${white ? "-white" : ""}.png`)} />
  </div>
);