Verbindingsmelding: custom code klaar en live getest, bouwstappen vastgelegd

Bob's keuze: een melding in de header via een App State-vlag, in plaats van elke
pagina aanpassen. Geschreven en op de emulator getest:

- Custom Action checkVerbinding: HEAD op de site-root (200, 0 bytes, 57 ms) en
  zet de vlag via FFAppState().update() - alleen update() roept notifyListeners
  aan, de setters in app_state.dart niet.
- Custom Widget VerbindingsBanner: luistert zelf via AnimatedBuilder op
  FFAppState. Dat moet ook: widgets hier lezen App State via de singleton, niet
  via context.watch, dus een Visibility-conditie zou niet opnieuw evalueren.
  Throttle van 20s over alle pagina's, en een tik herlaadt bij herstel de route
  zodat de data alsnog laadt.

Getest: online geen balk, offline rode balk in merkrood, na netwerk terug plus
tik verdwijnt hij. Bouwstappen voor de builder staan erbij, inclusief de vier
pagina's zonder header.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

TASKS.md

@@ -1,5 +1,68 @@
 ## ▶ Nu aan de beurt (stand 2026-09-13)
 
+### 🔧 Verbindingsmelding in de header — code klaar, bouwstappen voor Bob
+
+Bob's keuze 2026-09-13: niet elke pagina aanpassen, maar **één melding in de
+header**, gevoed door een App State-vlag die de app zelf zet. Claude heeft de
+custom code geschreven en live getest op emulator-5556 (eigen profile-build,
+banner tijdelijk in `home_widget.dart` geprikt).
+
+⚠️ **Waarom dit een Custom WIDGET is en geen Text met een Visibility-conditie.**
+De widgets in dit project lezen App State via de singleton `FFAppState()`, niet
+via `context.watch`. `main.dart` zet er wel een `ChangeNotifierProvider`
+omheen, maar niemand abonneert zich. Een Visibility-conditie op een App State-
+bool zou dus pas opnieuw evalueren als er toevallig iets ánders een rebuild
+veroorzaakt — de balk verschijnt dan niet of veel te laat. Het widget luistert
+zelf via `AnimatedBuilder(animation: FFAppState())`. Om dezelfde reden zet de
+action de vlag met `FFAppState().update(...)` en niet met een kale toewijzing:
+**alleen `update()` roept `notifyListeners()` aan** (de setters in
+`app_state.dart` doen dat niet).
+
+**De twee bestanden** staan in de chat van 2026-09-13 als download. Plak steeds
+alleen wat ónder de `// DO NOT REMOVE`-regel staat; de importkop genereert
+FlutterFlow zelf.
+- **Custom Action `checkVerbinding`** — één HEAD-request op de site-root.
+  Gemeten: HTTP 200, **0 bytes, 57 ms** (tegenover 34 KB / 1,3 s voor een gewone
+  data-call), dus verwaarloosbaar. Een 401/404 telt als bereikbaar; alleen 5xx,
+  timeouts en netwerkfouten zetten de vlag. Return Type **Boolean**, geen
+  argumenten.
+- **Custom Widget `VerbindingsBanner`** — parameters `width` (double, optioneel),
+  `height` (double, optioneel), `tekst` (String, optioneel); alle drie leeg
+  laten volstaat. Toont niets zolang alles goed gaat (`SizedBox.shrink`, neemt
+  geen ruimte in), throttlet de automatische check op **max. 1 per 20 seconden
+  over alle pagina's samen**, en herlaadt bij een geslaagde tik de huidige route
+  zodat de data alsnog binnenkomt.
+
+**Stappen in de builder:**
+1. App Values → App State → `+ Add App State Variable`: naam **`geenVerbinding`**,
+   type **Boolean**, initial **false**, **Persisted uit**. Dit moet er zijn vóór
+   stap 2, anders kan de action niet opslaan.
+2. Custom Code → `+` → **Action** → naam `checkVerbinding` → body plakken →
+   Return Type Boolean → **Ctrl+S** (zonder die expliciete save haalt het de
+   export niet, ook al staat er "Synced").
+3. Custom Code → `+` → **Widget** → naam `VerbindingsBanner` → body plakken →
+   de drie parameters aanmaken → **Ctrl+S**.
+4. `HeaderButtonsComponent` openen. De banner moet **onder** de bestaande Row
+   met de knoppen, niet ernaast (anders verschuift de hamburger). Zit alles nu
+   in één `Row`: die eerst **Wrap Widget → Column**, dan het widget als tweede
+   kind erin slepen (Build-tab → Elements → zoeken op `VerbindingsBanner`).
+5. Vier pagina's hebben géén `HeaderButtonsComponent`: `mijnProfiel`,
+   `wachtwoordVergeten`, `stadsactiviteitAanmaken`, `uitgaansevenementAanmaken`.
+   Op de twee **aanmaakpagina's** is de banner wel zinvol (een formulier
+   verzenden zonder netwerk) — daar het widget los bovenaan de Column zetten.
+6. Testen: `adb -s <device> shell svc wifi disable` + `svc data disable`, app
+   herstarten, daarna weer `enable`.
+
+✅ **Live getest (2026-09-13, telefoon-emulator):** online geen balk en de
+layout onveranderd; offline een rode balk (`primary`, #9A141D) met wolkje en de
+tekst "Geen verbinding — tik om het opnieuw te proberen"; na netwerk terug + een
+tik verdwijnt de balk. Screenshots staan in de chat.
+
+⚠️ **Wat de banner NIET oplost:** het grijze blok op Home blijft staan, want dat
+blok ís de gecrashte widget (bevinding C hieronder). De banner maakt het alleen
+verklaarbaar in plaats van kapot. De vier crashplekken blijven dus een aparte
+taak.
+
 ### 🐞 Nieuw gevonden 2026-09-13 (Claude, code-audit op verse export)
 
 Twee echte bevindingen uit een browserloze audit; allebei nagemeten tegen