Phase 7: Benachrichtigungen und Termine

Terminkalender mit Serienterminen, Selbstanmeldung, Warteliste und
Anwesenheitsliste. Vier Zustellwege hinter Schnittstellen: echtes SMTP,
ntfy (selbst gehostet), Telegram und Web-Push. Kalenderabonnement als
ICS-Feed, digitaler Dienstausweis mit signiertem QR und Pruefseite.

Niemand wird ungefragt benachrichtigt: ein neuer Zustellweg hat eine leere
Ereignisliste, und der Seed legt bewusst keine an. Was das Netz der Wehr
verlaesst, bekommt nur die Kurzfassung ohne Namen und Details.

Kein CalDAV (Lesen genuegt, ICS kann jeder Kalender) und kein WhatsApp
(Verarbeitung ueber Meta, Kosten je Konversation, Telefonbuchabgleich) --
beides im README begruendet.

56 neue Unit-Tests, 17 neue E2E-Tests, Version 0.8.0.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

scripts/screenshots.ts

@@ -204,6 +204,32 @@ const AUFNAHMEN: Aufnahme[] = [
     beschreibung: "Wasserförderung über lange Wegstrecke",
     angemeldet: true,
   },
+
+  // Phase 7 — Benachrichtigungen und Termine
+  {
+    name: "37-termine",
+    pfad: "/termine",
+    beschreibung: "Terminkalender mit Rückmeldung",
+    angemeldet: true,
+  },
+  {
+    name: "38-benachrichtigungen",
+    pfad: "/benachrichtigungen",
+    beschreibung: "Eigene Zustellwege und Kalenderabonnement",
+    angemeldet: true,
+  },
+  {
+    name: "39-vorlagen",
+    pfad: "/benachrichtigungen/vorlagen",
+    beschreibung: "Textvorlagen mit Platzhaltern und Vorschau",
+    angemeldet: true,
+  },
+  {
+    name: "40-dienstausweis",
+    pfad: "/ausweis",
+    beschreibung: "Digitaler Dienstausweis mit QR-Code",
+    angemeldet: true,
+  },
 ];
 
 /**
@@ -298,15 +324,41 @@ async function fertigGeladen(seite: Page): Promise<void> {
   await seite.waitForTimeout(500);
 }
 
+/**
+ * Anmelden — mit Wiederholung, weil der erste Versuch bei kaltem .next
+ * regelmaessig ins Leere geht.
+ *
+ * Der Grund ist keine Schwaeche der Anwendung, sondern der
+ * Entwicklungsserver: "networkidle" sagt, dass die Skripte geladen sind, nicht
+ * dass React sie schon ausgefuehrt hat. Wird davor geklickt, laeuft der
+ * onSubmit-Handler nicht, und das Formular schickt sich als gewoehnliches GET
+ * ab — erkennbar daran, dass Adresse und Passwort in der Adresszeile stehen.
+ *
+ * Statt blind eine Wartezeit einzubauen, wird das erkannt und der Versuch
+ * wiederholt. Beim zweiten Mal ist die Seite uebersetzt und hydriert.
+ */
 async function anmelden(seite: Page): Promise<void> {
-  await seite.goto(`${BASIS}/anmelden`, { waitUntil: "networkidle" });
-  await seite.getByLabel("E-Mail-Adresse").fill(ADMIN_EMAIL);
-  await seite.getByLabel("Passwort").fill(ADMIN_PASSWORT);
-  await seite.getByRole("button", { name: "Anmelden" }).click();
-  // Grosszuegig: bei kaltem .next uebersetzt "next dev" die Route erst beim
-  // ersten Aufruf, und das dauert deutlich laenger als eine Anmeldung.
-  await seite.waitForURL(`${BASIS}/`, { timeout: 90_000 });
-  await seite.waitForLoadState("networkidle");
+  for (let versuch = 1; versuch <= 3; versuch += 1) {
+    await seite.goto(`${BASIS}/anmelden`, { waitUntil: "networkidle" });
+    await seite.getByLabel("E-Mail-Adresse").fill(ADMIN_EMAIL);
+    await seite.getByLabel("Passwort").fill(ADMIN_PASSWORT);
+    await seite.getByRole("button", { name: "Anmelden" }).click();
+
+    try {
+      // Grosszuegig: bei kaltem .next uebersetzt "next dev" jede Route erst
+      // beim ersten Aufruf, und das dauert deutlich laenger als eine Anmeldung.
+      await seite.waitForURL(`${BASIS}/`, { timeout: 90_000 });
+      await seite.waitForLoadState("networkidle");
+      return;
+    } catch (fehler) {
+      const nichtHydriert = seite.url().includes("?email=");
+      if (versuch === 3 || !nichtHydriert) throw fehler;
+
+      console.warn(
+        `[screenshots] Anmeldung lief ins Leere (Seite war noch nicht hydriert) — Versuch ${versuch + 1}`,
+      );
+    }
+  }
 }
 
 /**

scripts/vapid.ts

@@ -0,0 +1,32 @@
+import webpush from "web-push";
+
+/**
+ * VAPID-Schlüsselpaar für Web-Push erzeugen.
+ *
+ *     npm run vapid
+ *
+ * Die Ausgabe kommt in die .env. Beide Schlüssel gehören ins Backup:
+ *
+ *   * Der **öffentliche** wird dem Browser mitgegeben, wenn sich jemand für
+ *     Push anmeldet. Wechselt er, sind alle bestehenden Abos wertlos — jeder
+ *     müsste Push von Hand neu erlauben. Das merkt niemand von allein; die
+ *     Meldungen bleiben einfach aus.
+ *   * Der **private** signiert jede Nachricht an den Push-Dienst. Wer ihn hat,
+ *     kann im Namen dieser Installation Meldungen schicken.
+ *
+ * Erzeugt wird lokal, ohne Netzzugriff — es ist reine Kryptografie.
+ */
+
+const paar = webpush.generateVAPIDKeys();
+
+console.log(`
+Schlüsselpaar erzeugt. Diese Zeilen in die .env übernehmen:
+
+WEBPUSH_ENABLED=true
+WEBPUSH_PUBLIC_KEY=${paar.publicKey}
+WEBPUSH_PRIVATE_KEY=${paar.privateKey}
+WEBPUSH_KONTAKT=mailto:kommandant@example.org
+
+Hinweis: Ein neuer öffentlicher Schlüssel macht alle bestehenden Push-Abos
+wertlos. Beide Schlüssel gehören deshalb ins Backup — nicht ins Git.
+`);