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>
41 lines
1.0 KiB
TypeScript
41 lines
1.0 KiB
TypeScript
// Kurze Rückmeldungen nach einer Aktion („Dienst neu gestartet“). Außerhalb von React
|
|
// gehalten, damit jede Stelle melden kann, ohne einen Kontext durchzureichen.
|
|
|
|
import { useSyncExternalStore } from "react"
|
|
|
|
export type MeldungsArt = "erfolg" | "fehler" | "info"
|
|
export interface Meldung {
|
|
id: number
|
|
art: MeldungsArt
|
|
text: string
|
|
}
|
|
|
|
let meldungen: Meldung[] = []
|
|
let naechste = 1
|
|
const hoerer = new Set<() => void>()
|
|
const melde = () => hoerer.forEach((h) => h())
|
|
|
|
export function melden(art: MeldungsArt, text: string) {
|
|
const id = naechste++
|
|
meldungen = [...meldungen, { id, art, text }].slice(-4)
|
|
melde()
|
|
// Fehler bleiben, bis man sie wegklickt — die will man lesen können.
|
|
if (art !== "fehler") window.setTimeout(() => entfernen(id), 6000)
|
|
}
|
|
|
|
export function entfernen(id: number) {
|
|
meldungen = meldungen.filter((m) => m.id !== id)
|
|
melde()
|
|
}
|
|
|
|
export const useMeldungen = () =>
|
|
useSyncExternalStore(
|
|
(h) => {
|
|
hoerer.add(h)
|
|
return () => {
|
|
hoerer.delete(h)
|
|
}
|
|
},
|
|
() => meldungen,
|
|
)
|