import { STATUS_STYLES } from "./tguStatus";

export function TguLegend() {
  return (
    <div className="tgu-legend" aria-label="Легенда статусов">
      {STATUS_STYLES.map((item) => (
        <span className="tgu-legend__item" key={item.label}>
          <span className={`tgu-legend__swatch ${item.className}`} />
          {item.label}
        </span>
      ))}
      <span className="tgu-legend__note">Стрелки показывают следующий план того же КА по времени.</span>
    </div>
  );
}