import type { FC } from "react";
import { useTranslation } from "@/i18n/provider.js";
import type { ISimpleFlight } from "../../types.js";
import "./OperatorLogo.scss";

export interface OperatorLogoProps {
  flight: ISimpleFlight;
  locale: string;
  large?: boolean;
  round?: boolean;
  caption?: boolean;
}

export const OperatorLogo: FC<OperatorLogoProps> = ({
  flight,
  locale,
  large,
  round,
  caption,
}) => {
  const { t } = useTranslation();
  const carrier = flight.operatingBy.carrier ?? flight.flightId.carrier;

  const classes = [
    "company-logo",
    `company-logo--${carrier}`,
    large ? "large" : "",
    round ? "round" : "",
    locale === "ru" ? "ru" : "",
  ]
    .filter(Boolean)
    .join(" ");

  return (
    <div>
      {caption && <div className="operator-logo__caption">{t("SHARED.AVIACOMPANY")}</div>}
      <div
        className={classes}
        data-testid="operator-logo"
        title={carrier}
      />
    </div>
  );
};
