import type { FC } from "react";
import type { IFlightLegStation } from "../../types.js";

export type StationAlign = "left" | "right" | "center";
export type StationSize = "small" | "medium" | "large";

export interface StationProps {
  station: IFlightLegStation;
  align?: StationAlign;
  size?: StationSize;
}

export const Station: FC<StationProps> = ({ station, align = "left", size = "medium" }) => {
  const classes = [
    "station",
    `station--${align}`,
    `station--${size}`,
  ].join(" ");

  return (
    <div className={classes}>
      <span className="station__city">{station.scheduled.city}</span>
      <span className="station__code">{station.scheduled.airportCode}</span>
      {station.terminal && <span className="station__terminal">T{station.terminal}</span>}
    </div>
  );
};
