import { cn } from "cn"
import type { FlugplanEintrag } from "@/lib/typen"
import { flugplanZeit } from "@/lib/zeit"

const STATUS: Record<FlugplanEintrag["status"], { text: string; farbe: string }> = {
  erledigt: { text: "Erledigt", farbe: "text-gruen" },
  fehler: { text: "Fehler", farbe: "text-rot" },
  geplant: { text: "Geplant", farbe: "text-text-3" },
}

function Zeile({ e }: { e: FlugplanEintrag }) {
  const s = STATUS[e.status] ?? STATUS.geplant
  // Updates sind das Wichtigste im Plan — sie stehen in Cyan.
  const farbe = e.status === "geplant" && /update/i.test(e.titel) ? "text-cyan" : s.farbe
  return (
    <li className="grid grid-cols-[112px_minmax(0,1fr)_auto] items-center gap-3 border-t border-linie py-2.5">
      <span className="ziffern text-sm text-text-3">{flugplanZeit(e.zeit)}</span>
      <span className="min-w-0 text-base">
        {e.titel}
        {e.text && <span className="text-text-3">, {e.text}</span>}
      </span>
      <span className={cn("schild text-[13px]", farbe)}>{s.text}</span>
    </li>
  )
}

export function Flugplan({ gelaufen, geplant }: { gelaufen: FlugplanEintrag[]; geplant: FlugplanEintrag[] }) {
  const alle = [...gelaufen, ...geplant.slice(0, 5)]
  if (alle.length === 0) return <p className="text-[15px] text-text-2">Heute ist noch nichts gelaufen, und nichts ist geplant.</p>
  return <ol className="m-0 flex list-none flex-col p-0">{alle.map((e) => <Zeile key={`${e.titel}-${e.zeit}`} e={e} />)}</ol>
}