0c66bd677e
All checks were successful
Build & Publish Docker Image / build-and-push (push) Successful in 1m19s
Toast-Queue als $state-Store mit Auto-Dismiss nach 3 s und manuellem dismiss(id). Drei Kinds: info/error/success (Farbe). Renderer als <Toast /> im Root-Layout, fix-positioniert oben mittig. Wird vom Offline-Check der Schreib-Aktionen genutzt und später auch für Sync-Abschluss-Meldungen. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
26 lines
821 B
TypeScript
26 lines
821 B
TypeScript
export type ToastKind = 'info' | 'error' | 'success';
|
|
export type Toast = { id: number; kind: ToastKind; message: string };
|
|
|
|
class ToastStore {
|
|
toasts = $state<Toast[]>([]);
|
|
private nextId = 1;
|
|
private readonly dismissMs = 3000;
|
|
|
|
private push(kind: ToastKind, message: string): number {
|
|
const id = this.nextId++;
|
|
this.toasts = [...this.toasts, { id, kind, message }];
|
|
setTimeout(() => this.dismiss(id), this.dismissMs);
|
|
return id;
|
|
}
|
|
|
|
info(message: string): number { return this.push('info', message); }
|
|
error(message: string): number { return this.push('error', message); }
|
|
success(message: string): number { return this.push('success', message); }
|
|
|
|
dismiss(id: number): void {
|
|
this.toasts = this.toasts.filter((t) => t.id !== id);
|
|
}
|
|
}
|
|
|
|
export const toastStore = new ToastStore();
|