HitonabiandClaude Opus 5.5
907289d7dc
Drei Seiten statt zehn: Start, Updates, Modelle — am PC mit Kopfnavigation, am Handy mit Leiste unten. Umsetzung von Mockup A („Cockpit“), vom User am 23.09. gewaehlt. - Start: Hauptwarnleuchte + 8 Warnlampen, Rundinstrumente mit Live-Werten aus dem Strom (Speicher, Temperatur, Platte) und Laufzeit-Zaehlwerk, Checkliste der Waechter-Hinweise mit ihren Knoepfen, Flugplan (heute gelaufen / geplant), Radar-Kasten. - Updates: Bausteine mit „Laeuft → Neu“ und Zusammenfassung, laufende Auftraege, Verlauf der Sonntagslaeufe (neu: GET /api/updates/verlauf), Sicherungen samt Zurueckspielen mit Rueckfrage. - Modelle: Speicherbalken, Rollen Hirn/Coder/Dritte Rolle, wer die Modelle nutzt (7 Tage + 24 h je Stunde), Modell-Radar, weitere Eintraege, Modelle selbst suchen. - Schubladen: Dienste mit Protokoll und Neustart, Einstellungen (HF-Zugang), Hermes-Link. - Werkzeuge: Vite 8, React 19.3 mit React Compiler 1.0 (Babel), vitest 5, Tailwind 4.3, shadcn 4 (Radix) fuer Dialog/Schublade/Knopf, Schriften Barlow/Barlow Condensed/ JetBrains Mono. Entfernt: recharts, cmdk, Kraftgraph, zustand, Inter, Space Grotesk. - Startbuendel 115 KB gzip (Budget 140); Updates/Modelle/Schubladen laden bei Bedarf. - 16 Oberflaechen-Tests (Instrument-Bogen, Hauptleuchte, Zeitformate, Versionen). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
32 lines
1.4 KiB
TypeScript
32 lines
1.4 KiB
TypeScript
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>
|
|
}
|