docs(changelog): Version 1.3.1 abgeschlossen

Abschnitt "Unveroeffentlicht" in "1.3.1 - 2026-09-23" umbenannt, neuer leerer
Abschnitt darueber. Enthalten: Bilder im Dateibereich, Modul-Kacheln nur fuer
berechtigte Benutzer, Raster misst seine Breite auch aus dem Leerzustand.

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

.planning/.continue-here.md

@@ -0,0 +1,154 @@
+---
+context: default
+phase: null
+task: null
+total_tasks: null
+status: paused
+last_updated: 2026-09-22T14:15:00.000Z
+---
+
+<current_state>
+Kein laufender Meilenstein. Alle 18 Phasen sind abgeschlossen; seit der Freigabe
+1.2.0 laeuft die Arbeit als Quick-Tasks. **Version 1.3.0 wurde am 22.09.2026
+freigegeben** (Tag `v1.3.0` auf `d146234`, Abbilder `live` und `v1.3.0`,
+Gitea-Release mit `Tessera-Setup-1.3.0.exe` und `Tessera-1.3.0.AppImage`).
+
+`main == origin/main` auf `1315f37`, Arbeitsbaum sauber, CI gruen. Der lokale
+Docker-Stack laeuft mit genau diesem Stand (web, api, db).
+
+Unterbrochen wurde NICHT mitten in einer Aufgabe — alle acht Auftraege dieser
+Sitzung sind fertig, nachgewiesen und gepusht. Der naechste Auftrag (Proxmox)
+ist inhaltlich geklaert, wartet aber auf Zugangsdaten des Nutzers.
+</current_state>
+
+<completed_work>
+
+Diese Sitzung (21.09. abends bis 22.09. nachmittags):
+
+- quick-260921-pi9 — Dashboard-Widget „Bilderrahmen" (Upload oder https-Adresse, Diashow, Grossansicht)
+- quick-260921-qd3 — Dashboard-Widget „XFrame" (Webseite als Rahmen, Sandbox ohne Top-Navigation)
+- quick-260922-frg — Tray-Update-Eintrag nennt den Grund einer fehlgeschlagenen Pruefung, Klick prueft erneut, Pruefung alle 4 h
+- fast `747a4d4` — Download-Knoepfe im Desktop-Client oeffnen den System-Browser (waren ohne Funktion)
+- quick-260922-ge2 — XFrame: Ausschnitt waehlen und einpassen, Zoom, „Nur anzeigen"
+- **Freigabe 1.3.0** — CHANGELOG abgeschlossen, `live` vorgezogen, Tag gepusht, drei CI-Laeufe gruen
+- quick-260922-hk4 — Bilderrahmen-Bilder in den Dateibereich `user-files` statt in die Datenbank, automatischer Umzug beim Start, Selbstheilung aus der alten Spalte
+- quick-260922-m1h — Widget-Typen an EINER Stelle, Katalog aus der Registry + Modulfilter, Kachel kennt ihr Modul
+
+Jeder Punkt wurde im Browser (Playwright-MCP) gegen den lokalen Stack geprueft;
+die Pruefprotokolle stehen in den jeweiligen SUMMARY.md unter `.planning/quick/`.
+</completed_work>
+
+<remaining_work>
+
+1. **Proxmox-Modul** (PVE, PBS, PMG) — **nur beobachten**, keine Eingriffe.
+   Seite: Server anbinden, VMs/Container mit CPU, Arbeitsspeicher, Plattenplatz
+   und Erreichbarkeit; bei PBS Sicherungslaeufe und Pruefstatus, bei PMG die
+   Mail-Zahlen (zugestellt, gefiltert, blockiert, Quarantaene).
+2. **Proxmox-Kachel** — kompakte Fassung ueber den neuen Weg (drei Stellen,
+   siehe unten). Vorschlag fuer den Inhalt steht in der Sitzung: Ampel je Server
+   + drei Balken; PBS: Alter der letzten Sicherung, Pruefergebnis, freier Platz;
+   PMG: Tageszahlen in einer Zeile. Idee fuer spaeter: eine Sammelkachel
+   „Alles in Ordnung?" mit einer Zeile je Server.
+</remaining_work>
+
+<decisions_made>
+
+- **Bilder auf die Festplatte, nicht in die Datenbank** — Grund ist die Sicherung
+  (`pg_dump` von Hand; 30 Bilder à 5 MiB je Benutzer waeren 150 MB pro Benutzer
+  im Abzug), nicht die Geschwindigkeit, und die Einheitlichkeit mit Avataren
+  (`user-files/avatars`) und DKV-Exporten.
+- **Zweistufige Umstellung:** Spalte `data` bleibt vorerst stehen; `getBytes`
+  stellt eine fehlende Datei daraus wieder her. DROP erst, wenn alpha UND live
+  einmal mit dieser Version gelaufen sind — Todo liegt unter
+  `.planning/todos/pending/2026-09-22-dashboard-image-data-spalte-entfernen.md`.
+- **Proxmox: nur beobachten**, Zugriff ueber die normale Modulfreigabe
+  (Nutzeransage 22.09.).
+- **Kacheln gesperrter Module erscheinen gar nicht erst im Katalog**
+  (Nutzeransage 22.09.) — so umgesetzt in m1h.
+- **Basic-Auth am Proxy vor alpha bleibt** (Nutzerentscheidung). Aus dem
+  Firmennetz greift eine Ausnahme; von aussen 401, und der Client sagt das seit
+  frg selbst. **Nicht erneut vorschlagen, das Thema ist entschieden.**
+</decisions_made>
+
+<blockers>
+- Proxmox braucht Zugangsdaten und Serveradressen des Nutzers (API-Token, nur
+  lesend, z. B. Rolle `PVEAuditor`). Der Nutzer legt sie morgen an. Planung und
+  Modulskelett koennen vorher entstehen, die Anbindung nicht getestet werden.
+</blockers>
+
+## Required Reading (in order)
+
+1. `.planning/quick/260922-m1h-dashboard-widgets-ein-modul-bringt-seine/260922-m1h-SUMMARY.md` — Abschnitt „So fuegt man kuenftig eine Modul-Kachel hinzu": drei Stellen statt sieben.
+2. `docs/anleitung-entwicklung.md` — Modul-Walkthrough (Backend + Frontend) und der neue Abschnitt „Eine Kachel zum Modul".
+3. `.planning/quick/260922-hk4-bilderrahmen-bilder-auf-die-festplatte/260922-hk4-SUMMARY.md` — Dateiablage, wenn das Proxmox-Modul jemals Dateien speichert.
+4. `.planning/STATE.md` — Abschnitte „Current Position" und die letzten Zeilen der Quick-Tabelle.
+
+## Critical Anti-Patterns (do NOT repeat these)
+
+- [ANTI-PATTERN]: Planannahmen ueber den Bestand ungeprueft uebernehmen → m1h: der Plan
+  behauptete, `apps/web` importiere `@tessera/shared` bereits; es gab KEINE
+  Abhaengigkeit, und zwei Kommentare hielten das als Absicht fest. Der Executor
+  hat vor der ersten Zeile Code nachgemessen (Bau, Produktions-Abbild, natives
+  Type-Stripping unter `node:24-alpine`) statt der Annahme zu folgen.
+  **Mitigation:** jede Plan-Behauptung ueber vorhandene Abhaengigkeiten oder
+  Muster vor dem Umsetzen einmal am Code pruefen.
+- [ANTI-PATTERN]: Vorschau und Darstellung mit unterschiedlichen Layoutmassen →
+  ge2: die Kachel nutzte eine andere Rahmenhoehe als die Vorschau, wodurch Seiten
+  mit fensterhoehen-abhaengigem Layout (`vh`) an anderer Stelle lagen als
+  ausgewaehlt. **Mitigation:** Auswahl und Darstellung immer gegen dieselben
+  Masse rechnen.
+- [ANTI-PATTERN]: `position: fixed` in einer Dashboard-Kachel → pi9: die
+  Grossansicht blieb auf die Kachelflaeche beschraenkt, weil `react-grid-item`
+  eine CSS-`transform` traegt und damit zum Bezugsrahmen wird.
+  **Mitigation:** Overlays aus einer Kachel per `createPortal` in `document.body`
+  rendern (Muster: Kalender-Tooltip, jetzt auch `picture-frame-lightbox.tsx`).
+- [ANTI-PATTERN]: Playwright klickt in einem per `transform` skalierten iframe
+  nicht → ge2. **Mitigation:** Klickpunkt umrechnen und per
+  `elementFromPoint` + `mouse.click` pruefen; ist eine Werkzeuggrenze, kein Produktfehler.
+
+## Infrastructure State
+
+- **Lokaler Stack:** `docker compose` mit web, api, db laeuft auf dem Stand
+  `1315f37` (`up -d --build` am 22.09. nachmittags). `up` allein baut NICHT neu.
+  DB ohne Host-Port — Prisma vom Host ueber die Container-IP
+  (`docker inspect -f '{{range .NetworkSettings.Networks}}{{.IPAddress}}{{end}}' tessera-ctl-db-1`,
+  `tessera:tessera_dev`).
+- **Testdaten lokal:** im Admin-Dashboard stehen ein Bilderrahmen (zwei Bilder)
+  und ein XFrame auf `example.com` mit Ausschnitt. Harmlos, darf bleiben.
+- **alpha** (`alpha.tessera.ctl.de`) wurde am 22.09. auf `80a0d23` gezogen; die
+  spaeteren Commits (hk4, m1h) sind dort noch nicht drauf. Basic-Auth am Proxy
+  bleibt — von aussen 401, deshalb Messungen gegen alpha nur am Proxy vorbei
+  (auf dem Testserver `docker compose exec api` gegen `localhost:3001` oder
+  Host-Port 3000).
+- **Live** (`tessera.ctl.de`) laeuft noch auf 1.2.0; der Pull auf 1.3.0 steht beim
+  Nutzer aus.
+- **Desktop-Client:** neuester CI-Stempel `5aa577a` (Lauf 405). Der Nutzer muss
+  ihn einmal per Browser installieren, danach laeuft das Update ueber das Tray.
+
+<context>
+Die Sitzung war eine lange Kette kleiner, vollstaendig abgeschlossener Auftraege.
+Der rote Faden am Ende: Der Nutzer will als naechstes ein Proxmox-Modul, das
+zusaetzlich als Kachel auf dem Dashboard erscheint — und kuenftig sollen weitere
+Module dasselbe tun. Deshalb wurde zuerst das Fundament geraeumt (m1h), damit
+eine Modul-Kachel drei Handgriffe kostet statt sieben und Kacheln gesperrter
+Module automatisch verschwinden. Das Geruest dafuer (`WIDGET_MODULE_SLUGS`,
+serverseitiger Filter in `dashboard.service.ts`) ist vorhanden und noch leer;
+Proxmox waere der erste Eintrag.
+
+Fuer Proxmox selbst ist vorgemerkt: Serveradressen traegt nur ein Administrator
+ein (damit ist die Adresse eine bewusste Freigabe statt beliebiger Eingabe), fuer
+genau diese Adressen werden Zertifikatsfehler toleriert (Muster:
+`favorites/icon-discovery.service.ts`, undici-Dispatcher — Nodes globales `fetch`
+ignoriert ihn), Zugangsdaten verschluesselt per `CryptoService` (Muster
+`ldap-config.service.ts`), Abfrage im Hintergrund je Mandant nach dem Muster
+`dkv-scheduler.service.ts` (`onApplicationBootstrap`, nicht `onModuleInit`).
+</context>
+
+<next_action>
+Start with: Proxmox-Modul planen (`/gsd-quick` mit eigenem Plan wie bei ge2/hk4) —
+Datenmodell fuer Serverzugaenge (Adresse, Typ `pve|pbs|pmg`, verschluesselter
+Token), Abfrage im Hintergrund je Mandant, Modulskelett nach
+`docs/anleitung-entwicklung.md`, Seite mit Serverliste und Auslastung. Die
+Kachel kommt danach als eigener kleiner Auftrag ueber den neuen Weg. Vorher beim
+Nutzer abholen: Serveradressen und die lesenden API-Token.
+</next_action>

.planning/HANDOFF.json

@@ -0,0 +1,45 @@
+{
+  "version": "1.0",
+  "timestamp": "2026-09-22T14:15:00.000Z",
+  "phase": null,
+  "phase_name": "kein laufender Meilenstein — Quick-Tasks nach der Freigabe 1.3.0",
+  "phase_dir": null,
+  "plan": null,
+  "task": null,
+  "total_tasks": null,
+  "status": "paused",
+  "completed_tasks": [
+    {"id": 1, "name": "quick-260921-pi9 Bilderrahmen-Widget", "status": "done", "commit": "737974b,c080580,c3b4597,8bf3601"},
+    {"id": 2, "name": "quick-260921-qd3 XFrame-Widget", "status": "done", "commit": "d63d9f5,20a9eb2"},
+    {"id": 3, "name": "quick-260922-frg Tray-Update nennt den Grund, prueft alle 4 h", "status": "done", "commit": "d73aad1"},
+    {"id": 4, "name": "fast Download-Knoepfe im Desktop-Client", "status": "done", "commit": "747a4d4"},
+    {"id": 5, "name": "quick-260922-ge2 XFrame-Ausschnitt, Zoom, Nur anzeigen", "status": "done", "commit": "445b1d3,30fdd99,cf70a19"},
+    {"id": 6, "name": "Freigabe 1.3.0", "status": "done", "commit": "d146234 (Tag v1.3.0)"},
+    {"id": 7, "name": "quick-260922-hk4 Bilder in den Dateibereich statt in die Datenbank", "status": "done", "commit": "9039cea,8cbfb8b,82472ee"},
+    {"id": 8, "name": "quick-260922-m1h Modul bringt seine Kachel selbst mit", "status": "done", "commit": "56c07c3,8be0725"}
+  ],
+  "remaining_tasks": [
+    {"id": 9, "name": "Proxmox-Modul (PVE/PBS/PMG), nur beobachten — Plan schreiben und bauen", "status": "not_started"},
+    {"id": 10, "name": "Proxmox-Kachel (kompakte Version) ueber den neuen Weg", "status": "not_started"}
+  ],
+  "blockers": [
+    {"description": "Proxmox braucht Zugangsdaten des Nutzers (API-Token, nur lesend) und die Server-Adressen", "type": "human_action", "workaround": "Nutzer legt sie morgen an; Planung und Geruest koennen vorher entstehen"}
+  ],
+  "async_jobs": [],
+  "human_actions_pending": [
+    {"action": "Live-Server auf 1.3.0 ziehen (docker compose -f docker-compose.prod.yml pull && up -d --force-recreate api web)", "context": "Version 1.3.0 ist freigegeben, Abbilder live/v1.3.0 liegen bereit", "blocking": false},
+    {"action": "Neuen Desktop-Client einmal per Browser installieren", "context": "Danach laeuft das Update ueber das Tray-Symbol; Live hatte den Updater bis 1.2.0 nicht", "blocking": false},
+    {"action": "Proxmox-API-Token (nur lesend, z. B. Rolle PVEAuditor) fuer PVE, PBS und PMG anlegen und die Server-Adressen bereithalten", "context": "Voraussetzung fuer das naechste Modul; der Nutzer macht das morgen", "blocking": true}
+  ],
+  "decisions": [
+    {"decision": "Bilderrahmen-Bilder liegen im Dateibereich user-files, nicht als bytea in der Datenbank", "rationale": "Sicherung laeuft per pg_dump von Hand; 30 Bilder a 5 MiB je Benutzer waeren 150 MB pro Benutzer im Abzug. Geschwindigkeit war NICHT das Argument. Dazu Einheitlichkeit mit Avataren und DKV-Exporten.", "phase": null},
+    {"decision": "Spalte data bleibt vorerst stehen, DROP erst nach nachgewiesenem Lauf auf alpha und live", "rationale": "Zweistufige Umstellung; getBytes stellt eine fehlende Datei aus data wieder her (alter pg_dump + leeres Volume).", "phase": null},
+    {"decision": "Widget-Typen an EINER Stelle (packages/shared), Katalog filtert nach Modulzugriff", "rationale": "Vorarbeit fuer Proxmox und weitere Modul-Kacheln; vorher sieben Hartkodierungen je Kachel.", "phase": null},
+    {"decision": "Proxmox zunaechst NUR beobachten, keine Eingriffe; Zugriff ueber die normale Modulfreigabe", "rationale": "Ausdrueckliche Ansage des Nutzers am 22.09.", "phase": null},
+    {"decision": "Kacheln gesperrter Module erscheinen gar nicht erst im Katalog", "rationale": "Ausdrueckliche Ansage des Nutzers am 22.09.", "phase": null},
+    {"decision": "Basic-Auth am Proxy vor alpha bleibt", "rationale": "Entscheidung des Nutzers; aus dem Firmennetz greift eine Ausnahme. Nicht mehr ansprechen.", "phase": null}
+  ],
+  "uncommitted_files": [],
+  "next_action": "Proxmox-Modul planen: Prisma-Modelle fuer Serverzugaenge (Adresse, Typ pve|pbs|pmg, Token verschluesselt per CryptoService), Poller je Mandant nach dem Muster dkv-scheduler (onApplicationBootstrap), Modul-Skelett nach docs/anleitung-entwicklung.md, danach die Kachel ueber den neuen Weg (WIDGET_TYPES + WIDGET_MODULE_SLUGS + registerWidget).",
+  "context_notes": "Sitzung lief ueber 1,5 Tage: zwei neue Widgets, drei Desktop-Korrekturen, Freigabe 1.3.0, Speicherumstellung, Widget-Aufraeumen. Alles gepusht, main == origin/main auf 1315f37, Arbeitsbaum sauber, CI gruen. Der lokale Docker-Stack laeuft mit dem aktuellen Stand; Testfavoriten/Test-Widgets im Admin-Dashboard sind lokal stehen geblieben (harmlos). Naechster Schritt ist inhaltlich klar, haengt aber an den Zugangsdaten des Nutzers."
+}

.planning/STATE.md

@@ -5,9 +5,9 @@ current_phase: 18
 current_phase_name: desktop-client-fertigstellen
 status: verified
 stopped_at: "22.09.2026: 1.3.0 freigegeben; danach quick-260922-hk4 — Bilderrahmen-Bilder liegen jetzt im Dateibereich (user-files) statt in der Datenbank, Umzug laeuft automatisch beim Start, Selbstheilung aus der alten data-Spalte eingebaut; im Browser nachgewiesen. NAECHSTER SCHRITT, vom Nutzer noch nicht bestaetigt: (1) einmaliges Aufraeumen, damit ein Modul seine Dashboard-Kachel selbst mitbringt (heute sieben Hartkodierungen je Kachel; Katalog zeigt auch Kacheln gesperrter Module; gesperrte Kachel bleibt leer statt zu erklaeren) — das Geruest WIDGET_MODULE_MAP existiert und ist leer; (2) danach das Proxmox-Modul (PVE/PBS/PMG) und seine Kachel. Offen beim Nutzer: Live-Server auf 1.3.0 ziehen, neuen Client per Browser installieren."
-last_updated: "2026-09-22T13:40:00.000Z"
+last_updated: "2026-09-22T21:10:00.000Z"
-last_activity: 2026-09-21
+last_activity: 2026-09-22
-last_activity_desc: Quick 260922-hk4 — Bilderrahmen-Bilder in den Dateibereich umgezogen (automatisch beim Start, Selbstheilung aus der alten Spalte), im Browser nachgewiesen; davor Freigabe 1.3.0
+last_activity_desc: Quick 260922-vdk — Dashboard-Raster misst seine Breite auch aus dem Leerzustand; im echten Linux-Client gegengemessen (469 -> 389 px, Ziehen erreicht den rechten Rand)
 state_head: 4d485432c003a6caf68f6d85aff7de0bd27794e2
 progress:
   total_phases: 18
@@ -462,6 +462,8 @@ Gerettet aus `.continue-here.md`. Relevant fuer die noch offenen Live-Tests.
 | fast-260922-b | **Desktop-App: Download-Knoepfe in der App ohne Funktion (fast, 747a4d4).** Befund des Nutzers: „Herunterladen“ unter Einstellungen → Desktop-App tut in der App nichts (Windows und Linux). Ursache: die Webansicht hatte keinen Download-Handler — webkit2gtk verwirft Downloads dann still, WebView2 zeigte ebenfalls nichts. Fix: Hauptfenster entsteht im Code (`app.windows` in tauri.conf.json leer), weil nur `WebviewWindowBuilder` `on_download` annimmt; der Handler bricht den Download in der App ab und oeffnet die Adresse per Opener im System-Browser (Fortschritt, Speicherort, Passwortfenster fuer den Proxy). Capability `main` unveraendert. cargo fmt/clippy/test gruen. Nicht am laufenden Client geprueft (kein Display auf dem Dev-Host) — CI baut, Nachweis beim Nutzer oder auf der Windows-VM. | 2026-09-22 | 747a4d4 | — |
 | 260922-ge2 | **XFrame: Ausschnitt der Seite waehlen und einpassen, Zoom, „Nur anzeigen“.** Wunsch des Nutzers: nur einen bestimmten Ausschnitt der eingebetteten Seite zeigen, und die Groesse soll skalieren. Config: `crop {x,y,w,h}` in Seitenpixeln bei fester Layoutbreite 1280 (`XFRAME_PAGE_WIDTH`, keine UI), Klemmung ueber EINE Funktion `clampXframeCrop` (x+w ≤ 1280 verschiebt x; w ≥ 100, h ≥ 60, y+h ≤ 4000); `zoom` (50…150 %, nur Ganzseiten-Modus); `readOnly` (transparente Flaeche ueber dem Rahmen im Ansichtsmodus). Kachel: `computeCropLayout` (contain + Zentrierung, Massstab darf > 1 sein), der `<iframe>` wird selbst verschoben und skaliert (cross-origin — die Seite laesst sich von aussen nicht scrollen), Kachelmass per ResizeObserver. Einstellungen: Vorschau der Seite bei 1280 px (Stage 3000 Seitenpixel hoch, eigener Bildlauf), Rahmen als `<fieldset>` (Biome `useSemanticElements`) mit vier Eckgriffen, Ziehen per Pointer-Events mit lokalem Entwurf und genau einem PATCH beim Loslassen, Zahlenfelder als Tastaturweg; Zoom-Auswahl nur ohne Ausschnitt; Aktivieren setzt `readOnly` mit. **Befund im Browser-Rundgang, behoben (cf70a19):** Kachel und Vorschau hatten verschiedene Rahmenhoehen (max(y+h,720) vs. 3000) — bei vh-relativen Seiten (example.com `margin: 15vh`) lag derselbe Inhalt an verschiedenen Stellen, der gewaehlte Ausschnitt haette in der Kachel daneben gelegen; jetzt dieselbe Layouthoehe. Neun Pruefpunkte bestanden (Verschieben, Ecken mit fester Gegenecke und Mindestbreite, Klemmung der Zahlenfelder, Einpassen und Mitskalieren bei Kachelgroesse, Nur-anzeigen, Zoom 60 %, verweigernde Seite). Playwright kann in einem per `transform` skalierten iframe nicht selbst klicken — per `elementFromPoint` + `mouse.click` umgangen, ist eine Werkzeuggrenze. Test-Helfer `src/test/fake-resize-observer.ts`. **Zahlen:** web 604 → 640, api 1175, type-check 4/4, lint 5/5 (web 53 Warnungen unveraendert), `as unknown as` 27/6, Umlaut-Allowlist + „Ausschnitt“. | 2026-09-22 | 445b1d3,30fdd99,cf70a19 | [260922-ge2-xframe-widget-ausschnitt-der-eingebettet](./quick/260922-ge2-xframe-widget-ausschnitt-der-eingebettet/) |
 | 260922-hk4 | **Bilderrahmen-Bilder liegen jetzt im Dateibereich statt in der Datenbank.** Frage des Nutzers nach der Freigabe 1.3.0, ob `bytea` auf Dauer sinnvoll ist. Befund: Geschwindigkeit ist NICHT das Argument (ein Bild wird je Browser einmal taeglich geladen), die SICHERUNG ist es — gesichert wird von Hand per `pg_dump`, und 30 Bilder à 5 MiB je Benutzer waeren im Extremfall 150 MB pro Benutzer in jedem Abzug (alpha-DB heute 18 MB). Dazu Einheitlichkeit: Profilbilder (`user-files/avatars`, `User.avatarPath`) und DKV-Exporte liegen laengst im Volume. Umsetzung: Spalte `storagePath`, Ablage `user-files/dashboard-images/<userId>/<uuid>.<ext>` — Dateiname IMMER vom Server (UUID + Endung aus dem erkannten Mime-Typ), `originalName` nie im Pfad; ein eigener Ordner je Benutzer ist ausdruecklich KEIN Schutz, es entscheidet weiterhin die Besitzpruefung im Dienst. Umzug laeuft automatisch beim Start (`onApplicationBootstrap` ueber `forSystem()`), idempotent; die Spalte `data` bleibt bewusst vorerst stehen (Todo fuer den DROP, erst wenn alpha und live einmal gelaufen sind). **Befund im Rundgang, eigener Commit:** eine Zeile zeigte auf eine fehlende Datei (lokal Host vs. Container-Volume; im Betrieb: alter `pg_dump` + leeres Volume) — `getBytes` stellt die Datei jetzt aus der noch vorhandenen Spalte `data` wieder her, statt 404 zu melden. **Zahlen:** api 1175 → 1188, web 640, type-check 4/4, lint 5/5, RLS-Waechter 78/78. | 2026-09-22 | 9039cea,8cbfb8b,82472ee | [260922-hk4-bilderrahmen-bilder-auf-die-festplatte](./quick/260922-hk4-bilderrahmen-bilder-auf-die-festplatte/) |
+| 260922-m1h | **Ein Modul bringt seine Dashboard-Kachel jetzt selbst mit (Vorarbeit fuer Proxmox).** Bestandsaufnahme (lesend) hatte ergeben: ein neuer Widget-Typ war an SIEBEN Stellen hartkodiert (Union-Typ, Constraints, Registry, eigene `wireXWidget()` je Typ, Aufruf in page.tsx, zweite Liste im Katalogfenster, `@IsIn` im API-DTO); die Verbindung Kachel↔Modul existierte als `WIDGET_MODULE_MAP` in `dashboard.service.ts` (filtert fail-closed), war aber nie befuellt; der Katalog zeigte jedem alle Kacheln, auch die gesperrter Module. Umbau: `WIDGET_TYPES`/`WidgetType`/`WIDGET_MODULE_SLUGS` in `packages/shared` als EINE Quelle (API validiert per `@IsIn` gegen genau sie), ein generisches `registerWidget()` statt neun Funktionen, Katalog leitet seine Liste aus der Registry ab und filtert ueber `/modules/active` (fail-closed bei Fehler, reine Funktion `visibleWidgetTypes`), nicht verfuegbare Kachel zeigt `widgets.unavailable` statt leer zu bleiben. Deckungsgleichheits-Test faengt kuenftig jede vergessene Stelle. **Befund des Executors, geprueft statt vermutet:** `apps/web` hatte KEINE Abhaengigkeit auf `@tessera/shared` (frueher bewusst) — vor der Umsetzung nachgemessen, dass Bau und Produktions-Abbild das tragen (node:24-alpine strippt die Typen nativ); Folgeregel „nur loeschbare Syntax in shared“ steht als Warnung in der Datei. Verhalten der neun Kacheln unveraendert, im Browser bestaetigt (Reihenfolge, Anlegen, Entfernen, keine rohen Schluessel). Bewusst offen: der Einstellungs-Zweig je Typ in `widget-settings-panel.tsx` und die Live-Aktualisierung des Katalogs. **Zahlen:** api 1188 → 1202, web 640 → 659, type-check 4/4, lint 5/5 (74/53 wie Basis). | 2026-09-22 | 56c07c3,8be0725 | [260922-m1h-dashboard-widgets-ein-modul-bringt-seine](./quick/260922-m1h-dashboard-widgets-ein-modul-bringt-seine/) |
+| 260922-vdk | **Dashboard-Raster misst seine Breite auch aus dem Leerzustand heraus.** Meldung des Nutzers aus dem **Linux-Client**: rechts neben dem Kalender freie Flaeche, in die sich keine Kachel schieben laesst — „als ob es keinen Anker gibt“. Aus dem Bildschirmfoto zurueckgerechnet (Spaltenbreite 51,5 px, Platzhalter auf Spalte 13 = letzte moegliche, Rasterende bei x=1459 bei ~1660 px Inhaltsbreite): das Raster rechnete mit **1200 px** statt mit der echten Breite, rechts blieben ~460 px totes Feld. Ursache: die Breitenmessung hing in `useEffect(..., [])` mit `if (!containerRef.current) return` — haengt `DashboardGrid` mit NULL Kacheln ein, rendert der fruehe Ruecksprung in den Leerzustand den gemessenen `<div>` gar nicht, der Effekt bricht ab und laeuft nie wieder, auch nicht wenn spaeter die erste Kachel entsteht. `width` blieb die ganze Sitzung auf dem Startwert 1200; react-grid-layout vergleicht strikt (`width > breakpoint`), 1200 ist damit `md` (20 Spalten, 51,6 px) statt `lg`. Fix: Ref-Rueckruf `measureRef` statt Einmal-Effekt — folgt dem Knoten ueber den Wechsel Leerzustand ↔ gefuellt, misst synchron in der Commit-Phase, haengt den ResizeObserver dort an; Fenster-Horcher als zusaetzliches Netz; `applyWidth` verwirft 0 und nicht endliche Werte. **Verhalten sonst unveraendert** — belegte Plaetze bleiben gesperrt, nichts weicht aus (Ansage des Nutzers). **Geprueft im echten Client**, nicht im Browser: `Tessera-1.3.0.AppImage` auf `DISPLAY=:10` ueber den WebKit-Remote-Inspektor gesteuert. Gleicher Fehlerfall vorher/nachher: Kachel 469 px → **389 px** bei 1000 px Bereich, Ziehen endet jetzt bei 603 px = `1000 − 8 − 389`, exakt der rechte Rand. **Messfalle notiert:** im Client gegen `style.width`/`style.transform` messen, nie gegen `getBoundingClientRect()` — bei Fenster im Hintergrund friert WebKitGTK die Animationsuhr ein und der `width`-Uebergang bleibt auf dem alten Wert stehen. **Zahlen:** web 659 → 661 Tests, type-check 4/4, lint 5/5, Biome web 53 Warnungen unveraendert. | 2026-09-22 | d9f2af3,cf67c8a | [260922-vdk-dashboard-raster-misst-seine-breite-nich](./quick/260922-vdk-dashboard-raster-misst-seine-breite-nich/) |
 
 ## Deferred Items
 

.planning/quick/260922-m1h-dashboard-widgets-ein-modul-bringt-seine/260922-m1h-PLAN.md

@@ -0,0 +1,145 @@
+---
+phase: quick-260922-m1h
+plan: 01
+type: refactor
+autonomous: true
+subsystem: apps/web/src/components/dashboard
+requirements: []
+---
+
+# Quick-Aufgabe 260922-m1h: Ein Modul bringt seine Dashboard-Kachel selbst mit
+
+## Warum (Auftrag des Nutzers, 22.09.2026)
+
+Als Naechstes kommt ein Proxmox-Modul (PVE/PBS/PMG), das zusaetzlich als
+kompakte Kachel auf dem Dashboard erscheinen soll — und kuenftig sollen weitere
+Module dasselbe tun (PBS: Sicherungsstatus, PMG: Mail-Zahlen). Eine
+Bestandsaufnahme (lesend, 22.09.) hat ergeben:
+
+- **Ein neuer Widget-Typ ist heute an SIEBEN Stellen hartkodiert**: `WidgetType`
+  (Union), `WIDGET_CONSTRAINTS`, `WIDGET_REGISTRY`, eine eigene `wireXWidget()`
+  je Typ, der Aufruf in `(portal)/page.tsx`, die ZWEITE Liste `WIDGET_TYPES` in
+  `widget-catalog-modal.tsx` und die `@IsIn`-Whitelist in
+  `apps/api/src/dashboard/dto/create-widget.dto.ts`. Vergisst man eine, fehlt die
+  Kachel im Katalog oder die API lehnt sie mit 400 ab.
+- **Die Verbindung Kachel↔Modul existiert schon, ist aber leer:**
+  `apps/api/src/dashboard/widget-module-map.ts` (`WIDGET_MODULE_MAP = {}`),
+  gelesen von `dashboard.service.ts` — `getWidgets()` filtert Kacheln aus, deren
+  Modul der Benutzer nicht hat (fail-closed, Zeile ~164-205). Das funktioniert,
+  wurde nur nie benutzt.
+- **Zwei Luecken:** (a) der Katalog („Widget hinzufuegen") zeigt JEDEM alle
+  Kacheln, auch die gesperrter Module — anlegen geht, danach verschwindet die
+  Kachel kommentarlos; (b) eine Kachel mit unbekanntem Typ rendert leer, ohne
+  Erklaerung.
+
+Diese Aufgabe raeumt das auf, BEVOR Proxmox kommt. Kein neues Modul, keine neue
+Kachel — reiner Umbau mit unveraendertem Verhalten fuer die neun vorhandenen
+Kacheln.
+
+## Gebundene Entscheidungen (Orchestrator)
+
+1. **Eine Quelle fuer die Typliste, geteilt zwischen Web und API.** In
+   `packages/shared/src/index.ts` (wird von beiden Apps bereits importiert, z. B.
+   `desktop.service.ts`, `apps/web/src/lib/app-version.ts`) kommt:
+   ```ts
+   export const WIDGET_TYPES = ['clock','search','calendar','note','calculator','favorites','stopwatch','picture-frame','xframe'] as const;
+   export type WidgetType = (typeof WIDGET_TYPES)[number];
+   /** Kachel → Modul-Slug; eine Kachel ohne Eintrag ist immer sichtbar. */
+   export const WIDGET_MODULE_SLUGS: Partial<Record<WidgetType, string>> = {};
+   ```
+   `create-widget.dto.ts` validiert mit `@IsIn([...WIDGET_TYPES])`, das Frontend
+   leitet `WidgetType` von dort ab. `widget-module-map.ts` behaelt seine
+   oeffentliche Funktion `getModuleSlugForWidgetType()`, liest aber
+   `WIDGET_MODULE_SLUGS` aus `@tessera/shared` statt einer eigenen Kopie
+   (Kommentar: eine Tabelle fuer beide Seiten, damit Katalogfilter und
+   Server-Filter nicht auseinanderlaufen).
+2. **Eine Anmeldestelle je Kachel.** Statt neun `wireXWidget()`-Funktionen mit je
+   eigenem Bool-Flag ein generisches `registerWidget(type, component)` in
+   `widget-registry.tsx`; `(portal)/page.tsx` ruft es je Kachel einmal auf (die
+   Datei bleibt die Stelle, an der die Komponenten importiert werden — der
+   Zirkelimport-Grund aus dem Bestandskommentar gilt weiter, also NICHT die
+   Komponenten direkt in der Registry importieren). Mehrfachanmeldung desselben
+   Typs ist ein No-Op (wie die bisherigen Flags); Anmeldung eines unbekannten
+   Typs wirft in der Entwicklung und wird in der Produktion ignoriert.
+3. **`WIDGET_REGISTRY` bekommt `moduleSlug?: string`** je Eintrag, befuellt aus
+   `WIDGET_MODULE_SLUGS`. Heute bleibt es fuer alle neun Kacheln leer.
+4. **Der Katalog leitet seine Liste aus der Registry ab** (`Object.keys` in der
+   Reihenfolge der Registry-Definition, die heutige Reihenfolge bleibt erhalten —
+   Test darauf) und **filtert nach Modulzugriff**: `widget-catalog-modal.tsx`
+   bekommt eine Liste der zugaenglichen Modul-Slugs als Prop von der Seite, die
+   sie ueber den vorhandenen Weg `/modules/active` holt (Muster
+   `apps/web/src/components/layout/sidebar.tsx` — dort wird genau dieser Endpunkt
+   schon gefetcht; dieselbe Hilfsfunktion nutzen, nicht neu bauen). Eine Kachel
+   ohne `moduleSlug` ist immer sichtbar; eine mit `moduleSlug` nur, wenn der Slug
+   in der Liste steht. Schlaegt der Abruf fehl, werden Kacheln MIT `moduleSlug`
+   ausgeblendet (fail-closed, wie serverseitig).
+5. **Gesperrte/unbekannte Kachel erklaert sich.** `widget-wrapper.tsx` rendert
+   heute nichts, wenn `definition?.component` fehlt. Neu: ein zentrierter grauer
+   Hinweistext `widgets.unavailable` („Diese Kachel steht nicht zur Verfügung —
+   das zugehörige Modul ist nicht freigegeben.") in de und en. Der Fall tritt
+   erst mit Proxmox real auf, ist aber ab jetzt abgedeckt.
+6. **Verhalten der neun vorhandenen Kacheln aendert sich NICHT.** Gleiche Namen,
+   gleiche Reihenfolge im Katalog, gleiche Groessenvorgaben, gleiche Einstellungen.
+   Der Einstellungs-Zweig je Typ in `widget-settings-panel.tsx` bleibt wie er ist —
+   den generisch zu machen waere ein eigener Umbau und gehoert NICHT in diese
+   Aufgabe (im SUMMARY als bewusst offen gelassen nennen).
+7. Keine neuen Abhaengigkeiten. Keine Aenderung an der Datenbank.
+
+## Aufgaben
+
+<tasks>
+
+<task type="auto" tdd="true">
+  <name>Aufgabe 1: Typliste nach @tessera/shared, generische Anmeldung, Katalog aus der Registry</name>
+  <files>packages/shared/src/index.ts, apps/api/src/dashboard/dto/create-widget.dto.ts, apps/api/src/dashboard/widget-module-map.ts, apps/api/src/dashboard/widget-module-map.spec.ts, apps/web/src/components/dashboard/widget-registry.tsx, apps/web/src/components/dashboard/widget-registry.test.tsx, apps/web/src/app/(portal)/page.tsx, apps/web/src/app/(portal)/page.test.tsx, apps/web/src/components/dashboard/widget-catalog-modal.tsx, apps/web/src/components/dashboard/widget-catalog-modal.test.tsx</files>
+  <action>
+    Entscheidungen 1-4 umsetzen. Reihenfolge: shared zuerst (beide Apps bauen dagegen), dann API-DTO und `widget-module-map.ts`, dann Registry + `registerWidget`, dann `page.tsx`, zuletzt der Katalog.
+    Tests zuerst anpassen/ergaenzen, wo sie die alten Namen festhalten (`widget-registry.test.tsx` prueft heute die Typliste und die Constraints-Tabelle; `widget-catalog-modal.test.tsx` die Eintraege). Neu mindestens: Katalogreihenfolge entspricht der Registry-Reihenfolge; eine Kachel mit `moduleSlug` fehlt im Katalog, wenn der Slug nicht in den zugaenglichen Modulen steht, und erscheint, wenn doch; fehlgeschlagener Modulabruf blendet Kacheln mit `moduleSlug` aus; `registerWidget` ist idempotent; `WIDGET_TYPES` aus shared und die Registry-Schluessel sind deckungsgleich (ein Test, der kuenftig jede vergessene Stelle faengt).
+    Fuer den Katalog-Test eine Kachel mit `moduleSlug` brauchen, ohne eine echte zu erfinden: die Registry im Test per Hilfsfunktion um einen Testeintrag erweitern ODER den Filter als reine Funktion `visibleWidgetTypes(registry, accessibleSlugs | null)` auslagern und diese direkt testen — die reine Funktion ist vorzuziehen (Muster `picture-frame-config.ts`).
+    Commit: `refactor(quick-260922-m1h): Widget-Typen an einer Stelle, Katalog aus der Registry, Kachel kennt ihr Modul`
+  </action>
+  <verify>
+    <automated>cd /home/vicolab/projects/tessera-ctl && pnpm --filter @tessera/web exec vitest run src/components/dashboard "src/app/(portal)/page.test.tsx" && pnpm --filter @tessera/api exec vitest run src/dashboard && pnpm type-check && pnpm lint</automated>
+  </verify>
+  <done>`WIDGET_TYPES`/`WidgetType`/`WIDGET_MODULE_SLUGS` stehen in `packages/shared`; API-DTO und Web leiten davon ab; genau EINE `registerWidget`-Funktion (kein `wireXWidget` mehr); Katalogliste kommt aus der Registry (keine zweite Liste); Deckungsgleichheits-Test vorhanden und gruen. Alle bestehenden Tests gruen, Reihenfolge und Namen der neun Kacheln unveraendert.</done>
+</task>
+
+<task type="auto" tdd="true">
+  <name>Aufgabe 2: Gesperrte Kachel erklaert sich, Uebersetzungen, Changelog, Entwicklerdoku</name>
+  <files>apps/web/src/components/dashboard/widgets/widget-wrapper.tsx, apps/web/src/components/dashboard/widgets/widget-wrapper.test.tsx, apps/web/src/messages/de.json, apps/web/src/messages/en.json, CHANGELOG.md, docs/anleitung-entwicklung.md</files>
+  <action>
+    Entscheidung 5 umsetzen (Hinweistext statt leerer Kachel, Test dafuer), Schluessel `widgets.unavailable` in beiden Sprachdateien.
+    `docs/anleitung-entwicklung.md`: den vorhandenen Modul-Walkthrough (Abschnitt um Zeile 372-400) um einen kurzen Abschnitt „Eine Kachel zum Modul" ergaenzen — welche drei Stellen es NACH diesem Umbau noch sind (Komponente schreiben, `registerWidget` in `page.tsx`, Eintrag in `WIDGET_TYPES` + optional `WIDGET_MODULE_SLUGS` in `packages/shared`, plus Uebersetzungen und Groessenvorgaben) und dass eine Kachel mit `moduleSlug` automatisch aus Katalog und Dashboard verschwindet, wenn das Modul fehlt.
+    CHANGELOG unter „Unveröffentlicht → Geändert": „Dashboard: Kacheln, die zu einem Modul gehören, erscheinen nur noch für Benutzer, die dieses Modul nutzen dürfen; eine nicht mehr freigegebene Kachel erklärt das jetzt, statt leer zu bleiben" (Stichpunkt, kein Fliesstext).
+    Volle Tore am Ende.
+    Commit: `docs(quick-260922-m1h): Hinweis bei gesperrter Kachel, Changelog und Entwicklerdoku`
+  </action>
+  <verify>
+    <automated>cd /home/vicolab/projects/tessera-ctl && pnpm --filter @tessera/web exec vitest run src/components/dashboard src/messages && pnpm type-check && pnpm lint && pnpm --filter @tessera/api test && pnpm --filter @tessera/web test</automated>
+  </verify>
+  <done>Unbekannter/gesperrter Typ zeigt den Hinweistext (Test); beide Sprachdateien tragen den Schluessel; Changelog-Zeile steht; Entwicklerdoku nennt die verbliebenen Schritte; alle Tore gruen; genau zwei Commits mit Scope `quick-260922-m1h`.</done>
+</task>
+
+</tasks>
+
+## Hinweise fuer den Executor
+
+- HEAD ist `ee2b025`, Arbeitsbaum sauber, Zweig `main`. Version 1.3.0 wurde heute freigegeben; dieser Umbau geht in die naechste Freigabe. Zweig `live` und Tags NICHT anfassen.
+- `packages/shared` wird von beiden Apps importiert (`@tessera/shared`); pruefen, ob ein Build-Schritt noetig ist (`pnpm --filter @tessera/shared build`?) — turbo erledigt das ueblicherweise, im Zweifel `pnpm build` fuer shared vor dem Typecheck.
+- Qualitaetsregeln: keine neue `any`, `as unknown as` api 27 / web 6 unveraendert, keine `!`, kein `biome-ignore`, web-Warnungen bleiben 53, api 74.
+- Commits: Conventional Commits, Scope `quick-260922-m1h`, deutscher Betreff im Stil von `git log --oneline -15`, Commit-Body endet mit
+  `Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>`
+- `.planning/**` NICHT committen.
+- Testserver nicht anfassen. Lokaler Docker-Stack laeuft, nicht noetig fuer diese Aufgabe.
+- SUMMARY nach `/home/vicolab/projects/tessera-ctl/.planning/quick/260922-m1h-dashboard-widgets-ein-modul-bringt-seine/260922-m1h-SUMMARY.md` (`status: complete`), mit: was jetzt noch zu tun ist, um eine Modul-Kachel hinzuzufuegen (die kurze Liste), Abweichungen, Zahlen, und einer kurzen Browser-Pruefliste fuer mich.
+
+<threat_model>
+ASVS 1, block on high.
+
+| ID | Bedrohung | Schwere | Disposition |
+|---|---|---|---|
+| T-M1H-01 | Katalogfilter clientseitig = Umgehung moeglich (Kachel per API trotzdem anlegen) | medium | Der Katalogfilter ist Komfort, die Durchsetzung bleibt serverseitig in `dashboard.service.ts` (`getWidgets()` filtert fail-closed) und im Modul-Guard der jeweiligen Daten-Endpunkte. Im Code so kommentieren. Akzeptiert. |
+| T-M1H-02 | Kachel eines gesperrten Moduls zeigt weiter Daten | high | Daten holt jede Kachel ueber ihre eigenen Modul-Endpunkte, die `@UseModule(slug)` tragen muessen — fuer Proxmox in der naechsten Aufgabe verbindlich. Diese Aufgabe aendert daran nichts und schwaecht nichts ab. |
+| T-M1H-03 | Typliste in `packages/shared` als neue Vertrauensgrenze | low | Reine Konstantenliste, keine Laufzeitdaten; die API validiert weiterhin mit `@IsIn` gegen genau diese Liste. Mitigiert. |
+| T-M1H-04 | Fehlender Modulabruf oeffnet den Katalog | medium | Fail-closed: bei Fehler werden Kacheln MIT `moduleSlug` ausgeblendet (Entscheidung 4), Test dafuer. Mitigiert. |
+</threat_model>

.planning/quick/260922-m1h-dashboard-widgets-ein-modul-bringt-seine/260922-m1h-SUMMARY.md

@@ -0,0 +1,215 @@
+---
+phase: quick-260922-m1h
+plan: 01
+subsystem: apps/web/src/components/dashboard
+tags: [refactor, dashboard, widgets, module-access]
+status: complete
+requires: []
+provides:
+  - "WIDGET_TYPES/WidgetType/WIDGET_MODULE_SLUGS als geteilte Quelle in packages/shared"
+  - "registerWidget() als einzige Anmeldestelle je Kachel"
+  - "visibleWidgetTypes() — Katalogfilter nach Modulzugriff, fail-closed"
+affects:
+  - apps/api/src/dashboard
+  - apps/web/src/app/(portal)/page.tsx
+tech-stack:
+  added:
+    - "apps/web haengt jetzt auf @tessera/shared (workspace:*)"
+  patterns:
+    - "erster Laufzeit-Import aus @tessera/shared (bisher nur import type)"
+key-files:
+  created:
+    - apps/api/src/dashboard/widget-module-map.spec.ts
+  modified:
+    - packages/shared/src/index.ts
+    - apps/web/src/components/dashboard/widget-registry.tsx
+    - apps/web/src/components/dashboard/widget-catalog-modal.tsx
+    - apps/web/src/components/dashboard/widgets/widget-wrapper.tsx
+    - apps/web/src/app/(portal)/page.tsx
+    - apps/api/src/dashboard/dto/create-widget.dto.ts
+    - apps/api/src/dashboard/widget-module-map.ts
+decisions:
+  - "Typliste als Laufzeit-Konstante in packages/shared statt gespiegelter Kopien — traegt, weil Node 24 rohes TypeScript per Type-Stripping laedt"
+  - "apps/web bekommt die Abhaengigkeit auf @tessera/shared; die frueher dokumentierte Gegenbegruendung war ueberholt"
+  - "Katalogfilter als reine Funktion visibleWidgetTypes(registry, slugs|null) statt Logik im Dialog"
+metrics:
+  duration: "~70 min"
+  completed: 2026-09-22
+actuals:
+  tokens: 21000
+  tasks: 2
+  commits: 2
+plan_head_before: ee2b025
+---
+
+# Quick-Aufgabe 260922-m1h: Ein Modul bringt seine Dashboard-Kachel selbst mit — Zusammenfassung
+
+Die Kachel-Typliste stand an sieben Stellen; sie steht jetzt an einer. Der
+Katalog fuehrt keine zweite Liste mehr und blendet Kacheln gesperrter Module
+aus, eine Kachel ohne Bauteil erklaert sich mit einem Satz statt leer zu
+bleiben. Die neun vorhandenen Kacheln verhalten sich unveraendert.
+
+## So fuegt man kuenftig eine Modul-Kachel hinzu
+
+Vorher sieben Stellen, jetzt drei (plus das Uebliche an Text und Maßen):
+
+1. **Kachel-Komponente schreiben** — `apps/web/src/components/dashboard/widgets/<name>-widget.tsx`,
+   nimmt `WidgetProps` (`instanceId`, `config`, `isEditMode`).
+2. **Typ eintragen** — in `WIDGET_TYPES` in `packages/shared/src/index.ts`. Gehoert die Kachel zu
+   einem Modul, zusaetzlich `WIDGET_MODULE_SLUGS['<typ>'] = '<modul-slug>'` in derselben Datei.
+   Das ist die einzige Liste — die API validiert per `@IsIn` gegen genau sie.
+3. **Anmelden** — `registerWidget('<typ>', <Name>Widget)` in `apps/web/src/app/(portal)/page.tsx`.
+
+Dazu wie bei jeder Oberflaeche: Uebersetzungsschluessel `<typ>.name` und `<typ>.description` unter
+`widgets` in **de.json und en.json**, ein Inline-SVG-Symbol und die Groessenvorgaben in
+`WIDGET_CONSTRAINTS` — Symbol und Maße in `widget-registry.tsx`.
+
+Eine Kachel mit `moduleSlug` verschwindet danach **von selbst** aus Katalog und Dashboard, wenn der
+Benutzer das Modul nicht nutzen darf. Vergisst man eine der drei Stellen, schlaegt der
+Deckungsgleichheits-Test in `widget-registry.test.tsx` fehl, statt dass die Kachel im Katalog fehlt
+oder die API mit 400 antwortet.
+
+Dieselbe Liste steht als Abschnitt „Eine Kachel zum Modul" in
+`docs/anleitung-entwicklung.md`.
+
+## Was gebaut wurde
+
+**Aufgabe 1 — `56c07c3`** (`refactor`)
+
+- `packages/shared/src/index.ts`: `WIDGET_TYPES`, `WidgetType`, `WIDGET_MODULE_SLUGS`.
+- `create-widget.dto.ts`: `@IsIn([...WIDGET_TYPES])` statt handgepflegter Liste.
+- `widget-module-map.ts`: liest `WIDGET_MODULE_SLUGS` statt einer eigenen Kopie; die oeffentliche
+  Funktion `getModuleSlugForWidgetType()` ist unveraendert, damit `dashboard.service.spec.ts`
+  sie weiter mocken kann.
+- `widget-registry.tsx`: neun `wireXWidget()` → ein `registerWidget()` (idempotent; unbekannter Typ
+  wirft in der Entwicklung, wird in der Produktion ignoriert). `WidgetDefinition` traegt
+  `moduleSlug?`. Neue reine Funktion `visibleWidgetTypes(registry, slugs|null)`.
+- `widget-catalog-modal.tsx`: Liste kommt aus der Registry (Reihenfolge erhalten, Test darauf),
+  gefiltert nach Modulzugriff; neue Prop `accessibleModuleSlugs`.
+- `(portal)/page.tsx`: neun `registerWidget`-Aufrufe; holt `/modules/active` im Muster der
+  Seitenleiste (`credentials: 'include'`, Fehler still) und reicht die Slugs an den Katalog durch.
+
+**Aufgabe 2 — `8be0725`** (`docs`)
+
+- `widget-wrapper.tsx`: Kachel ohne Bauteil zeigt `widgets.unavailable` zentriert und grau statt des
+  rohen Typnamens; Schluessel in de.json und en.json.
+- Changelog-Stichpunkt unter „Unveroeffentlicht → Geaendert"; Entwicklerdoku-Abschnitt.
+
+## Abweichungen vom Plan
+
+**1. [Rule 3 — blockierend] Die Planannahme „apps/web importiert @tessera/shared bereits" war falsch**
+
+- **Gefunden bei:** Aufgabe 1, vor der ersten Zeile Code.
+- **Befund:** `apps/web` hatte **keine** Abhaengigkeit auf `@tessera/shared`. Zwei Kommentare
+  (`lib/app-version.ts`, `lib/desktop.ts`) dokumentierten das sogar ausdruecklich als Absicht und
+  begruendeten damit gespiegelte Typen. Ohne Abhaengigkeit ist Entscheidung 1 des Plans nicht
+  umsetzbar. Zudem waren **alle** bisherigen `@tessera/shared`-Importe in `apps/api` reine
+  `import type` — die Typliste ist aber ein Laufzeitwert.
+- **Geprueft statt vermutet:**
+  - `nest build` mit einem Laufzeit-Import: laeuft; das Ergebnis laedt `@tessera/shared` im
+    fertigen `dist` tatsaechlich (nachgestellt, 9 Typen).
+  - `packages/shared` liefert rohes TypeScript ohne Bauschritt — in `node:24-alpine` direkt
+    geprueft: Node 24 laedt es per nativem Type-Stripping (`OK [ 'clock', 'xframe' ] {}`).
+  - Die alte Gegenbegruendung ist ueberholt: der Web-Dockerfile kopiert `packages/shared` in
+    deps- **und** builder-Stufe bereits. Es aendert sich nur das Lockfile (3 Zeilen).
+  - `pnpm --filter @tessera/web build` laeuft durch — ohne `transpilePackages`.
+- **Umsetzung:** `@tessera/shared: workspace:*` in `apps/web/package.json`. Die beiden Kommentare,
+  deren Begruendung dadurch unwahr wurde, sagen jetzt den aktuellen Stand; die Typ-Spiegel selbst
+  blieben bewusst unangetastet (nicht Teil dieser Aufgabe).
+- **Nebenwirkung fuer die Zukunft:** `packages/shared/src/index.ts` darf nur noch loeschbare Syntax
+  enthalten — kein `enum`, kein `namespace`, keine Parameter-Eigenschaften. Steht als Warnung in
+  der Datei.
+
+**2. [Abweichung vom Auftrag des Orchestrators] Keine gemeinsame Hilfsfunktion fuer `/modules/active`**
+
+Der Auftrag nannte „dieselbe Hilfsfunktion wie die Seitenleiste". Eine solche gibt es nicht: die
+Seitenleiste hat einen eingebauten `fetch`, und `lib/api.ts#getActiveModules` ist serverseitig
+(Cookie-Header, kein `credentials`). Die Dashboard-Seite benutzt daher dasselbe **Muster** wie die
+Seitenleiste. Eine Hilfsfunktion herauszuloesen haette `sidebar.tsx` angefasst — ausserhalb dieser
+Aufgabe.
+
+## Bewusst offen gelassen
+
+- **`widget-settings-panel.tsx`** — der Einstellungs-Zweig je Typ bleibt wie er war. Den generisch
+  zu machen ist ein eigener Umbau (so im Plan festgelegt). Die Datei wurde nicht angefasst.
+- **Die Typ-Spiegel** in `lib/app-version.ts` und `lib/desktop.ts` koennten jetzt echte Importe
+  werden. Nicht gemacht, nur die Kommentare richtiggestellt.
+- **Katalog aktualisiert sich nicht live**, wenn im Marketplace gerade ein Modul freigeschaltet
+  wird — die Seitenleiste tut das ueber `sidebarRefreshKey`, die Dashboard-Seite holt die Liste nur
+  beim Aufbau. Heute ohne Wirkung (keine Kachel hat einen `moduleSlug`); mit Proxmox reicht ein
+  Neuladen der Seite. Bewusst so, weil der Auffrisch-Ausloeser einen `biome-ignore` erzwungen
+  haette, den die Qualitaetsregeln dieser Aufgabe ausschliessen.
+
+## Keine Stubs
+
+Es wurden keine Platzhalter, leeren Rueckgaben oder „coming soon"-Texte eingebaut.
+`WIDGET_MODULE_SLUGS` ist leer — das ist kein Stub, sondern der korrekte Zustand: alle neun Kacheln
+sind Plattform-Kacheln. Die erste Modul-Kachel (Proxmox) traegt sich dort ein.
+
+## Bedrohungsmodell
+
+| ID | Stand |
+|---|---|
+| T-M1H-01 | Akzeptiert wie geplant. Der Katalogfilter ist Komfort; im Code an drei Stellen so kommentiert. Durchsetzung bleibt `DashboardService.getWidgets` (unveraendert, 85 Tests gruen). |
+| T-M1H-02 | Unveraendert — diese Aufgabe schwaecht nichts ab. Fuer Proxmox bleibt `@UseModule(slug)` verbindlich. |
+| T-M1H-03 | Mitigiert. Reine Konstantenliste, keine Laufzeitdaten; die API validiert weiterhin `@IsIn` gegen genau diese Liste — jetzt nachweislich (Test validiert alle neun Typen und lehnt einen unbekannten ab). |
+| T-M1H-04 | Mitigiert. `accessibleModuleSlugs === null` blendet Kacheln MIT `moduleSlug` aus; Test im Katalog und in `visibleWidgetTypes`. |
+
+## Zahlen
+
+| | |
+|---|---|
+| Commits | 2 (`56c07c3`, `8be0725`), Basis `ee2b025` |
+| Dateien geaendert | 20 (1 neu) |
+| Zeilen | +610 / −150 (gemessen: `git diff --shortstat ee2b025 HEAD`) |
+| Neue Tests | 29 (Registry 9, Katalog 3, Seite 2, `widget-module-map.spec.ts` 14, Wrapper 1) |
+| API-Tests | 1202 gruen (76 Dateien) |
+| Web-Tests | 659 gruen (81 Dateien) |
+| type-check | sauber (4 Pakete) |
+| lint | api 74 / web 53 Warnungen — **unveraendert** zur Basis |
+| `as unknown as` | api 27 / web 6 — **unveraendert** |
+| neue `any` / `!` / `biome-ignore` | 0 / 0 / 0 |
+| Next.js-Produktionsbau | laeuft |
+| `nest build` | laeuft |
+
+## Browser-Pruefliste
+
+Der Umbau ist verhaltensneutral — die Pruefung soll vor allem bestaetigen, dass **nichts** anders
+aussieht. Lokalen Stack neu bauen (`--build`), dann im Portal:
+
+1. **Dashboard oeffnen.** Alle bisherigen Kacheln stehen an ihrem Platz und funktionieren wie
+   vorher (Uhr laeuft, Kalender zeigt Termine, Bilderrahmen wechselt, XFrame laedt).
+2. **Stift → „Widget hinzufuegen".** Der Katalog zeigt **neun** Kacheln in genau dieser Reihenfolge:
+   Uhr, Suchleiste, Kalender, Notiz, Taschenrechner, Favoriten, Stoppuhr, Bilderrahmen, XFrame.
+   Namen und Beschreibungen unveraendert.
+3. **Eine Kachel anlegen** (z. B. Stoppuhr) — sie erscheint, laesst sich ziehen, vergroessern und
+   wieder entfernen. Kein 400-Fehler.
+4. **Groessen pruefen:** eine frisch angelegte Kachel hat dieselbe Startgroesse wie frueher, und
+   sie laesst sich nicht kleiner ziehen als bisher.
+5. **Einstellungen → Dashboard:** die Einstellungen je Kachel sind unveraendert da (dieser Bereich
+   wurde bewusst nicht angefasst).
+6. **Sprache auf Englisch umstellen** — der Katalog bleibt vollstaendig, keine rohen Schluessel wie
+   `clock.name` sichtbar.
+7. *(optional, zeigt das Neue)* Der Hinweis bei einer nicht verfuegbaren Kachel laesst sich heute
+   nur kuenstlich ausloesen — er greift erst mit der ersten Modul-Kachel. Wer ihn sehen will: in der
+   Datenbank den `widgetType` einer vorhandenen Kachel auf `proxmox` setzen und die Seite neu laden;
+   die Kachel zeigt dann „Diese Kachel steht nicht zur Verfuegung — das zugehoerige Modul ist nicht
+   freigegeben." statt leer zu bleiben. Danach zuruecksetzen.
+
+## Self-Check: PASSED
+
+- `apps/api/src/dashboard/widget-module-map.spec.ts` vorhanden.
+- Commits `56c07c3` und `8be0725` in `git log` gefunden.
+- `git diff --diff-filter=D ee2b025..HEAD` — keine geloeschten Dateien.
+- `git rev-list --count ee2b025..HEAD` = 2, gemessen.
+- `.planning/**` nicht committet.
+
+## Rundgang durch den Orchestrator (22.09.2026, lokaler Stack aus 8be0725)
+
+Bestanden, keine Abweichung zum Stand vorher:
+
+- Dashboard zeigt die bestehenden Kacheln (Kalender, Notizen, Favoriten, Bilderrahmen, XFrame) unveraendert, keine Konsolenfehler.
+- Katalog zeigt **neun** Kacheln in der alten Reihenfolge: Uhr, Suchleiste, Kalender, Notizen, Taschenrechner, Favoriten, Stoppuhr, Bilderrahmen, XFrame; Namen und Beschreibungen unveraendert, keine rohen Schluessel.
+- Stoppuhr angelegt → erscheint (396x160 px), wird gespeichert (`stopwatch` in `GET /dashboard/widgets`), kein 400; danach wieder entfernt, Liste sauber.
+- `/modules/active` wird beim Seitenaufbau abgerufen (4x 200) — der Katalogfilter hat seine Datenquelle.
+- Der Hinweis bei nicht verfuegbarer Kachel liess sich nicht echt ausloesen (es gibt noch keine Modul-Kachel); er ist durch den Test in `widget-wrapper.test.tsx` gedeckt und greift mit Proxmox.

.planning/quick/260922-vdk-dashboard-raster-misst-seine-breite-nich/260922-vdk-PLAN.md

@@ -0,0 +1,201 @@
+---
+phase: quick-260922-vdk
+plan: 01
+type: execute
+wave: 1
+depends_on: []
+autonomous: true
+requirements: [QUICK-260922-VDK]
+
+files_modified:
+  - apps/web/src/components/dashboard/dashboard-grid.tsx
+  - apps/web/src/components/dashboard/dashboard-grid.test.tsx
+  - CHANGELOG.md
+
+estimate:
+  tokens: 55000
+  raw_tokens: 55000
+  tasks: 2
+  confidence: low
+
+must_haves:
+  truths:
+    - "Ein Dashboard, das beim Öffnen leer ist, misst die verfügbare Breite, sobald die erste Kachel erscheint: das Raster füllt den Inhaltsbereich bis zum rechten Rand, rechts bleibt kein toter Streifen, in den sich keine Kachel ziehen lässt."
+    - "Die Messung überlebt den Wechsel Leerzustand → gefüllt, weil sie am eingehängten Knoten selbst hängt (Ref-Rückruf) und nicht an einem Effekt, der nur beim ersten Einhängen läuft."
+    - "Gemessen wird synchron in der Commit-Phase, bevor gezeichnet wird — der bisherige Zwischenzustand mit dem angenommenen Startwert wird nie sichtbar (auch nicht auf dem heute schon funktionierenden Pfad „Neuladen mit Kacheln“)."
+    - "Ändert sich die Fenstergröße, folgt die Rasterbreite; ein Fenster-Horcher ist das Sicherheitsnetz für den Fall, dass der ResizeObserver nichts meldet."
+    - "Das Ziehverhalten bleibt exakt wie heute: FREE_PLACEMENT_COMPACTOR mit preventCollision, ein belegtes Feld bleibt blockiert, nichts wird zur Seite geschoben (Nutzerentscheidung 22.09.2026); Leerzustand, BREAKPOINTS, COLS, rowHeight, margin und applyConstraintMinima sind unverändert."
+    - "Alle Tore grün: 12 Tests in dashboard-grid.test.tsx (10 alte unverändert + 2 neue), Web gesamt ≥ 661 Tests in 81 Dateien, `tsc --noEmit` 4/4, Biome 5/5 mit weiterhin genau 53 Warnungen in web, `as unknown as` in web weiterhin 6."
+  artifacts:
+    - "apps/web/src/components/dashboard/dashboard-grid.tsx — Messung über den Ref-Rückruf `measureRef` (synchrone Erstmessung + ResizeObserver am jeweils eingehängten Knoten, Trennen im null-Zweig), `applyWidth`-Wächter, Fenster-Horcher; deutscher Kommentarblock `quick-260922-vdk` mit dem Warum"
+    - "apps/web/src/components/dashboard/dashboard-grid.test.tsx — zwei neue Fälle (Leerzustand → gefüllt misst 1000; resize-Ereignis misst 1600) und `vi.unstubAllGlobals()` im bestehenden `afterEach`"
+    - "CHANGELOG.md — neuer Abschnitt „### Behoben“ unter „Unveröffentlicht“ mit einem Stichpunkt in Alltagssprache"
+  key_links:
+    - "Kachel hinzufügen → `widgets.length` wird 1 → der Zweig mit dem Raster rendert → React hängt den `<div>` ein → `measureRef(node)` → synchrone Messung + `observer.observe(node)` → `setWidth` noch vor dem Zeichnen → `Responsive width` → Spaltenbreite und Breakpoint stimmen"
+    - "Letzte Kachel entfernt → Knoten wird ausgehängt → `measureRef(null)` → `observerRef.current.disconnect()` (kein zurückgegebener Aufräum-Rückgabewert, damit React den null-Aufruf beibehält) → kein weiterlaufender Beobachter"
+    - "`window` resize → Horcher → `nodeRef.current.getBoundingClientRect().width` → `applyWidth` (verwirft 0 und nicht endliche Werte) → `setWidth`"
+---
+
+# Quick-Aufgabe 260922-vdk: Das Dashboard-Raster misst seine Breite auch aus dem Leerzustand heraus
+
+<objective>
+Auf einem Dashboard, das beim Öffnen leer ist, bleibt das Raster für die ganze Sitzung bei der angenommenen Breite von 1200 Pixeln stehen. Die erste hinzugefügte Kachel rechnet deshalb mit 20 statt 24 Spalten und 51,6 px Spaltenbreite, das Raster endet bei 1200 px und rechts davon liegt ein toter Bereich (gemessen: ~460 px bei 1920 px Bildschirmbreite), in den sich keine Kachel ziehen lässt. Diese Aufgabe hängt die Messung an den Knoten statt an den ersten Einhäng-Zeitpunkt, misst vor dem ersten Zeichnen und ergänzt einen Fenster-Horcher als Netz.
+
+Purpose: Fehlerbehebung aus einer bereits abgeschlossenen Messung — die Ursache steht fest, dieser Plan setzt nur noch um und sichert sie mit einem Regressionstest ab.
+Output: geänderte `dashboard-grid.tsx` mit deutschem Warum-Kommentar, zwei neue Tests (zuerst rot), ein Changelog-Stichpunkt, alle Tore grün, Prüfliste für den Browser-Rundgang im SUMMARY.
+</objective>
+
+## Befund (gemessen, nicht neu zu untersuchen)
+
+Der bisherige Code legt den Beobachter in einem Effekt mit leerer Abhängigkeitsliste an und bricht ab, wenn der Ref noch leer ist. Hängt `DashboardGrid` ein, während das Dashboard null Kacheln hat, greift der frühe Rücksprung in den Leerzustand **vor** dem `<div>` mit dem Ref: der Ref ist leer, der Effekt bricht ab — und läuft wegen der leeren Abhängigkeitsliste nie wieder, auch nicht, wenn später Kacheln erscheinen und der `<div>` tatsächlich entsteht. Die Breite bleibt für die ganze Sitzung beim Startwert.
+
+Belege (bestätigt, nicht zu wiederholen):
+
+- Echter Linux-Client (Tessera-1.3.0.AppImage, WebKitGTK), leeres Dashboard, eine Kalender-Kachel hinzugefügt: Kachel 469 px breit in einem 1000 px breiten Container — das ist die Rechnung für 1200.
+- Derselbe Client nach einem Neuladen mit vorhandener Kachel: 459 px in 1176 px, also richtig — weil die Ladeschranke in `(portal)/page.tsx` das Raster aus- und wieder einhängt, der Ref beim Einhängen also existiert.
+- Screenshot des Nutzers (1920×1045): Spaltenbreite 51,5 px, Platzhalter klebt an Spalte 13, rechte Rasterkante bei x = 1459 bei einem Inhaltsbereich bis ~1920.
+
+`react-grid-layout` vergleicht den Breakpoint strikt größer als (`width > breakpoint`), 1200 ist damit **nicht** `lg`, sondern `md` → 20 Spalten.
+
+## Gebundene Entscheidungen (nicht neu verhandeln)
+
+1. **Ref-Rückruf statt Einmal-Effekt.** Die Messung hängt am jeweils eingehängten Knoten und überlebt Aus- und Einhängen.
+2. **Synchron vor dem ersten Zeichnen.** Der Ref-Rückruf läuft in der Commit-Phase; die dort ausgelöste Zustandsänderung wird vor dem Zeichnen abgearbeitet. Ein zusätzlicher `useLayoutEffect` ist damit überflüssig.
+3. **Fenster-Horcher als Netz**, zusätzlich zum ResizeObserver, nicht statt seiner.
+4. **Verhalten sonst unverändert.** `FREE_PLACEMENT_COMPACTOR` mit `preventCollision` bleibt (Nutzerentscheidung 22.09.2026: ein belegtes Feld bleibt blockiert, nichts wird zur Seite geschoben). Leerzustand, `BREAKPOINTS`, `COLS`, `rowHeight`, `margin`, `applyConstraintMinima` bleiben wortgleich.
+5. **Startwert 1200 bleibt.** Er lebt nur noch bis zur Commit-Phase desselben Einhängens. Genau diesen Übergang 1200 → gemessen macht der Pfad „Neuladen mit Kacheln“ heute schon in Produktion, und er ist nachweislich richtig (459 px in 1176 px) — ein anderer Startwert würde eine bisher unerprobte Breakpoint-Folge einführen, ohne etwas zu verbessern.
+6. **Nur `apps/web`.** Keine API, kein Prisma, kein Docker, keine neuen Pakete (ResizeObserver und resize sind Browser-Schnittstellen).
+
+<execution_context>
+@~/.claude/gsd-core/workflows/execute-plan.md
+@~/.claude/gsd-core/templates/summary.md
+</execution_context>
+
+<context>
+@.planning/STATE.md
+@apps/web/src/components/dashboard/dashboard-grid.tsx
+@apps/web/src/components/dashboard/dashboard-grid.test.tsx
+@apps/web/src/test/fake-resize-observer.ts
+@apps/web/src/test/setup.ts
+</context>
+
+## Schnittstellen, die der Executor kennen muss
+
+- `apps/web/src/test/fake-resize-observer.ts` exportiert `stubResizeObserver({ width, height }): void`; es ersetzt den globalen ResizeObserver per `vi.stubGlobal` durch eine Klasse, deren `observe()` den Rückruf **sofort und synchron** mit `new DOMRectReadOnly(0, 0, width, height)` aufruft. Zurückgesetzt wird nur durch `vi.unstubAllGlobals()` — `vi.restoreAllMocks()` reicht dafür nicht.
+- `apps/web/src/test/setup.ts` legt global einen ResizeObserver-Ersatz an, der immer 1200×800 meldet. Ohne `stubResizeObserver` misst jeder Test also 1200 — der neue Test wäre damit blind für genau diesen Fehler.
+- `dashboard-grid.test.tsx` ersetzt `Responsive` durch einen Durchreicher, der die Props in `captured.props` ablegt (`vi.hoisted`, Mock per `importOriginal`, damit `noCompactor` echt bleibt). Die gemessene Breite ist dadurch als `captured.props?.width` prüfbar.
+- jsdom liefert für `getBoundingClientRect()` ohne Zutun 0 — die synchrone Erstmessung schlägt im Test also nicht durch, der gestubbte Beobachter liefert den Wert. Für den Fenster-Test wird `Element.prototype.getBoundingClientRect` gezielt überschrieben.
+- `new DOMRect(0, 0, w, h)` gibt es in jsdom (die Datei `fake-resize-observer.ts` nutzt bereits `DOMRectReadOnly`) — damit braucht der Test **keinen** Cast, und der Zähler `as unknown as` bleibt bei 6.
+
+<tasks>
+
+<task type="tracer" tdd="true">
+  <name>Aufgabe 1: Messung an den Knoten hängen (Ref-Rückruf, synchrone Erstmessung, Fenster-Horcher) — Ende-zu-Ende „leeres Dashboard → erste Kachel füllt die volle Breite“, zuerst rot</name>
+  <files>apps/web/src/components/dashboard/dashboard-grid.test.tsx, apps/web/src/components/dashboard/dashboard-grid.tsx</files>
+  <behavior>
+    Zuerst die Tests, beide müssen vor der Änderung rot sein:
+
+    - **Test 10 — Leerzustand → gefüllt:** `stubResizeObserver({ width: 1000, height: 800 })`; `captured.props` auf null setzen; mit `widgets: []` und leeren Layouts rendern → die Überschrift des Leerzustands steht da und `captured.props` ist weiterhin null (das Raster ist nicht eingehängt); danach **`rerender`** derselben Instanz mit einer Uhr-Kachel und einem passenden `lg`-Eintrag → `captured.props?.width` ist 1000. Rot vorher: der Wert bleibt 1200.
+    - **Test 11 — Fenstergröße:** `stubResizeObserver({ width: 1000, height: 800 })`; mit einer Uhr-Kachel rendern → Breite 1000; danach `Element.prototype.getBoundingClientRect` per `vi.spyOn(...).mockReturnValue(new DOMRect(0, 0, 1600, 800))` überschreiben und `window.dispatchEvent(new Event('resize'))` in `act(...)` auslösen → `captured.props?.width` ist 1600. Rot vorher: der Wert bleibt 1000, weil es keinen Fenster-Horcher gibt.
+
+    Die zehn bestehenden Fälle bleiben unverändert und grün — insbesondere Test 4 (Raster-Konstanten), Test 7 (Compactor-Pin mit preventCollision) und Test 9/9b (Minima).
+  </behavior>
+  <action>
+    1. **`dashboard-grid.test.tsx`** (zuerst, rot): `act` zusätzlich aus `@testing-library/react` importieren, `stubResizeObserver` aus `@/test/fake-resize-observer`. Im bestehenden `afterEach` nach `vi.restoreAllMocks()` eine Zeile `vi.unstubAllGlobals()` ergänzen (ohne sie bliebe der gestubbte Beobachter für alle folgenden Dateien stehen). Am Ende des bestehenden `describe('DashboardGrid', …)` die zwei Fälle aus dem `<behavior>`-Block anfügen, benannt „quick-260922-vdk Test 10: …“ und „quick-260922-vdk Test 11: …“, Stil und Kommentarsprache wie die Nachbarfälle (deutsch, mit dem Warum in einer Zeile). Rot-Lauf ausführen und die Fehlermeldungen für das SUMMARY festhalten.
+
+    2. **`dashboard-grid.tsx`**: `useCallback` zum Import aus `react` hinzufügen. Die bisherige Kombination aus `containerRef` und dem Effekt mit leerer Abhängigkeitsliste ersetzen durch:
+       - zwei Refs: `nodeRef` (Typ `HTMLDivElement | null`, hält den gerade eingehängten Knoten für den Fenster-Horcher) und `observerRef` (Typ `ResizeObserver | null`, hält den laufenden Beobachter);
+       - `applyWidth` als `useCallback` mit leerer Abhängigkeitsliste: nimmt eine Zahl, ruft `setWidth` nur bei endlichem Wert größer 0 auf. React verwirft gleiche Werte selbst, ein zusätzlicher Vergleich ist unnötig und eine Rückkopplungsschleife damit ausgeschlossen (T-VDK-01);
+       - `measureRef` als `useCallback` über `applyWidth`, Signatur nimmt `HTMLDivElement | null` und gibt **nichts** zurück: erst einen eventuell laufenden Beobachter trennen und `observerRef` leeren, dann `nodeRef` auf den Knoten setzen, bei `null` zurückspringen, sonst `applyWidth(node.getBoundingClientRect().width)` (das ist die synchrone Erstmessung in der Commit-Phase), dann einen neuen `ResizeObserver` anlegen, der `entries[0].contentRect.width` an `applyWidth` weitergibt, ihn auf den Knoten setzen und in `observerRef` merken. Wichtig: keine Aufräumfunktion zurückgeben — React 19 ruft den Rückruf sonst beim Aushängen nicht mehr mit `null` auf, und genau dieser Zweig ist hier der Aufräumpfad;
+       - einen `useEffect` über `applyWidth`, der `resize` am `window` anmeldet und im Aufräumschritt wieder abmeldet; der Horcher misst `nodeRef` erneut, wenn dort ein Knoten liegt;
+       - am Raster-`<div>` `ref={measureRef}` setzen (exakt dieser Name, ein Tor prüft ihn).
+
+       Alle vier Hooks stehen **vor** dem frühen Rücksprung in den Leerzustand, damit die Hook-Reihenfolge stabil bleibt — derselbe Grund, den der Kommentar bei `effectiveLayouts` bereits festhält.
+
+    3. **Warum-Kommentar** über der Messung, deutsch, im Stil der vorhandenen Blöcke (`quick-260916-dyv`, `quick-260916-bwo`), Präfix `quick-260922-vdk:`. Inhalt in eigenen Worten: der frühe Rücksprung in den Leerzustand rendert den gemessenen Knoten gar nicht erst, ein Effekt mit leerer Abhängigkeitsliste sieht ihn deshalb nie wieder; der Ref-Rückruf folgt dem Knoten über Aus- und Einhängen hinweg und misst in der Commit-Phase, also vor dem Zeichnen; die Folge der alten Annahme war ein `md`-Breakpoint mit 20 Spalten (strikter Größer-Vergleich in RGL), 51,6 px Spaltenbreite und ein toter Streifen rechts; der Fenster-Horcher ist ein Netz für Fälle, in denen der Beobachter nichts meldet; der Wächter verwirft 0 und nicht endliche Werte, damit eine kurzzeitig zusammengefallene Fläche das Raster nicht auf Null setzt. Den Startwert-Absatz (Entscheidung 5 oben) mit aufnehmen.
+
+    4. Nichts anderes anfassen: Leerzustand, `BREAKPOINTS`, `COLS`, `rowHeight`, `margin`, das fehlende `containerPadding`, `dragConfig`, `resizeConfig`, `FREE_PLACEMENT_COMPACTOR`, `applyConstraintMinima` und die `data-grid`-Erzeugung bleiben wortgleich.
+
+    Commit: `fix(quick-260922-vdk): Dashboard-Raster misst seine Breite auch aus dem Leerzustand heraus` (Wortlaut frei, Stil der Nachbarcommits, Co-Authored-By-Zeile).
+  </action>
+  <verify>
+    <automated>cd /home/vicolab/projects/tessera-ctl && pnpm --filter @tessera/web exec vitest run src/components/dashboard/dashboard-grid.test.tsx && pnpm --filter @tessera/web exec tsc --noEmit && grep -q "ref={measureRef}" apps/web/src/components/dashboard/dashboard-grid.tsx && grep -q "addEventListener('resize'" apps/web/src/components/dashboard/dashboard-grid.tsx && grep -q "unstubAllGlobals" apps/web/src/components/dashboard/dashboard-grid.test.tsx && grep -q "quick-260922-vdk" apps/web/src/components/dashboard/dashboard-grid.tsx</automated>
+  </verify>
+  <done>`dashboard-grid.test.tsx` hat 12 grüne Fälle (10 alte wortgleich, 2 neue); die zwei neuen waren nachweislich zuerst rot, die Rot-Meldungen („1200 statt 1000“ bzw. „1000 statt 1600“) stehen im SUMMARY. `tsc --noEmit` ohne Befund. Die Messung hängt am Ref-Rückruf `measureRef`, trennt den Beobachter im null-Zweig, misst synchron bei jedem Einhängen und hat einen Fenster-Horcher. Compactor, Konstanten, Leerzustand und `applyConstraintMinima` sind unverändert (Tests 4/7/9/9b belegen es). Ein Commit mit Scope `quick-260922-vdk`.</done>
+</task>
+
+<task type="auto">
+  <name>Aufgabe 2: Changelog-Stichpunkt, volle Tore, Zähler, Prüfliste für den Browser-Rundgang</name>
+  <files>CHANGELOG.md</files>
+  <action>
+    1. **`CHANGELOG.md`**: unter „## Unveröffentlicht“ nach der bestehenden Liste „### Geändert“ einen neuen Abschnitt „### Behoben“ anlegen (Reihenfolge wie in 1.3.0: Neu, Geändert, Behoben) mit genau einem Stichpunkt in Alltagssprache, Tonlage der Nachbarzeilen, ohne Fachbegriffe: „Dashboard: war das Dashboard beim Öffnen leer, nutzte die erste hinzugefügte Kachel nur einen Teil der Breite — rechts blieb ein toter Streifen, in den sich keine Kachel ziehen ließ; das Raster misst die verfügbare Breite jetzt in jedem Fall und folgt auch einer Änderung der Fenstergröße“.
+
+    2. **Volle Tore** ausführen und die Zahlen ins SUMMARY schreiben: `pnpm type-check` (4/4), `pnpm lint` (5/5), `pnpm --filter @tessera/web test`. Ausgangsmessung dieses Plans (22.09., vor der Änderung): Web 81 Dateien / 659 Tests grün, Biome web genau 53 Warnungen, `as unknown as` in web 6. Erwartet nachher: 81 Dateien / 661 Tests, Warnungen und Zähler unverändert. Weicht eine Zahl ab, im SUMMARY benennen statt stillschweigend anpassen.
+
+    3. **Prüfliste** für den Orchestrator ins SUMMARY schreiben (Browser, lokal, Playwright-MCP — **nicht** auf dem Testserver), Punkt für Punkt abhakbar; ausdrücklich dazuschreiben, dass Breiten am DOM gemessen werden (`getBoundingClientRect` der Elemente), **nie** per `fetch` aus der Seite heraus:
+       (a) Dashboard eines Benutzers ohne Kacheln öffnen (oder alle Kacheln entfernen und neu laden) → Leerzustand mit Bildmarke;
+       (b) Bearbeiten → „Widget hinzufügen“ → Uhr: die Kachel erscheint, und beim Ziehen reicht der Platzhalter bis an den rechten Rand des Inhaltsbereichs — kein toter Streifen;
+       (c) messen: Breite von `.react-grid-layout` gleicht der Breite des umgebenden Inhaltsbereichs (Abweichung höchstens der Rand von 8 px); vorher lag sie bei 1200 px unabhängig von der Fensterbreite;
+       (d) eine zweite Kachel auf ein belegtes Feld ziehen → sie springt zurück, nichts wird zur Seite geschoben (unverändert gewollt); Größe ziehen stoppt am Nachbarn;
+       (e) Fenster schmaler und wieder breiter ziehen → das Raster folgt, Kacheln bleiben heil;
+       (f) Seite mit vorhandenen Kacheln neu laden → weiterhin richtig (der bisher schon funktionierende Pfad), und beim ersten Zeichnen ist kein Sprung von schmal auf breit zu sehen;
+       (g) letzte Kachel entfernen → Leerzustand erscheint, danach eine neue Kachel hinzufügen → wieder volle Breite (der Beobachter wurde sauber getrennt und neu angehängt).
+
+    Commit: `docs(quick-260922-vdk): Changelog - Dashboard-Raster misst seine Breite auch aus dem Leerzustand` (nur CHANGELOG.md; Akte und STATE macht der Orchestrator; Co-Authored-By-Zeile).
+  </action>
+  <verify>
+    <automated>cd /home/vicolab/projects/tessera-ctl && grep -q 'rechts blieb ein toter Streifen' CHANGELOG.md && awk '/^## Unveröffentlicht/{f=1} /^## 1\.3\.0/{f=0} f&&/^### Behoben/{n++} END{exit !(n==1)}' CHANGELOG.md && pnpm type-check && pnpm lint && pnpm --filter @tessera/web lint 2>&1 | grep -q 'Found 53 warnings' && test "$(grep -rn 'as unknown as' apps/web/src --include=*.ts --include=*.tsx | wc -l)" -eq 6 && pnpm --filter @tessera/web test</automated>
+    <human-check>Am Ende der Aufgabe: der Orchestrator geht die siebenpunktige Prüfliste im Browser durch (lokal, Playwright-MCP). Entscheidend ist Punkt (b)/(c): auf einem beim Öffnen leeren Dashboard füllt die erste Kachel den Inhaltsbereich bis zum rechten Rand, und die gemessene Rasterbreite stimmt mit der Breite des Inhaltsbereichs überein.</human-check>
+  </verify>
+  <done>Der Changelog trägt unter „Unveröffentlicht“ genau einen neuen Abschnitt „### Behoben“ mit dem einen Stichpunkt. `pnpm type-check` 4/4 und `pnpm lint` 5/5 ohne Befund der Stufe `error`, Biome web weiterhin genau 53 Warnungen, `as unknown as` in web weiterhin 6, Web-Tests 81 Dateien / 661 grün. Die siebenpunktige Prüfliste steht im SUMMARY. Insgesamt genau zwei Commits mit Scope `quick-260922-vdk` (`git log --oneline -2`).</done>
+</task>
+
+</tasks>
+
+<threat_model>
+ASVS-Stufe 1, Blockschwelle `high` (jede `high`-Bedrohung MUSS mitigiert sein).
+
+## Vertrauensgrenzen
+
+| Grenze | Beschreibung |
+|---|---|
+| Browser-Layout → React-Zustand | Gemessene Breiten (ResizeObserver, `getBoundingClientRect`, `resize`) werden zu Zustand und steuern die Rastergeometrie; die Werte sind nicht vertrauenswürdig im Sinne von „immer sinnvoll“ (0 während eines Übergangs, nicht endlich bei zusammengefallener Fläche) |
+| Knoten-Lebensdauer → Beobachter-Lebensdauer | Der ResizeObserver hängt an einem Knoten, der beim Wechsel Leerzustand ↔ gefüllt aus- und eingehängt wird |
+| Neue Vertrauensgrenze | Keine. Kein Netzverkehr, keine API, keine Benutzereingabe, keine Persistenz in diesem Plan |
+
+## STRIDE-Register
+
+| ID | Kategorie | Komponente | Schwere | Disposition | Maßnahme |
+|---|---|---|---|---|---|
+| T-VDK-01 | Denial of Service (Rückkopplung Messung → Zustand → Layout → Messung, bis der Tab steht) | `applyWidth` / ResizeObserver-Rückruf in `dashboard-grid.tsx` | medium | mitigate | `applyWidth` ruft `setWidth` nur bei endlichem Wert größer 0; React verwirft gleiche Werte (Object.is) und rendert dann gar nicht neu — der Beobachter meldet nach dem Einschwingen denselben Wert und die Kette endet. Zusätzlich beobachtet der Beobachter den äußeren `<div>`, dessen Breite nicht von der Rastergeometrie abhängt. |
+| T-VDK-02 | Denial of Service (Ressourcenleck: Beobachter oder Fenster-Horcher überleben das Aushängen, bei jedem Wechsel Leerzustand ↔ gefüllt einer mehr) | `measureRef` null-Zweig, `useEffect`-Aufräumschritt | medium | mitigate | Der Ref-Rückruf trennt den laufenden Beobachter als erste Handlung und gibt bewusst **keine** Aufräumfunktion zurück, damit React ihn beim Aushängen mit `null` aufruft; der Fenster-Horcher meldet sich im Aufräumschritt des Effekts ab. Punkt (g) der Prüfliste geht den Wechsel im Browser durch. |
+| T-VDK-03 | Denial of Service (Messung auf einer zusammengefallenen Fläche setzt die Breite auf 0 → Raster unbedienbar, Kacheln unerreichbar) | Synchrone Erstmessung in jsdom-losen Übergängen, `getBoundingClientRect` | low | mitigate | Wächter „größer 0 und endlich“; bleibt eine Messung aus, gilt weiter der letzte gültige Wert statt 0. |
+| T-VDK-04 | Tampering (stille Verhaltensänderung beim Ziehen: ein belegtes Feld würde plötzlich nachgeben) | `FREE_PLACEMENT_COMPACTOR`, `dragConfig`, `resizeConfig` | medium | mitigate | Diese Stellen werden nicht angefasst; Test 7 pinnt den Compactor als echten `noCompactor` plus `preventCollision: true`, Test 6 die Zieh-Konfiguration, Test 4 die Raster-Konstanten — alle laufen im Tor der Aufgabe 1 mit. Prüfliste (d) belegt es zusätzlich im Browser. |
+| T-VDK-05 | Information Disclosure | — | low | accept | Es werden nur Layout-Maße des eigenen Fensters gelesen; nichts verlässt den Browser, nichts wird geloggt oder gespeichert. |
+| T-VDK-06 | Repudiation | — | low | accept | Reine Anzeige-Geometrie ohne Fremdwirkung; kein Audit-Log nötig, ASVS 1 genügt. |
+| T-VDK-SC | Tampering (Lieferkette) | npm-Installationen | high | mitigate | Nicht ausgelöst: KEINE neuen Pakete — `ResizeObserver`, `getBoundingClientRect`, `window`-Ereignisse und `DOMRect` sind Browser-Schnittstellen, `act` und `vi.spyOn` sind bereits vorhanden. Will der Executor doch etwas installieren: Stopp und Rückfrage an den Orchestrator, keine Installation ohne ausdrückliche Freigabe. |
+</threat_model>
+
+<verification>
+Automatisch (Executor, in den `<verify>`-Blöcken): gezielter Testlauf von `dashboard-grid.test.tsx` (12 Fälle), `tsc --noEmit`, Struktur-Tore auf Ref-Rückruf, Fenster-Horcher, `unstubAllGlobals` und den Warum-Kommentar; danach Changelog-Tore, `pnpm type-check` 4/4, `pnpm lint` 5/5, Biome web genau 53 Warnungen, `as unknown as` web 6, voller Web-Testlauf.
+
+Rot-Nachweis (Aufgabe 1): beide neuen Fälle laufen vor der Änderung rot; die Meldungen gehören ins SUMMARY.
+
+Manuell (Orchestrator, Prüfliste aus Aufgabe 2 Punkt 3, lokal im Browser, nicht auf dem Testserver): leeres Dashboard → erste Kachel füllt die Breite; gemessene Rasterbreite gleicht der Breite des Inhaltsbereichs; belegtes Feld bleibt blockiert; Fenstergröße; Neuladen mit Kacheln unverändert; Leerzustand → gefüllt → Leerzustand → gefüllt.
+</verification>
+
+<success_criteria>
+- [ ] Auf einem beim Öffnen leeren Dashboard füllt die erste hinzugefügte Kachel den Inhaltsbereich; rechts kein toter Streifen (Test 10 + Prüfliste b/c)
+- [ ] Die Messung folgt dem Knoten über Aus- und Einhängen und läuft synchron vor dem Zeichnen (Ref-Rückruf `measureRef`, Struktur-Tor + Prüfliste f/g)
+- [ ] Fenstergröße ändern misst neu (Test 11 + Prüfliste e)
+- [ ] Ziehverhalten unverändert: belegtes Feld bleibt blockiert, nichts wird verschoben (Tests 4/6/7/9/9b grün, Prüfliste d)
+- [ ] 12 Fälle in `dashboard-grid.test.tsx`, Web gesamt 81 Dateien / 661 Tests grün
+- [ ] `pnpm type-check` 4/4, `pnpm lint` 5/5, Biome web 53 Warnungen, `as unknown as` web 6
+- [ ] Changelog: genau ein Stichpunkt unter „Unveröffentlicht → Behoben“
+- [ ] Genau zwei Commits mit Scope `quick-260922-vdk`
+- [ ] Nur `apps/web` und `CHANGELOG.md` angefasst; keine neuen Pakete
+</success_criteria>
+
+<output>
+`.planning/quick/260922-vdk-dashboard-raster-misst-seine-breite-nich/260922-vdk-SUMMARY.md` schreiben, wenn beide Aufgaben fertig sind — mit Rot-Meldungen der zwei neuen Tests, den gemessenen Zahlen (Tests, Warnungen, Zähler) und der siebenpunktigen Prüfliste für den Browser-Rundgang.
+</output>

.planning/quick/260922-vdk-dashboard-raster-misst-seine-breite-nich/260922-vdk-SUMMARY.md

@@ -0,0 +1,224 @@
+---
+phase: quick-260922-vdk
+plan: 01
+subsystem: ui
+tags: [react, react-grid-layout, ref-callback, resize-observer, dashboard, vitest]
+
+requires: []
+provides:
+  - "Dashboard-Raster misst seine Breite auch beim Wechsel Leerzustand -> gefuellt (Ref-Rueckruf statt Einmal-Effekt)"
+  - "Fenster-Horcher als Netz zusaetzlich zum ResizeObserver"
+affects: [dashboard-grid, dashboard]
+
+actuals:
+  tokens: 2392
+  tasks: 2
+  commits: 2
+
+tech-stack:
+  added: []
+  patterns:
+    - "Ref-Rueckruf (callback ref) statt useEffect mit leerer Abhaengigkeitsliste, wenn eine Messung den tatsaechlich eingehaengten Knoten ueber Aus-/Einhaengen hinweg verfolgen muss"
+
+key-files:
+  created: []
+  modified:
+    - apps/web/src/components/dashboard/dashboard-grid.tsx
+    - apps/web/src/components/dashboard/dashboard-grid.test.tsx
+    - CHANGELOG.md
+
+key-decisions:
+  - "Ref-Rueckruf measureRef ersetzt containerRef + Einmal-Effekt; misst synchron in der Commit-Phase, kein useLayoutEffect noetig"
+  - "Kein Aufraeum-Rueckgabewert aus measureRef, damit React 19 den Rueckruf beim Aushaengen mit null aufruft (das ist der Aufraeumpfad)"
+  - "Fenster-Horcher zusaetzlich zum ResizeObserver, nicht als Ersatz"
+  - "Startwert bleibt 1200 (nur bis zur ersten Commit-Phase relevant)"
+  - "FREE_PLACEMENT_COMPACTOR/preventCollision, BREAKPOINTS, COLS, rowHeight, margin, applyConstraintMinima unveraendert"
+
+patterns-established:
+  - "quick-260922-vdk Kommentarblock in dashboard-grid.tsx erklaert das Warum der Ref-Rueckruf-Messung"
+
+requirements-completed: [QUICK-260922-VDK]
+
+coverage:
+  - id: D1
+    description: "Dashboard-Raster misst seine Breite auch aus dem Leerzustand heraus (Ref-Rueckruf, synchrone Erstmessung, Fenster-Horcher)"
+    requirement: "QUICK-260922-VDK"
+    verification:
+      - kind: unit
+        ref: "apps/web/src/components/dashboard/dashboard-grid.test.tsx#quick-260922-vdk Test 10: Leerzustand -> gefuellt misst die tatsaechliche Breite statt beim Startwert 1200 stehenzubleiben"
+        status: pass
+      - kind: unit
+        ref: "apps/web/src/components/dashboard/dashboard-grid.test.tsx#quick-260922-vdk Test 11: Fenstergroesse aendert sich -> der Fenster-Horcher misst neu"
+        status: pass
+    human_judgment: true
+    rationale: "Die Unit-Tests beweisen die gemessene Breite in jsdom; ob im echten Browser rechts kein toter Streifen mehr bleibt und die Rasterbreite sichtbar der Breite des Inhaltsbereichs entspricht, verlangt einen Browser-Rundgang (Prueflliste unten)."
+  - id: D2
+    description: "Ziehverhalten unveraendert: belegtes Feld bleibt blockiert, nichts wird zur Seite geschoben"
+    verification:
+      - kind: unit
+        ref: "apps/web/src/components/dashboard/dashboard-grid.test.tsx#quick-260916-dyv Test 7: Compactor-Pin"
+        status: pass
+      - kind: unit
+        ref: "apps/web/src/components/dashboard/dashboard-grid.test.tsx#quick-260916-dyv Test 6: dragConfig-Pin"
+        status: pass
+    human_judgment: false
+
+duration: ~9min
+completed: 2026-09-22
+status: complete
+---
+
+# Quick-Aufgabe 260922-vdk: Dashboard-Raster misst seine Breite auch aus dem Leerzustand heraus Summary
+
+**Messung an einem Ref-Rueckruf (`measureRef`) statt an einem Einmal-Effekt: der Beobachter folgt dem eingehaengten `<div>` ueber Leerzustand <-> gefuellt hinweg, misst synchron in der Commit-Phase, plus Fenster-Horcher als Netz — 20-Spalten/`md`-Fehlmessung nach 1200 px behoben.**
+
+## Performance
+
+- **Duration:** ~9 min
+- **Completed:** 2026-09-22
+- **Tasks:** 2/2
+- **Files modified:** 3
+
+## Accomplishments
+- Dashboard-Raster misst jetzt in jedem Fall die tatsaechliche Breite des Inhaltsbereichs, auch wenn `DashboardGrid` mit null Kacheln einhaengt und die erste Kachel erst spaeter erscheint
+- Fenster-Horcher als Sicherheitsnetz zusaetzlich zum ResizeObserver
+- Zwei neue Regressionstests, nachweislich zuerst rot
+- Ziehverhalten (`FREE_PLACEMENT_COMPACTOR` mit `preventCollision`), Raster-Konstanten und Leerzustand unveraendert (per Test 4/6/7/9/9b bestaetigt)
+
+## Task Commits
+
+Each task was committed atomically:
+
+1. **Aufgabe 1: Messung an den Knoten haengen (Ref-Rueckruf, synchrone Erstmessung, Fenster-Horcher)** - `d9f2af3` (fix)
+2. **Aufgabe 2: Changelog-Stichpunkt, volle Tore, Zaehler, Pruefliste** - `cf67c8a` (docs)
+
+_Ledger: `plan_head_before` = `3e8c0f4` (letzter Commit vor diesem Plan — die bereits committete Akte). `git rev-list --count 3e8c0f4..HEAD` = 2, deckt sich mit den zwei oben genannten Commits._
+
+**Plan metadata:** wird vom Orchestrator nach diesem SUMMARY committet (STATE.md/ROADMAP.md ausserhalb dieses Plans).
+
+## Rot-Nachweis (Aufgabe 1, vor der Aenderung)
+
+Testlauf vor dem Umbau von `dashboard-grid.tsx` (nur die Test-Datei war schon geaendert):
+
+```
+FAIL src/components/dashboard/dashboard-grid.test.tsx > DashboardGrid > quick-260922-vdk Test 10: ...
+AssertionError: expected 1200 to be 1000 // Object.is equality
+
+FAIL src/components/dashboard/dashboard-grid.test.tsx > DashboardGrid > quick-260922-vdk Test 11: ...
+AssertionError: expected 1000 to be 1600 // Object.is equality
+```
+
+10 von 12 Faellen gruen, genau die zwei neuen rot — wie erwartet: Test 10 blieb beim Startwert 1200 (der frueh zurueckspringende Leerzustand rendert den gemessenen Knoten nie, der Effekt mit leerer Abhaengigkeitsliste sieht ihn also nie), Test 11 blieb bei 1000, weil es vorher keinen Fenster-Horcher gab.
+
+Nach dem Umbau: alle 12 Faelle gruen (`pnpm --filter @tessera/web exec vitest run src/components/dashboard/dashboard-grid.test.tsx`).
+
+## Gemessene Zahlen (nachher, alle Tore)
+
+| Tor | Ausgangsmessung (22.09., vor der Aenderung) | Nachher (gemessen) |
+|---|---|---|
+| `dashboard-grid.test.tsx` | 10 Faelle | 12 Faelle, alle gruen |
+| Web Tests gesamt | 81 Dateien / 659 Tests | 81 Dateien / 661 Tests, alle gruen |
+| `pnpm type-check` | — | 4/4 ohne Befund |
+| `pnpm lint` | — | 5/5 ohne Befund der Stufe `error` |
+| Biome web Warnungen | 53 | 53 (unveraendert) |
+| `as unknown as` in web | 6 | 6 (unveraendert) |
+
+Keine Abweichung — alle erwarteten Zahlen aus dem Plan treffen exakt zu.
+
+## Files Created/Modified
+- `apps/web/src/components/dashboard/dashboard-grid.tsx` - `measureRef`-Ref-Rueckruf ersetzt `containerRef` + Einmal-Effekt; `applyWidth`-Wächter (verwirft 0/nicht-endliche Werte); Fenster-Horcher (`resize`-Listener); deutscher Warum-Kommentarblock `quick-260922-vdk`
+- `apps/web/src/components/dashboard/dashboard-grid.test.tsx` - zwei neue Faelle (Test 10: Leerzustand -> gefuellt misst 1000; Test 11: resize-Ereignis misst 1600), `stubResizeObserver`-Import, `vi.unstubAllGlobals()` im `afterEach`
+- `CHANGELOG.md` - neuer Abschnitt „### Behoben" unter „## Unveroeffentlicht" mit einem Stichpunkt
+
+## Decisions Made
+Keine neuen Entscheidungen — die im Plan gebundenen Entscheidungen (Ref-Rueckruf statt Einmal-Effekt, synchron vor dem ersten Zeichnen, Fenster-Horcher als Netz, Ziehverhalten unveraendert, Startwert 1200 bleibt, nur `apps/web`) wurden wortgleich umgesetzt.
+
+## Deviations from Plan
+
+None - plan executed exactly as written.
+
+## Issues Encountered
+None.
+
+## Pruefliste fuer den Browser-Rundgang (Orchestrator, lokal, Playwright-MCP, nicht Testserver)
+
+Breiten werden am DOM gemessen (`getBoundingClientRect` der Elemente), **nie** per `fetch` aus der Seite heraus — das taeuscht in beide Richtungen.
+
+- [ ] (a) Dashboard eines Benutzers ohne Kacheln oeffnen (oder alle Kacheln entfernen und neu laden) -> Leerzustand mit Bildmarke erscheint
+- [ ] (b) Bearbeiten -> „Widget hinzufuegen" -> Uhr: die Kachel erscheint, und beim Ziehen reicht der Platzhalter bis an den rechten Rand des Inhaltsbereichs — kein toter Streifen
+- [ ] (c) messen: Breite von `.react-grid-layout` gleicht der Breite des umgebenden Inhaltsbereichs (Abweichung hoechstens der Rand von 8 px); vorher lag sie bei 1200 px unabhaengig von der Fensterbreite
+- [ ] (d) eine zweite Kachel auf ein belegtes Feld ziehen -> sie springt zurueck, nichts wird zur Seite geschoben (unveraendert gewollt); Groesse ziehen stoppt am Nachbarn
+- [ ] (e) Fenster schmaler und wieder breiter ziehen -> das Raster folgt, Kacheln bleiben heil
+- [ ] (f) Seite mit vorhandenen Kacheln neu laden -> weiterhin richtig (der bisher schon funktionierende Pfad), und beim ersten Zeichnen ist kein Sprung von schmal auf breit zu sehen
+- [ ] (g) letzte Kachel entfernen -> Leerzustand erscheint, danach eine neue Kachel hinzufuegen -> wieder volle Breite (der Beobachter wurde sauber getrennt und neu angehaengt)
+
+Entscheidend: Punkt (b)/(c) — auf einem beim Oeffnen leeren Dashboard fuellt die erste Kachel den Inhaltsbereich bis zum rechten Rand, und die gemessene Rasterbreite stimmt mit der Breite des Inhaltsbereichs ueberein.
+
+## Threat Flags
+
+Keine neue Vertrauensgrenze, keine neuen Pakete. Alle sechs T-VDK-Punkte aus dem Plan-Threat-Model sind mit Tests bzw. Struktur-Toren abgedeckt (siehe Rot-Nachweis und gemessene Zahlen oben); nichts Neues gefunden.
+
+## Next Phase Readiness
+Kein laufender Meilenstein, keine Folge-Phase direkt abhaengig. Naechster Schritt laut STATE.md bleibt: Widget-Modul-Kopplung (`WIDGET_MODULE_MAP`) und danach das Proxmox-Modul — unabhaengig von dieser Quick-Aufgabe.
+
+## Self-Check: PASSED
+
+- FOUND: apps/web/src/components/dashboard/dashboard-grid.tsx
+- FOUND: apps/web/src/components/dashboard/dashboard-grid.test.tsx
+- FOUND: CHANGELOG.md
+- FOUND: .planning/quick/260922-vdk-dashboard-raster-misst-seine-breite-nich/260922-vdk-SUMMARY.md
+- FOUND commit: d9f2af3
+- FOUND commit: cf67c8a
+
+---
+*Phase: quick-260922-vdk*
+*Completed: 2026-09-22*
+
+## Rundgang durch den Orchestrator (22.09.2026, echter Linux-Client, nicht der Browser)
+
+Der Nutzer hat den Fehler im **Linux-Client** gemeldet und ausdruecklich gesagt, ein
+Browser-Test bringe nichts. Geprueft wurde deshalb im echten Paket: `Tessera-1.3.0.AppImage`
+aus dem Gitea-Release, auf dem Entwicklungsrechner gestartet (`DISPLAY=:10`,
+`WEBKIT_INSPECTOR_HTTP_SERVER=127.0.0.1:9230`), gesteuert ueber den WebKit-Remote-Inspektor
+(Treiber `scratchpad/wk.mjs`, Target-Protokoll: `Target.sendMessageToTarget` +
+`Runtime.evaluate`). Server: lokaler Stack.
+
+**Ausgangsmessung VOR dem Fix** (gleiche Sitzung, gleicher Client):
+
+| Weg | Bereich | Kachel | Rasterbreite laut Rechnung |
+|-----|---------|--------|----------------------------|
+| Neuladen MIT Kachel | 1176 px | 459 px | 1176 px — richtig |
+| Seitenleiste auf/zu | 1000 ↔ 1176 px | folgt | richtig |
+| **Leeres Dashboard, dann Kachel hinzufuegen** | 1000 px | **469 px** | **1200 px — falsch** |
+
+Der dritte Weg ist der Fehlerfall: `DashboardGrid` haengt mit null Kacheln ein, der
+gemessene `<div>` existiert nicht, der Einmal-Effekt bricht ab und laeuft nie wieder.
+
+**Nach dem Fix, derselbe Weg** (Kachel entfernt, gespeichert, neu geladen -> leeres
+Dashboard -> Kalender hinzugefuegt):
+
+- `width`-Eigenschaft an `Responsive`: **1000** (= echte Bereichsbreite), Breakpoint `md`,
+  20 Spalten — aus dem React-Fiber ausgelesen, nicht geraten.
+- Kachel `style.width`: **389 px** = `8 × 41,6 + 56`, exakt der Sollwert fuer 1000 px.
+- Ziehen nach rechts (synthetische Maus-Ereignisse, jeweils mit Wartezeit, damit React
+  dazwischen rendert): Platzhalter laeuft 8 → 107 → 256 → 405 → 554 → **603** und bleibt
+  dort. `1000 − 8 − 389 = 603` — **der Platzhalter erreicht jetzt exakt den rechten Rand**.
+  Die Kachel wird auch dort abgelegt (`tileX 603`).
+
+**Messfalle, dokumentiert damit sie niemanden noch einmal kostet:** `getBoundingClientRect()`
+und `getComputedStyle().width` lieferten im Client weiter 469 px, obwohl `style.width`
+bereits 389 px war. Grund: `.react-grid-item` hat `transition: width .2s`, und das
+Client-Fenster lag im Hintergrund — WebKitGTK friert die Animationsuhr dann ein, der
+Uebergang bleibt auf dem Startwert stehen (`getAnimations()` meldete eine laufende
+`CSSTransition` auf `width`). **Im Client gegen die gesetzten Werte messen
+(`style.width`, `style.transform`) oder gegen die React-Eigenschaften, nie gegen die
+gemalte Box** — sonst misst man die eingefrorene Animation statt des Ergebnisses.
+
+**Nicht angefasst, wie zugesagt:** belegte Plaetze bleiben gesperrt, nichts weicht aus
+(`FREE_PLACEMENT_COMPACTOR` mit `preventCollision` unveraendert) — ausdrueckliche Ansage des
+Nutzers am 22.09.
+
+**Testreste der Pruefung:** lokaler Testbenutzer `clienttest` und die zeitweise auf
+`NODE_ENV=development` gesetzte lokale API (WebKitGTK nimmt `secure`-Kekse ueber `http` nicht
+an, Chromium macht fuer `localhost` eine Ausnahme) — beides nach der Pruefung wieder
+zurueckgebaut.

CHANGELOG.md

@@ -4,9 +4,16 @@ Diese Liste beschreibt in einfachen Worten, was sich von Version zu Version an T
 
 ## Unveröffentlicht
 
+## 1.3.1 – 2026-09-23
+
 ### Geändert
 
 - Bilderrahmen: hochgeladene Bilder liegen jetzt im Dateibereich des Servers statt in der Datenbank — die Datenbanksicherung bleibt dadurch klein; vorhandene Bilder ziehen beim ersten Start automatisch um
+- Dashboard: Kacheln, die zu einem Modul gehören, erscheinen nur noch für Benutzer, die dieses Modul nutzen dürfen; eine nicht mehr freigegebene Kachel erklärt das jetzt, statt leer zu bleiben
+
+### Behoben
+
+- Dashboard: war das Dashboard beim Öffnen leer, nutzte die erste hinzugefügte Kachel nur einen Teil der Breite — rechts blieb ein toter Streifen, in den sich keine Kachel ziehen ließ; das Raster misst die verfügbare Breite jetzt in jedem Fall und folgt auch einer Änderung der Fenstergröße
 
 ## 1.3.0 – 2026-09-22
 

apps/api/src/dashboard/dto/create-widget.dto.ts

@@ -1,24 +1,20 @@
 import { IsIn, IsObject, IsOptional, IsString } from 'class-validator';
+import { WIDGET_TYPES } from '@tessera/shared';
 
 /**
  * DTO for creating a new widget instance on a user's dashboard.
- * widgetType must be one of the nine supported types
+ *
- * ('picture-frame' seit quick-260921-pi9, 'xframe' seit quick-260921-qd3).
+ * quick-260922-m1h: `widgetType` wird gegen `WIDGET_TYPES` aus
+ * `@tessera/shared` geprüft — dieselbe Liste, aus der das Frontend seine
+ * Registry und seinen Katalog ableitet. Vorher stand die Liste hier ein
+ * zweites Mal; vergaß man einen Eintrag, lehnte die API eine im Katalog
+ * angebotene Kachel mit 400 ab.
+ *
  * config is optional and defaults to {} on the model.
  */
 export class CreateWidgetDto {
   @IsString()
-  @IsIn([
+  @IsIn([...WIDGET_TYPES])
-    'clock',
-    'search',
-    'calendar',
-    'note',
-    'calculator',
-    'favorites',
-    'stopwatch',
-    'picture-frame',
-    'xframe',
-  ])
   widgetType!: string;
 
   @IsOptional()

apps/api/src/dashboard/widget-module-map.spec.ts

@@ -0,0 +1,58 @@
+import { describe, expect, it } from 'vitest';
+import { plainToInstance } from 'class-transformer';
+import { validate } from 'class-validator';
+import { WIDGET_MODULE_SLUGS, WIDGET_TYPES } from '@tessera/shared';
+import { CreateWidgetDto } from './dto/create-widget.dto';
+import { WIDGET_MODULE_MAP, getModuleSlugForWidgetType } from './widget-module-map';
+
+/**
+ * quick-260922-m1h: Web und API lesen dieselbe Tabelle. Liefen sie
+ * auseinander, wuerde der Katalog eine Kachel anbieten, die der Server
+ * danach wieder herausfiltert (oder umgekehrt).
+ */
+describe('widget-module-map (quick-260922-m1h)', () => {
+  it('WIDGET_MODULE_MAP ist die Tabelle aus @tessera/shared, keine zweite Kopie', () => {
+    expect(WIDGET_MODULE_MAP).toBe(WIDGET_MODULE_SLUGS);
+  });
+
+  it('jeder Schluessel der Tabelle ist ein bekannter Widget-Typ', () => {
+    for (const type of Object.keys(WIDGET_MODULE_MAP)) {
+      expect(WIDGET_TYPES).toContain(type);
+    }
+  });
+
+  it('die neun heutigen Kacheln sind Plattform-Kacheln ohne Modulbezug', () => {
+    for (const type of WIDGET_TYPES) {
+      expect(getModuleSlugForWidgetType(type)).toBeUndefined();
+    }
+  });
+
+  it('ein unbekannter Typ liefert undefined statt zu werfen', () => {
+    expect(getModuleSlugForWidgetType('gibt-es-nicht')).toBeUndefined();
+  });
+});
+
+/**
+ * Der Kern des Umbaus: die `@IsIn`-Whitelist ist keine handgepflegte zweite
+ * Liste mehr. Vergisst kuenftig jemand einen Eintrag in `packages/shared`,
+ * schlaegt dieser Test fehl, statt die API eine gueltige Kachel mit 400
+ * ablehnen zu lassen.
+ */
+describe('CreateWidgetDto-Whitelist (quick-260922-m1h)', () => {
+  async function validateType(widgetType: string) {
+    const dto = plainToInstance(CreateWidgetDto, { widgetType });
+    return validate(dto);
+  }
+
+  it.each([...WIDGET_TYPES])('akzeptiert den Typ "%s"', async (widgetType) => {
+    await expect(validateType(widgetType)).resolves.toEqual([]);
+  });
+
+  it('lehnt einen Typ ab, der nicht in WIDGET_TYPES steht', async () => {
+    const errors = await validateType('gibt-es-nicht');
+
+    expect(errors).toHaveLength(1);
+    expect(errors[0].property).toBe('widgetType');
+    expect(errors[0].constraints).toHaveProperty('isIn');
+  });
+});

apps/api/src/dashboard/widget-module-map.ts

@@ -1,3 +1,5 @@
+import { WIDGET_MODULE_SLUGS } from '@tessera/shared';
+
 /**
  * Zuordnung Widget-Typ → Modul (D-22, PERM-07).
  *
@@ -8,24 +10,29 @@
  * Schlüssel sind Werte von `WidgetInstance.widgetType`, Werte sind
  * Modul-Slugs aus `Module.slug`.
  *
+ * quick-260922-m1h: Die Tabelle selbst steht seit diesem Umbau in
+ * `packages/shared/src/index.ts` als `WIDGET_MODULE_SLUGS` — EINE Tabelle
+ * für beide Seiten, damit der Katalogfilter im Web
+ * (`visibleWidgetTypes`, Komfort) und dieser Server-Filter (verbindlich)
+ * nicht auseinanderlaufen. Hier steht nur noch der Lesezugriff; die
+ * öffentliche Schnittstelle dieser Datei bleibt unverändert, weil
+ * dashboard.service.spec.ts sie gezielt mockt.
+ *
  * Bewusst eine TypeScript-Konstante statt einer Spalte auf
  * `WidgetInstance`: eine Migration auf einer bereits befüllten Tabelle
  * für ein Feld, das derzeit für jede Zeile leer wäre, wiegt schwerer als
  * diese Konstante mit identischer Aussagekraft (15-RESEARCH.md Pitfall 5).
  *
- * Die Tabelle ist am Ende dieser Phase bewusst leer: alle sieben heute
+ * Die Tabelle ist bewusst leer: alle neun registrierten Widget-Typen
- * registrierten Widget-Typen (clock/search/calendar/note/calculator/
+ * (clock/search/calendar/note/calculator/favorites/stopwatch/
- * favorites/stopwatch, siehe apps/web/src/components/dashboard/
+ * picture-frame/xframe) sind Plattform-Widgets ohne Modulbezug. Die erste
- * widget-registry.tsx) sind Plattform-Widgets ohne Modulbezug. Das
+ * modulgebundene Kachel trägt ihren Slug in `WIDGET_MODULE_SLUGS` ein.
- * einzige bislang geplante modulgebundene Widget steht in
- * .planning/REQUIREMENTS.md unter "Future Requirements (deferred)" und
- * wird in dieser Phase bewusst nicht registriert.
  */
-export const WIDGET_MODULE_MAP: Readonly<Record<string, string>> = {};
+export const WIDGET_MODULE_MAP: Readonly<Record<string, string>> = WIDGET_MODULE_SLUGS;
 
 /**
  * Liefert den Modul-Slug für einen Widget-Typ, oder `undefined`, wenn
- * der Typ kein Modul-Widget ist (der heutige Zustand für alle sieben
+ * der Typ kein Modul-Widget ist (der heutige Zustand für alle neun
  * bestehenden Typen). Einziger Lesezugriff auf die Zuordnungstabelle,
  * damit Tests sie gezielt mocken können.
  */

apps/web/package.json

@@ -11,6 +11,7 @@
     "lint": "biome lint ."
   },
   "dependencies": {
+    "@tessera/shared": "workspace:*",
     "@uiw/react-md-editor": "4.1.1",
     "fflate": "^0.8.3",
     "html-to-image": "1.11.13",

apps/web/src/app/(portal)/page.test.tsx

@@ -1,4 +1,4 @@
-import { cleanup, fireEvent, render, screen } from '@testing-library/react';
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
 // quick-260916-dyv: Dashboard-Seite — feste Aktionsleiste unten rechts
@@ -47,8 +47,16 @@ vi.mock('@/components/dashboard/dashboard-grid', () => ({
   ),
 }));
 
+// quick-260922-m1h: Der Katalog bekommt die zugaenglichen Modul-Slugs als
+// Prop von dieser Seite — die Attrappe merkt sie sich, damit der Test sie
+// pruefen kann, ohne den echten Dialog zu rendern.
+const catalogProps: { accessibleModuleSlugs?: readonly string[] | null } = {};
+
 vi.mock('@/components/dashboard/widget-catalog-modal', () => ({
-  WidgetCatalogModal: () => null,
+  WidgetCatalogModal: (p: { accessibleModuleSlugs: readonly string[] | null }) => {
+    catalogProps.accessibleModuleSlugs = p.accessibleModuleSlugs;
+    return null;
+  },
 }));
 
 vi.mock('@/components/dashboard/widgets/clock-widget', () => ({ ClockWidget: () => null }));
@@ -62,6 +70,17 @@ vi.mock('@/components/dashboard/widgets/picture-frame-widget', () => ({ PictureF
 vi.mock('@/components/dashboard/widgets/xframe-widget', () => ({ XframeWidget: () => null }));
 
 beforeEach(() => {
+  catalogProps.accessibleModuleSlugs = undefined;
+  vi.stubGlobal(
+    'fetch',
+    vi.fn(async () => ({
+      ok: true,
+      json: async () => [
+        { id: 'm1', slug: 'domaincheck', name: 'Domaincheck', category: 'tools' },
+        { id: 'm2', slug: 'tender-radar', name: 'Tender', category: 'tools' },
+      ],
+    })),
+  );
   mockStore.isEditMode = false;
   mockStore.isLoading = false;
   mockStore.error = null;
@@ -71,6 +90,7 @@ beforeEach(() => {
 
 afterEach(() => {
   cleanup();
+  vi.unstubAllGlobals();
 });
 
 describe('DashboardPage (quick-260916-dyv)', () => {
@@ -117,3 +137,35 @@ describe('DashboardPage (quick-260916-dyv)', () => {
     expect(mockStore.setEditMode).toHaveBeenCalledWith(true);
   });
 });
+
+describe('DashboardPage: zugaengliche Module fuer den Katalog (quick-260922-m1h)', () => {
+  it('Test 4: holt GET /modules/active mit Sitzungs-Keks und reicht die Slugs an den Katalog durch', async () => {
+    const { default: DashboardPage } = await import('./page');
+    render(<DashboardPage />);
+
+    await waitFor(() => {
+      expect(catalogProps.accessibleModuleSlugs).toEqual(['domaincheck', 'tender-radar']);
+    });
+
+    const call = vi.mocked(fetch).mock.calls[0];
+    expect(String(call[0])).toContain('/modules/active');
+    expect(call[1]).toMatchObject({ credentials: 'include' });
+  });
+
+  it('Test 5: fail-closed — schlaegt der Abruf fehl, bleibt die Liste unbekannt (null)', async () => {
+    vi.stubGlobal(
+      'fetch',
+      vi.fn(async () => {
+        throw new Error('Netzwerk weg');
+      }),
+    );
+
+    const { default: DashboardPage } = await import('./page');
+    render(<DashboardPage />);
+
+    await waitFor(() => {
+      expect(vi.mocked(fetch)).toHaveBeenCalled();
+    });
+    expect(catalogProps.accessibleModuleSlugs).toBeNull();
+  });
+});

apps/web/src/app/(portal)/page.tsx

@@ -1,11 +1,11 @@
 'use client';
 
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { useTranslations } from 'next-intl';
 import { DashboardGrid } from '@/components/dashboard/dashboard-grid';
 import { EditModeToggle } from '@/components/dashboard/edit-mode-toggle';
 import { WidgetCatalogModal } from '@/components/dashboard/widget-catalog-modal';
-import { wireClockWidget, wireSearchWidget, wireCalendarWidget, wireNoteWidget, wireCalculatorWidget, wireStopwatchWidget, wireFavoritesWidget, wirePictureFrameWidget, wireXframeWidget } from '@/components/dashboard/widget-registry';
+import { registerWidget } from '@/components/dashboard/widget-registry';
 import { ClockWidget } from '@/components/dashboard/widgets/clock-widget';
 import { SearchWidget } from '@/components/dashboard/widgets/search-widget';
 import { CalendarWidget } from '@/components/dashboard/widgets/calendar-widget';
@@ -18,20 +18,34 @@ import { XframeWidget } from '@/components/dashboard/widgets/xframe-widget';
 import { useDashboardStore } from '@/lib/stores/dashboard-store';
 import type { WidgetType } from '@/components/dashboard/widget-registry';
 
-// Wire widget components into the registry (deferred to avoid circular deps)
+const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3001';
-wireClockWidget(ClockWidget);
+
-wireSearchWidget(SearchWidget);
+// Anmeldung der Kachel-Komponenten an der Registry. Steht hier und nicht in
-wireCalendarWidget(CalendarWidget);
+// der Registry selbst, weil die Komponenten ueber den Wrapper wieder die
-wireNoteWidget(NoteWidget);
+// Registry importieren — ein Import aus der Registry heraus waere ein
-wireCalculatorWidget(CalculatorWidget);
+// Zirkelimport. Seit quick-260922-m1h EINE Funktion statt neun `wireXWidget`.
-wireStopwatchWidget(StopwatchWidget);
+registerWidget('clock', ClockWidget);
-wireFavoritesWidget(FavoritesWidget);
+registerWidget('search', SearchWidget);
-wirePictureFrameWidget(PictureFrameWidget);
+registerWidget('calendar', CalendarWidget);
-wireXframeWidget(XframeWidget);
+registerWidget('note', NoteWidget);
+registerWidget('calculator', CalculatorWidget);
+registerWidget('stopwatch', StopwatchWidget);
+registerWidget('favorites', FavoritesWidget);
+registerWidget('picture-frame', PictureFrameWidget);
+registerWidget('xframe', XframeWidget);
+
+/** Modul-Eintrag aus `GET /modules/active` — hier zaehlt nur der Slug. */
+interface ActiveModule {
+  slug: string;
+}
 
 export default function DashboardPage() {
   const t = useTranslations('widgets');
   const [catalogOpen, setCatalogOpen] = useState(false);
+  // quick-260922-m1h: Slugs der Module, die dieser Benutzer nutzen darf —
+  // der Katalog blendet Kacheln gesperrter Module damit aus. `null` heisst
+  // "noch unbekannt oder Abruf fehlgeschlagen" und ist fail-closed.
+  const [accessibleModuleSlugs, setAccessibleModuleSlugs] = useState<string[] | null>(null);
 
   const {
     layouts,
@@ -51,6 +65,28 @@ export default function DashboardPage() {
     loadDashboard();
   }, [loadDashboard]);
 
+  // Zugaengliche Module holen — gleiches Muster wie die Seitenleiste
+  // (`components/layout/sidebar.tsx`): derselbe Endpunkt, derselbe
+  // Sitzungs-Keks, Fehler still. Der Abruf steht hier und nicht im Dialog,
+  // damit der Dialog ein reines Anzeige-Bauteil bleibt.
+  const fetchAccessibleModules = useCallback(async () => {
+    try {
+      const res = await fetch(`${API_URL}/modules/active`, {
+        credentials: 'include',
+      });
+      if (!res.ok) return;
+      const modules: ActiveModule[] = await res.json();
+      setAccessibleModuleSlugs(modules.map((m) => m.slug));
+    } catch {
+      // still: die Liste bleibt null, der Katalog zeigt dann nur
+      // Plattform-Kacheln (fail-closed).
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchAccessibleModules();
+  }, [fetchAccessibleModules]);
+
   if (isLoading) {
     return (
       <div className="flex min-h-[60vh] items-center justify-center">
@@ -117,6 +153,7 @@ export default function DashboardPage() {
       <WidgetCatalogModal
         isOpen={catalogOpen}
         onClose={() => setCatalogOpen(false)}
+        accessibleModuleSlugs={accessibleModuleSlugs}
         onAddWidget={(type: WidgetType) => {
           addWidget(type);
         }}

apps/web/src/components/dashboard/dashboard-grid.test.tsx

@@ -1,6 +1,7 @@
 import { Children, isValidElement } from 'react';
-import { cleanup, render, screen } from '@testing-library/react';
+import { act, cleanup, render, screen } from '@testing-library/react';
 import { afterEach, describe, expect, it, vi } from 'vitest';
+import { stubResizeObserver } from '@/test/fake-resize-observer';
 
 // Mock CSS imports that vitest cannot resolve
 vi.mock('react-grid-layout/css/styles.css', () => ({}));
@@ -84,6 +85,10 @@ vi.mock('@/lib/stores/dashboard-store', () => ({
 afterEach(() => {
   cleanup();
   vi.restoreAllMocks();
+  // quick-260922-vdk: stubResizeObserver ersetzt den globalen ResizeObserver
+  // per vi.stubGlobal — vi.restoreAllMocks() setzt das nicht zurueck, ohne
+  // diese Zeile bliebe der gestubbte Beobachter fuer alle folgenden Dateien stehen.
+  vi.unstubAllGlobals();
 });
 
 describe('DashboardGrid', () => {
@@ -387,4 +392,64 @@ describe('DashboardGrid', () => {
     expect(screen.queryByTitle('Drag the tile to move it')).toBeNull();
     expect(document.querySelector('.widget-drag-handle')).toBeNull();
   });
+
+  it('quick-260922-vdk Test 10: Leerzustand -> gefuellt misst die tatsaechliche Breite statt beim Startwert 1200 stehenzubleiben', async () => {
+    stubResizeObserver({ width: 1000, height: 800 });
+    captured.props = null;
+    const { DashboardGrid } = await import('./dashboard-grid');
+
+    const { rerender } = render(
+      <DashboardGrid
+        layouts={{ lg: [], md: [], sm: [], xs: [], xxs: [] }}
+        widgets={[]}
+        isEditMode={false}
+        onLayoutChange={vi.fn()}
+        onRemoveWidget={vi.fn()}
+      />,
+    );
+
+    // Leerzustand: der gemessene Knoten ist gar nicht eingehaengt.
+    expect(screen.getByText('No active widgets')).toBeInTheDocument();
+    expect(captured.props).toBeNull();
+
+    // Erste Kachel erscheint -> der Raster-<div> wird eingehaengt -> measureRef
+    // misst synchron vor dem Zeichnen. Vor der Aenderung bleibt width bei 1200.
+    rerender(
+      <DashboardGrid
+        layouts={{ lg: [{ i: 'inst-1', x: 0, y: 0, w: 2, h: 2 }], md: [], sm: [], xs: [], xxs: [] }}
+        widgets={[{ id: 'inst-1', widgetType: 'clock', config: {} }]}
+        isEditMode={false}
+        onLayoutChange={vi.fn()}
+        onRemoveWidget={vi.fn()}
+      />,
+    );
+
+    expect(captured.props?.width).toBe(1000);
+  });
+
+  it('quick-260922-vdk Test 11: Fenstergroesse aendert sich -> der Fenster-Horcher misst neu', async () => {
+    stubResizeObserver({ width: 1000, height: 800 });
+    captured.props = null;
+    const { DashboardGrid } = await import('./dashboard-grid');
+
+    render(
+      <DashboardGrid
+        layouts={{ lg: [{ i: 'inst-1', x: 0, y: 0, w: 2, h: 2 }], md: [], sm: [], xs: [], xxs: [] }}
+        widgets={[{ id: 'inst-1', widgetType: 'clock', config: {} }]}
+        isEditMode={false}
+        onLayoutChange={vi.fn()}
+        onRemoveWidget={vi.fn()}
+      />,
+    );
+
+    expect(captured.props?.width).toBe(1000);
+
+    vi.spyOn(Element.prototype, 'getBoundingClientRect').mockReturnValue(new DOMRect(0, 0, 1600, 800));
+    act(() => {
+      window.dispatchEvent(new Event('resize'));
+    });
+
+    // Vor der Aenderung gibt es keinen Fenster-Horcher: width bliebe bei 1000.
+    expect(captured.props?.width).toBe(1600);
+  });
 });

apps/web/src/components/dashboard/dashboard-grid.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Responsive, noCompactor } from 'react-grid-layout';
 import type { Compactor, ResponsiveLayouts } from 'react-grid-layout';
 import 'react-grid-layout/css/styles.css';
@@ -125,19 +125,79 @@ export function DashboardGrid({
   onRemoveWidget,
 }: DashboardGridProps) {
   const t = useTranslations('widgets');
-  const containerRef = useRef<HTMLDivElement>(null);
   const [width, setWidth] = useState(1200);
 
-  // Measure container width (v2 requires explicit width — Pitfall 1)
+  // quick-260922-vdk: Messung haengt am eingehaengten Knoten (Ref-Rueckruf),
-  useEffect(() => {
+  // nicht mehr an einem Effekt mit leerer Abhaengigkeitsliste.
-    if (!containerRef.current) return;
+  //
-    const observer = new ResizeObserver((entries) => {
+  // Warum: der fruehe Ruecksprung in den Leerzustand rendert das gemessene
-      setWidth(entries[0].contentRect.width);
+  // <div> gar nicht erst. Haengt DashboardGrid mit null Kacheln ein, sieht der
-    });
+  // alte Effekt (leere Abhaengigkeitsliste, laeuft genau einmal beim
-    observer.observe(containerRef.current);
+  // Einhaengen) den Ref als leer, bricht ab und laeuft nie wieder — auch nicht,
-    return () => observer.disconnect();
+  // wenn spaeter die erste Kachel erscheint und das <div> tatsaechlich
+  // entsteht. Die Breite blieb dann fuer die ganze Sitzung beim Startwert
+  // 1200, react-grid-layout vergleicht den Breakpoint strikt groesser als
+  // (`width > breakpoint`), 1200 ist damit NICHT `lg` sondern `md` -> 20 statt
+  // 24 Spalten, 51,6 statt 50 px Spaltenbreite, ein toter Streifen rechts.
+  //
+  // Der Ref-Rueckruf `measureRef` folgt dem Knoten ueber Aus- und Einhaengen
+  // hinweg (Leerzustand <-> gefuellt) und laeuft in der Commit-Phase — die dort
+  // ausgeloeste Zustandsaenderung wird vor dem Zeichnen abgearbeitet, ein
+  // zusaetzlicher useLayoutEffect ist damit ueberfluessig. Der Startwert 1200
+  // lebt deshalb nur noch bis zur Commit-Phase desselben Einhaengens; genau
+  // diesen Uebergang macht der Pfad "Neuladen mit vorhandenen Kacheln" heute
+  // schon in Produktion und er ist nachweislich richtig (459 px in 1176 px
+  // gemessen) — ein anderer Startwert wuerde eine bisher unerprobte
+  // Breakpoint-Folge einfuehren, ohne etwas zu verbessern.
+  //
+  // Der Fenster-Horcher ist ein zusaetzliches Netz fuer Faelle, in denen der
+  // ResizeObserver nichts meldet — nicht sein Ersatz. `applyWidth` verwirft 0
+  // und nicht endliche Werte (T-VDK-01/T-VDK-03), damit eine kurzzeitig
+  // zusammengefallene Flaeche das Raster nicht auf Null setzt und keine
+  // Rueckkopplungsschleife entsteht; React verwirft gleiche Werte selbst.
+  const nodeRef = useRef<HTMLDivElement | null>(null);
+  const observerRef = useRef<ResizeObserver | null>(null);
+
+  const applyWidth = useCallback((next: number) => {
+    if (Number.isFinite(next) && next > 0) {
+      setWidth(next);
+    }
   }, []);
 
+  const measureRef = useCallback(
+    (node: HTMLDivElement | null) => {
+      // Ein eventuell laufender Beobachter zuerst trennen — auch der
+      // null-Zweig (Aushaengen) durchlaeuft diese Zeilen, das ist hier der
+      // Aufraeumpfad (T-VDK-02).
+      observerRef.current?.disconnect();
+      observerRef.current = null;
+      nodeRef.current = node;
+      if (!node) return;
+
+      // Synchrone Erstmessung in der Commit-Phase, vor dem ersten Zeichnen.
+      applyWidth(node.getBoundingClientRect().width);
+
+      const observer = new ResizeObserver((entries) => {
+        applyWidth(entries[0].contentRect.width);
+      });
+      observer.observe(node);
+      observerRef.current = observer;
+      // Bewusst keine Aufraeumfunktion zurueckgeben: React 19 ruft den
+      // Ref-Rueckruf sonst beim Aushaengen nicht mehr mit null auf.
+    },
+    [applyWidth],
+  );
+
+  useEffect(() => {
+    const onResize = () => {
+      if (nodeRef.current) {
+        applyWidth(nodeRef.current.getBoundingClientRect().width);
+      }
+    };
+    window.addEventListener('resize', onResize);
+    return () => window.removeEventListener('resize', onResize);
+  }, [applyWidth]);
+
   // quick-260916-dyv: minW/minH (und zu kleine w/h) aus WIDGET_CONSTRAINTS —
   // siehe applyConstraintMinima. Vor dem Leerzustand, damit die Hook-Reihenfolge
   // stabil bleibt.
@@ -162,7 +222,7 @@ export function DashboardGrid({
   }
 
   return (
-    <div ref={containerRef}>
+    <div ref={measureRef}>
       <Responsive
         width={width}
         breakpoints={BREAKPOINTS}

apps/web/src/components/dashboard/widget-catalog-modal.test.tsx

@@ -36,12 +36,17 @@ vi.mock('next-intl', () => ({
   },
 }));
 
+import { WIDGET_TYPES } from '@tessera/shared';
+import { WIDGET_REGISTRY } from './widget-registry';
 import { WidgetCatalogModal } from './widget-catalog-modal';
 
+// Alle neun Kacheln sind heute Plattform-Kacheln ohne moduleSlug, also zeigt
+// der Katalog sie auch bei leerer Modulliste vollstaendig an.
 const baseProps = {
   isOpen: true,
   onClose: vi.fn(),
   onAddWidget: vi.fn(),
+  accessibleModuleSlugs: [] as string[],
 };
 
 afterEach(() => {
@@ -130,3 +135,50 @@ describe('WidgetCatalogModal', () => {
     expect(screen.getByRole('button', { name: 'Schließen' })).toBeInTheDocument();
   });
 });
+
+/**
+ * quick-260922-m1h: Der Katalog fuehrt keine zweite Typliste mehr — er leitet
+ * sie aus der Registry ab und filtert nach Modulzugriff.
+ */
+describe('WidgetCatalogModal: Liste kommt aus der Registry (quick-260922-m1h)', () => {
+  it('zeigt alle neun Kacheln in der Reihenfolge der Registry', () => {
+    render(<WidgetCatalogModal {...baseProps} />);
+
+    const dialog = screen.getByRole('dialog', { name: 'Widget hinzufügen' });
+    const cards = Array.from(
+      dialog.querySelectorAll<HTMLButtonElement>('button[data-widget-type]'),
+    );
+
+    expect(cards.map((c) => c.getAttribute('data-widget-type'))).toEqual([
+      ...WIDGET_TYPES,
+    ]);
+    expect(Object.keys(WIDGET_REGISTRY)).toEqual([...WIDGET_TYPES]);
+  });
+
+  it('eine Kachel MIT moduleSlug fehlt, wenn das Modul nicht zugaenglich ist, und erscheint, wenn doch', () => {
+    // Die Registry traegt heute keine Modul-Kachel — fuer den Nachweis am
+    // echten Bauteil wird clock voruebergehend zu einer gemacht.
+    WIDGET_REGISTRY.clock.moduleSlug = 'proxmox';
+    try {
+      const { rerender } = render(<WidgetCatalogModal {...baseProps} />);
+      expect(screen.queryByRole('button', { name: /Uhr/ })).toBeNull();
+
+      rerender(<WidgetCatalogModal {...baseProps} accessibleModuleSlugs={['proxmox']} />);
+      expect(screen.getByRole('button', { name: /Uhr/ })).toBeInTheDocument();
+    } finally {
+      WIDGET_REGISTRY.clock.moduleSlug = undefined;
+    }
+  });
+
+  it('fail-closed: schlaegt der Modulabruf fehl (null), verschwinden Kacheln MIT moduleSlug, Plattform-Kacheln bleiben', () => {
+    WIDGET_REGISTRY.clock.moduleSlug = 'proxmox';
+    try {
+      render(<WidgetCatalogModal {...baseProps} accessibleModuleSlugs={null} />);
+
+      expect(screen.queryByRole('button', { name: /Uhr/ })).toBeNull();
+      expect(screen.getByRole('button', { name: /Notiz/ })).toBeInTheDocument();
+    } finally {
+      WIDGET_REGISTRY.clock.moduleSlug = undefined;
+    }
+  });
+});

apps/web/src/components/dashboard/widget-catalog-modal.tsx

@@ -2,28 +2,30 @@
 
 import { useEffect, useRef } from 'react';
 import { useTranslations } from 'next-intl';
-import { WIDGET_REGISTRY, type WidgetType } from './widget-registry';
+import { WIDGET_REGISTRY, type WidgetType, visibleWidgetTypes } from './widget-registry';
 
 interface WidgetCatalogModalProps {
   isOpen: boolean;
   onClose: () => void;
   onAddWidget: (type: WidgetType) => void;
+  /**
+   * Slugs der Module, die der angemeldete Benutzer nutzen darf — geholt von
+   * der Dashboard-Seite ueber `GET /modules/active` (quick-260922-m1h).
+   * `null` heisst "noch unbekannt oder Abruf fehlgeschlagen": dann bleiben
+   * Kacheln MIT `moduleSlug` ausgeblendet (fail-closed).
+   *
+   * Der Abruf steht bewusst NICHT in diesem Dialog, damit er ein reines
+   * Anzeige-Bauteil bleibt und ohne Netzwerk-Attrappe testbar ist.
+   */
+  accessibleModuleSlugs: readonly string[] | null;
 }
 
-const WIDGET_TYPES: WidgetType[] = [
-  'clock',
-  'search',
-  'calendar',
-  'note',
-  'calculator',
-  'favorites',
-  'stopwatch',
-  'picture-frame',
-  'xframe',
-];
-
 /**
  * Modal dialog showing available widget types as selectable cards.
+ *
+ * quick-260922-m1h: Die Liste kommt aus WIDGET_REGISTRY (Reihenfolge der
+ * Registry-Definition) statt aus einer zweiten, hier gepflegten Liste — eine
+ * neue Kachel musste sonst an zwei Stellen eingetragen werden.
  * Click on a card adds the widget to the dashboard and closes the modal.
  * Escape to close, click outside to close, focus trap (D-01 flow).
  */
@@ -31,6 +33,7 @@ export function WidgetCatalogModal({
   isOpen,
   onClose,
   onAddWidget,
+  accessibleModuleSlugs,
 }: WidgetCatalogModalProps) {
   const t = useTranslations('widgets');
   const tCommon = useTranslations('common');
@@ -107,13 +110,14 @@ export function WidgetCatalogModal({
 
         {/* 2x2 grid of widget type cards */}
         <div className="grid grid-cols-2 gap-3">
-          {WIDGET_TYPES.map((type) => {
+          {visibleWidgetTypes(WIDGET_REGISTRY, accessibleModuleSlugs).map((type) => {
             const def = WIDGET_REGISTRY[type];
             const Icon = def.icon;
             return (
               <button
                 key={type}
                 type="button"
+                data-widget-type={type}
                 onClick={() => {
                   onAddWidget(type);
                   onClose();

apps/web/src/components/dashboard/widget-registry.test.tsx

@@ -1,5 +1,14 @@
-import { describe, expect, it } from 'vitest';
+import { describe, expect, it, vi } from 'vitest';
-import { WIDGET_CONSTRAINTS, type WidgetType } from './widget-registry';
+import { WIDGET_TYPES } from '@tessera/shared';
+import {
+  WIDGET_CONSTRAINTS,
+  WIDGET_REGISTRY,
+  type WidgetDefinition,
+  type WidgetProps,
+  type WidgetType,
+  registerWidget,
+  visibleWidgetTypes,
+} from './widget-registry';
 
 /**
  * DASH-11: Every WidgetType entry in WIDGET_CONSTRAINTS must have
@@ -82,3 +91,118 @@ describe('WIDGET_CONSTRAINTS (DASH-11)', () => {
     expect(counted).toBe(36);
   });
 });
+
+/**
+ * quick-260922-m1h: Deckungsgleichheit. Die Typliste steht seit diesem Umbau
+ * EINMAL in `packages/shared`; Registry, Constraints-Tabelle und die
+ * Erwartungsliste dieses Tests muessen dieselben Schluessel in derselben
+ * Reihenfolge tragen. Dieser Test faengt kuenftig jede vergessene Stelle.
+ */
+describe('Typliste ist an einer Stelle definiert (quick-260922-m1h)', () => {
+  it('WIDGET_TYPES aus @tessera/shared, Registry-Schluessel und Constraints-Schluessel sind deckungsgleich (gleiche Reihenfolge)', () => {
+    expect(Object.keys(WIDGET_REGISTRY)).toEqual([...WIDGET_TYPES]);
+    expect(Object.keys(WIDGET_CONSTRAINTS)).toEqual([...WIDGET_TYPES]);
+  });
+
+  it('die neun erwarteten Kacheln stehen unveraendert und in unveraenderter Reihenfolge in WIDGET_TYPES', () => {
+    expect([...WIDGET_TYPES]).toEqual(ALL_WIDGET_TYPES);
+  });
+
+  it('jeder Registry-Eintrag traegt seinen eigenen Typ als `type`', () => {
+    for (const type of WIDGET_TYPES) {
+      expect(WIDGET_REGISTRY[type].type).toBe(type);
+    }
+  });
+
+  it('heute traegt keine der neun Kacheln einen moduleSlug (alle sind Plattform-Kacheln)', () => {
+    for (const type of WIDGET_TYPES) {
+      expect(WIDGET_REGISTRY[type].moduleSlug).toBeUndefined();
+    }
+  });
+});
+
+describe('registerWidget (quick-260922-m1h)', () => {
+  function makeComponent(): (props: WidgetProps) => null {
+    return () => null;
+  }
+
+  it('meldet eine Komponente fuer ihren Typ an', () => {
+    const before = WIDGET_REGISTRY.clock.component;
+    const component = makeComponent();
+
+    registerWidget('clock', component);
+
+    expect(WIDGET_REGISTRY.clock.component).toBe(component);
+
+    WIDGET_REGISTRY.clock.component = before;
+  });
+
+  it('ist idempotent: eine zweite Anmeldung desselben Typs ist ein No-Op (wie die alten wireX-Flags)', () => {
+    const before = WIDGET_REGISTRY.note.component;
+    const first = makeComponent();
+    const second = makeComponent();
+
+    registerWidget('note', first);
+    registerWidget('note', second);
+
+    expect(WIDGET_REGISTRY.note.component).toBe(first);
+
+    WIDGET_REGISTRY.note.component = before;
+  });
+
+  it('ein unbekannter Typ wirft in der Entwicklung', () => {
+    expect(() =>
+      // Absichtlich ein Typ ausserhalb der Union — genau der Fall, den der
+      // Wurf melden soll (eine Kachel, die in WIDGET_TYPES vergessen wurde).
+      registerWidget('proxmox' as WidgetType, makeComponent()),
+    ).toThrow(/proxmox/);
+  });
+
+  it('ein unbekannter Typ wird in der Produktion still ignoriert', () => {
+    const previous = process.env.NODE_ENV;
+    vi.stubEnv('NODE_ENV', 'production');
+
+    expect(() => registerWidget('proxmox' as WidgetType, makeComponent())).not.toThrow();
+
+    vi.stubEnv('NODE_ENV', previous ?? 'test');
+    vi.unstubAllEnvs();
+  });
+});
+
+/**
+ * quick-260922-m1h: Der Katalogfilter als reine Funktion — so testbar ohne
+ * eine echte Modul-Kachel zu erfinden (Muster picture-frame-config.ts).
+ * WICHTIG (T-M1H-01): Dieser Filter ist Komfort. Die verbindliche
+ * Durchsetzung bleibt serverseitig in DashboardService.getWidgets.
+ */
+describe('visibleWidgetTypes (quick-260922-m1h)', () => {
+  const testRegistry: Record<string, Pick<WidgetDefinition, 'moduleSlug'>> = {
+    clock: {},
+    proxmox: { moduleSlug: 'proxmox' },
+    note: {},
+  };
+
+  it('behaelt die Reihenfolge der Registry bei', () => {
+    expect(visibleWidgetTypes(WIDGET_REGISTRY, [])).toEqual([...WIDGET_TYPES]);
+  });
+
+  it('Kacheln ohne moduleSlug sind immer sichtbar', () => {
+    expect(visibleWidgetTypes(testRegistry, [])).toEqual(['clock', 'note']);
+  });
+
+  it('eine Kachel mit moduleSlug fehlt, wenn der Slug nicht in den zugaenglichen Modulen steht', () => {
+    expect(visibleWidgetTypes(testRegistry, ['domaincheck'])).toEqual(['clock', 'note']);
+  });
+
+  it('eine Kachel mit moduleSlug erscheint, wenn der Slug in den zugaenglichen Modulen steht', () => {
+    expect(visibleWidgetTypes(testRegistry, ['domaincheck', 'proxmox'])).toEqual([
+      'clock',
+      'proxmox',
+      'note',
+    ]);
+  });
+
+  it('fail-closed: ist die Modulliste unbekannt (null, z. B. fehlgeschlagener Abruf), verschwinden alle Kacheln MIT moduleSlug', () => {
+    expect(visibleWidgetTypes(testRegistry, null)).toEqual(['clock', 'note']);
+  });
+});

apps/web/src/components/dashboard/widget-registry.tsx

@@ -1,7 +1,17 @@
 import type { ComponentType } from 'react';
+import { WIDGET_MODULE_SLUGS, type WidgetType } from '@tessera/shared';
 
 /**
- * Supported widget types for the dashboard.
+ * Die Typliste der Kacheln steht seit quick-260922-m1h EINMAL, in
+ * `packages/shared/src/index.ts` — dieselbe Liste, gegen die die API in
+ * `create-widget.dto.ts` mit `@IsIn` validiert. Vorher stand sie an sieben
+ * Stellen; vergass man eine, fehlte die Kachel im Katalog oder die API
+ * lehnte sie mit 400 ab.
+ *
+ * Hier weiter-exportiert, weil ein knappes Dutzend Web-Dateien den Typ seit
+ * jeher von der Registry bezieht (dashboard-grid, widget-wrapper,
+ * dashboard-store, widget-settings-panel ...).
+ *
  * clock/search/calendar/note: implemented in previous plans.
  * calculator/favorites/stopwatch: Phase 8 additions (der fruehere
  * Einzel-Schnellzugriffs-Typ wurde in quick-260916-iex entfernt — Favoriten
@@ -9,16 +19,7 @@ import type { ComponentType } from 'react';
  * picture-frame: Bilderrahmen (quick-260921-pi9).
  * xframe: Webseite als Rahmen (quick-260921-qd3).
  */
-export type WidgetType =
+export type { WidgetType };
-  | 'clock'
-  | 'search'
-  | 'calendar'
-  | 'note'
-  | 'calculator'
-  | 'favorites'
-  | 'stopwatch'
-  | 'picture-frame'
-  | 'xframe';
 
 /**
  * Props contract that every widget component must accept.
@@ -76,6 +77,12 @@ export interface WidgetDefinition {
   type: WidgetType;
   nameKey: string;
   descriptionKey: string;
+  /**
+   * Modul, zu dem diese Kachel gehoert (quick-260922-m1h), aus
+   * `WIDGET_MODULE_SLUGS`. Fehlt der Eintrag, ist es eine Plattform-Kachel
+   * und immer sichtbar — der heutige Zustand fuer alle neun Kacheln.
+   */
+  moduleSlug?: string;
   /** Inline SVG icon as React component */
   icon: ComponentType<{ className?: string }>;
   minW: number;
@@ -318,7 +325,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'clock.description',
     icon: ClockIcon,
     ...WIDGET_CONSTRAINTS.clock,
-    component: PlaceholderWidget, // Replaced via wireClockWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.clock,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   search: {
     type: 'search',
@@ -326,7 +334,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'search.description',
     icon: SearchIcon,
     ...WIDGET_CONSTRAINTS.search,
-    component: PlaceholderWidget, // Replaced via wireSearchWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.search,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   calendar: {
     type: 'calendar',
@@ -334,7 +343,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'calendar.description',
     icon: CalendarIcon,
     ...WIDGET_CONSTRAINTS.calendar,
-    component: PlaceholderWidget, // Replaced via wireCalendarWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.calendar,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   note: {
     type: 'note',
@@ -342,7 +352,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'note.description',
     icon: NoteIcon,
     ...WIDGET_CONSTRAINTS.note,
-    component: PlaceholderWidget, // Replaced via wireNoteWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.note,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   calculator: {
     type: 'calculator',
@@ -350,7 +361,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'calculator.description',
     icon: CalculatorIcon,
     ...WIDGET_CONSTRAINTS.calculator,
-    component: PlaceholderWidget, // Replaced via wireCalculatorWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.calculator,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   favorites: {
     type: 'favorites',
@@ -358,7 +370,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'favorites.description',
     icon: FavoritesIcon,
     ...WIDGET_CONSTRAINTS.favorites,
-    component: PlaceholderWidget, // Replaced via wireFavoritesWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.favorites,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   stopwatch: {
     type: 'stopwatch',
@@ -366,7 +379,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'stopwatch.description',
     icon: StopwatchIcon,
     ...WIDGET_CONSTRAINTS.stopwatch,
-    component: PlaceholderWidget, // Replaced via wireStopwatchWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.stopwatch,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   'picture-frame': {
     type: 'picture-frame',
@@ -374,7 +388,8 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'pictureFrame.description',
     icon: PictureFrameIcon,
     ...WIDGET_CONSTRAINTS['picture-frame'],
-    component: PlaceholderWidget, // Replaced via wirePictureFrameWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS['picture-frame'],
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
   xframe: {
     type: 'xframe',
@@ -382,82 +397,76 @@ export const WIDGET_REGISTRY: Record<WidgetType, WidgetDefinition> = {
     descriptionKey: 'xframe.description',
     icon: XframeIcon,
     ...WIDGET_CONSTRAINTS.xframe,
-    component: PlaceholderWidget, // Replaced via wireXframeWidget()
+    moduleSlug: WIDGET_MODULE_SLUGS.xframe,
+    component: PlaceholderWidget, // wird in (portal)/page.tsx per registerWidget() ersetzt
   },
 };
 
-// Wire actual widget components lazily to avoid circular deps
+/**
-// (imports are deferred so widget-registry can be imported by tests without
+ * Meldet die Komponente einer Kachel an ihrem Registry-Eintrag an
-// pulling in the entire React tree)
+ * (quick-260922-m1h — ersetzt die vormals neun `wireXWidget()`-Funktionen
+ * mit je eigenem Bool-Flag).
+ *
+ * Aufgerufen wird sie in `apps/web/src/app/(portal)/page.tsx` und NICHT
+ * hier: die Komponenten duerfen nicht aus der Registry heraus importiert
+ * werden, sonst entsteht ein Zirkelimport (jede Kachel importiert ueber den
+ * Wrapper wieder die Registry). Die Seite ist die Stelle, an der beides
+ * zusammenkommt.
+ *
+ * Mehrfachanmeldung desselben Typs ist ein No-Op — die erste gewinnt, genau
+ * wie die alten Flags. Ein Typ, der nicht in `WIDGET_TYPES` steht, wirft in
+ * der Entwicklung (dann fehlt der Eintrag in `packages/shared`) und wird in
+ * der Produktion ignoriert, damit eine vergessene Kachel nicht das ganze
+ * Dashboard mitreisst.
+ */
+const registeredTypes = new Set<WidgetType>();
 
-let clockWired = false;
+export function registerWidget(type: WidgetType, component: ComponentType<WidgetProps>) {
-export function wireClockWidget(component: ComponentType<WidgetProps>) {
+  const definition: WidgetDefinition | undefined = WIDGET_REGISTRY[type];
-  if (!clockWired) {
+
-    WIDGET_REGISTRY.clock.component = component;
+  if (!definition) {
-    clockWired = true;
+    if (process.env.NODE_ENV !== 'production') {
+      throw new Error(
+        `registerWidget: unbekannter Widget-Typ "${type}". Fehlt der Typ in WIDGET_TYPES (packages/shared/src/index.ts)?`,
+      );
+    }
+    return;
   }
+
+  if (registeredTypes.has(type)) return;
+
+  definition.component = component;
+  registeredTypes.add(type);
 }
 
-let searchWired = false;
+/**
-export function wireSearchWidget(component: ComponentType<WidgetProps>) {
+ * Welche Kacheln der Katalog zeigen darf (quick-260922-m1h).
-  if (!searchWired) {
+ *
-    WIDGET_REGISTRY.search.component = component;
+ * Eine Kachel ohne `moduleSlug` ist immer sichtbar; eine Kachel MIT
-    searchWired = true;
+ * `moduleSlug` nur, wenn der Slug unter den zugaenglichen Modulen steht.
-  }
+ * `accessibleModuleSlugs === null` heisst "Modulliste unbekannt" (Abruf
-}
+ * laeuft noch oder ist fehlgeschlagen) — dann sind Modul-Kacheln
+ * ausgeblendet, fail-closed wie serverseitig.
+ *
+ * ACHTUNG (T-M1H-01): Das hier ist reiner Komfort — es verhindert nur, dass
+ * jemand eine Kachel anlegt, die ihm danach kommentarlos wieder verschwindet.
+ * Die verbindliche Durchsetzung bleibt serverseitig in
+ * `DashboardService.getWidgets` (fail-closed) und im Modul-Guard der
+ * jeweiligen Daten-Endpunkte. Diesen Filter zu umgehen bringt nichts.
+ *
+ * Reine Funktion mit der Registry als Parameter, damit sie ohne eine echte
+ * Modul-Kachel testbar ist (Muster `picture-frame-config.ts`).
+ */
+export function visibleWidgetTypes<T extends string>(
+  registry: Record<T, Pick<WidgetDefinition, 'moduleSlug'>>,
+  accessibleModuleSlugs: readonly string[] | null,
+): T[] {
+  const types = Object.keys(registry) as T[];
 
-let calendarWired = false;
+  return types.filter((type) => {
-export function wireCalendarWidget(component: ComponentType<WidgetProps>) {
+    const slug = registry[type].moduleSlug;
-  if (!calendarWired) {
+    if (slug === undefined) return true;
-    WIDGET_REGISTRY.calendar.component = component;
+    if (accessibleModuleSlugs === null) return false;
-    calendarWired = true;
+    return accessibleModuleSlugs.includes(slug);
-  }
+  });
-}
-
-let noteWired = false;
-export function wireNoteWidget(component: ComponentType<WidgetProps>) {
-  if (!noteWired) {
-    WIDGET_REGISTRY.note.component = component;
-    noteWired = true;
-  }
-}
-
-let calculatorWired = false;
-export function wireCalculatorWidget(component: ComponentType<WidgetProps>) {
-  if (!calculatorWired) {
-    WIDGET_REGISTRY.calculator.component = component;
-    calculatorWired = true;
-  }
-}
-
-let favoritesWired = false;
-export function wireFavoritesWidget(component: ComponentType<WidgetProps>) {
-  if (!favoritesWired) {
-    WIDGET_REGISTRY.favorites.component = component;
-    favoritesWired = true;
-  }
-}
-
-let stopwatchWired = false;
-export function wireStopwatchWidget(component: ComponentType<WidgetProps>) {
-  if (!stopwatchWired) {
-    WIDGET_REGISTRY.stopwatch.component = component;
-    stopwatchWired = true;
-  }
-}
-
-let pictureFrameWired = false;
-export function wirePictureFrameWidget(component: ComponentType<WidgetProps>) {
-  if (!pictureFrameWired) {
-    WIDGET_REGISTRY['picture-frame'].component = component;
-    pictureFrameWired = true;
-  }
-}
-
-let xframeWired = false;
-export function wireXframeWidget(component: ComponentType<WidgetProps>) {
-  if (!xframeWired) {
-    WIDGET_REGISTRY.xframe.component = component;
-    xframeWired = true;
-  }
 }

apps/web/src/components/dashboard/widgets/widget-wrapper.test.tsx

@@ -3,15 +3,21 @@ import { describe, expect, it, vi } from 'vitest';
 
 // quick-260916-iex: Link-Widget entfernt — unbekannte Widget-Typen (z. B.
 // eine alte Link-Kachel vor dem Einspielen der Migration) muessen weiterhin
-// ohne Absturz als grauer Text gerendert werden.
+// ohne Absturz gerendert werden.
+// quick-260922-m1h: Statt des rohen Typnamens steht dort jetzt ein Satz, der
+// den Fall erklaert — derselbe Fall tritt kuenftig auf, wenn eine Kachel zu
+// einem Modul gehoert, das dem Benutzer nicht freigegeben ist.
 vi.mock('next-intl', () => ({
-  useTranslations: () => (key: string) => key,
+  useTranslations: () => (key: string) =>
+    key === 'unavailable'
+      ? 'Diese Kachel steht nicht zur Verfügung — das zugehörige Modul ist nicht freigegeben.'
+      : key,
 }));
 
 import { WidgetWrapper } from './widget-wrapper';
 
 describe('WidgetWrapper', () => {
-  it('unbekannter Widget-Typ (z. B. eine alte Link-Kachel vor der Migration) rendert als grauer Text ohne Absturz', () => {
+  it('unbekannter/gesperrter Widget-Typ erklaert sich mit einem Hinweistext statt leer oder als roher Typname zu rendern', () => {
     render(
       <WidgetWrapper
         widget={{ id: 'w-alt', widgetType: 'link', config: {} }}
@@ -23,7 +29,29 @@ describe('WidgetWrapper', () => {
     const article = screen.getByRole('article');
     expect(article).toHaveAttribute('aria-label', 'link');
 
-    const fallback = screen.getByText('link');
+    const hint = screen.getByText(
-    expect(fallback.className).toContain('text-muted-foreground');
+      'Diese Kachel steht nicht zur Verfügung — das zugehörige Modul ist nicht freigegeben.',
+    );
+    expect(hint.className).toContain('text-muted-foreground');
+    expect(hint.className).toContain('text-center');
+
+    // Der rohe Typname steht nicht mehr im Rumpf der Kachel.
+    expect(screen.queryByText('link')).toBeNull();
+  });
+
+  it('eine bekannte Kachel rendert weiterhin ihre Komponente, nicht den Hinweis', () => {
+    render(
+      <WidgetWrapper
+        widget={{ id: 'w-uhr', widgetType: 'clock', config: {} }}
+        isEditMode={false}
+        onRemove={vi.fn()}
+      />,
+    );
+
+    expect(
+      screen.queryByText(
+        'Diese Kachel steht nicht zur Verfügung — das zugehörige Modul ist nicht freigegeben.',
+      ),
+    ).toBeNull();
   });
 });

apps/web/src/components/dashboard/widgets/widget-wrapper.tsx

@@ -111,8 +111,14 @@ export function WidgetWrapper({ widget, isEditMode, onRemove }: WidgetWrapperPro
             isEditMode={isEditMode}
           />
         ) : (
-          <div className="flex h-full items-center justify-center text-sm text-muted-foreground">
+          /* quick-260922-m1h: Kein Bauteil zu diesem Typ — entweder eine alte
-            {widget.widgetType}
+             Kachel eines entfernten Typs oder (ab der ersten Modul-Kachel) eine
+             Kachel, deren Modul dem Benutzer nicht freigegeben ist. Vorher
+             stand hier der rohe Typname, der dem Anwender nichts sagte. */
+          <div className="flex h-full items-center justify-center p-3">
+            <p className="text-center text-sm text-muted-foreground">
+              {t('unavailable')}
+            </p>
           </div>
         )}
       </div>

apps/web/src/lib/app-version.ts

@@ -22,9 +22,11 @@ export interface AppVersionInfo {
 }
 
 /**
- * Spiegel von `VersionResponse` aus `packages/shared`: `apps/web` haengt
+ * Spiegel von `VersionResponse` aus `packages/shared`. Die Begruendung
- * nicht von `@tessera/shared` ab, und ein neuer Import wuerde Lockfile und
+ * "apps/web haengt nicht von @tessera/shared ab" gilt seit quick-260922-m1h
- * die deps-Stufe des Dockerfiles aendern. Die API-Wahrheit bleibt dort.
+ * nicht mehr — die Kachel-Typliste wird von dort importiert. Dieser Spiegel
+ * bleibt trotzdem stehen: ihn aufzuloesen war nicht Teil jenes Umbaus und
+ * braucht einen eigenen Durchgang. Die API-Wahrheit bleibt in packages/shared.
  */
 export interface ApiVersionInfo {
   name: string;

apps/web/src/lib/desktop.ts

@@ -17,8 +17,9 @@ export type DesktopPlatform = 'windows' | 'linux';
 
 /**
  * Spiegel von `DesktopLatestFile`/`DesktopLatestResponse` aus
- * `packages/shared`: `apps/web` haengt nicht von `@tessera/shared` ab
+ * `packages/shared` (gleicher Stand wie in `app-version.ts`: seit
- * (gleiche Begruendung wie in `app-version.ts`). Die API-Wahrheit bleibt in
+ * quick-260922-m1h waere ein Import moeglich, der Spiegel wurde aber bewusst
+ * nicht mit aufgeloest). Die API-Wahrheit bleibt in
  * `apps/api/src/desktop/desktop.service.ts`.
  */
 export interface DesktopFileInfo {

apps/web/src/messages/de.json

@@ -213,6 +213,7 @@
     "saveChanges": "Änderungen speichern",
     "layoutLoadError": "Dashboard konnte nicht geladen werden. Bitte laden Sie die Seite neu.",
     "widgetSaveError": "Änderungen konnten nicht gespeichert werden. Bitte versuchen Sie es erneut.",
+    "unavailable": "Diese Kachel steht nicht zur Verfügung — das zugehörige Modul ist nicht freigegeben.",
     "clock": {
       "name": "Uhr",
       "description": "Zeigt die aktuelle Uhrzeit an",

apps/web/src/messages/en.json

@@ -213,6 +213,7 @@
     "saveChanges": "Save changes",
     "layoutLoadError": "Could not load dashboard. Please reload the page.",
     "widgetSaveError": "Could not save changes. Please try again.",
+    "unavailable": "This tile is not available — the module it belongs to is not enabled for you.",
     "clock": {
       "name": "Clock",
       "description": "Shows the current time",

docs/anleitung-entwicklung.md

@@ -400,6 +400,40 @@ Für ein Modul mit Unterrouten (Einstellungsseite, Verwaltungsansicht) orientier
 `dkv-fleet` oder `tender-radar` — beide haben zusätzliche `settings/page.tsx` bzw. weitere
 Unterverzeichnisse, die vom selben `layout.tsx` mitgedeckt werden.
 
+### Eine Kachel zum Modul
+
+Ein Modul kann zusätzlich als Kachel auf dem Dashboard erscheinen. Seit
+`quick-260922-m1h` sind dafür **drei** Stellen nötig (vorher waren es sieben):
+
+1. **Die Kachel-Komponente schreiben** — `apps/web/src/components/dashboard/widgets/<name>-widget.tsx`,
+   nimmt die `WidgetProps` aus `widget-registry.tsx` (`instanceId`, `config`, `isEditMode`) entgegen.
+2. **Den Typ eintragen** — in `WIDGET_TYPES` in `packages/shared/src/index.ts`. Gehört die Kachel zu
+   einem Modul, zusätzlich `WIDGET_MODULE_SLUGS['<typ>'] = '<modul-slug>'` in derselben Datei. Das ist
+   die einzige Liste: die API validiert `POST /dashboard/widgets` per `@IsIn` gegen genau sie, und
+   das Frontend leitet Registry und Katalog davon ab.
+3. **Anmelden** — `registerWidget('<typ>', <Name>Widget)` in `apps/web/src/app/(portal)/page.tsx`,
+   neben den übrigen Aufrufen. Der Aufruf steht dort und nicht in der Registry, weil die Kachel über
+   den Wrapper wieder die Registry importiert — ein Import aus der Registry heraus wäre ein
+   Zirkelimport.
+
+Dazu kommen wie bei jeder Oberfläche die **Übersetzungsschlüssel** (`<typ>.name` und
+`<typ>.description` unter `widgets` in `de.json` **und** `en.json`), ein **Symbol** als Inline-SVG
+und die **Größenvorgaben** in `WIDGET_CONSTRAINTS` (`minW`/`minH` = kleinste noch bedienbare Kachel,
+`defaultW`/`defaultH` = Startgröße) — beides in `widget-registry.tsx`. Ein Test in
+`widget-registry.test.tsx` prüft, dass `WIDGET_TYPES`, Registry und Constraints deckungsgleich sind;
+vergisst man eine Stelle, schlägt er fehl.
+
+**Was eine Kachel mit `moduleSlug` automatisch tut:** Sie verschwindet für Benutzer, die das Modul
+nicht nutzen dürfen — aus dem Katalog („Widget hinzufügen", `visibleWidgetTypes`) und aus dem
+Dashboard selbst. Ist die Modulliste unbekannt, weil ihr Abruf fehlschlug, bleibt die Kachel
+ebenfalls verborgen (fail-closed). Eine bereits angelegte Kachel eines gesperrten Moduls rendert
+nicht mehr leer, sondern zeigt den Hinweis `widgets.unavailable`.
+
+**Wie beim Modul-Gate gilt auch hier:** Der Katalogfilter ist Komfort, nicht Zugriffskontrolle. Die
+verbindliche Prüfung sitzt serverseitig in `DashboardService.getWidgets()` (filtert Kacheln
+gesperrter Module fail-closed aus `GET /dashboard/widgets`) — und die Daten, die eine Modul-Kachel
+anzeigt, holt sie über die Endpunkte ihres Moduls, die `@UseModule('<slug>')` tragen müssen.
+
 ## Mandantentrennung
 
 Der tatsächliche Mechanismus ist `TenantGuard` (`apps/api/src/tenant/tenant.guard.ts`), global als

packages/shared/src/index.ts

@@ -76,3 +76,46 @@ export interface DesktopLatestResponse {
   buildTime: string;
   files: Partial<Record<DesktopPlatform, DesktopLatestFile>>;
 }
+
+/**
+ * Dashboard-Kacheln: EINE Typliste fuer Web und API (quick-260922-m1h).
+ *
+ * Vorher stand dieselbe Liste an sieben Stellen (Union-Typ, Constraints,
+ * Registry, Katalog-Liste, `@IsIn`-Whitelist ...). Vergass man eine, fehlte
+ * die Kachel im Katalog oder die API lehnte sie mit 400 ab. Seit m1h leiten
+ * beide Seiten von hier ab: `apps/web/src/components/dashboard/
+ * widget-registry.tsx` (Registry + Katalog) und
+ * `apps/api/src/dashboard/dto/create-widget.dto.ts` (`@IsIn`).
+ *
+ * ACHTUNG: Dies ist der erste LAUFZEIT-Import aus `@tessera/shared` (alle
+ * uebrigen sind `import type`). `packages/shared` liefert rohes TypeScript
+ * (`main: src/index.ts`, kein Bauschritt); die API laedt es im Betrieb ueber
+ * das native Type-Stripping von Node 24. Deshalb darf diese Datei nur
+ * loeschbare Syntax enthalten — keine `enum`, kein `namespace`, keine
+ * Parameter-Eigenschaften.
+ */
+export const WIDGET_TYPES = [
+  'clock',
+  'search',
+  'calendar',
+  'note',
+  'calculator',
+  'favorites',
+  'stopwatch',
+  'picture-frame',
+  'xframe',
+] as const;
+
+export type WidgetType = (typeof WIDGET_TYPES)[number];
+
+/**
+ * Kachel → Modul-Slug. Eine Kachel ohne Eintrag ist immer sichtbar; eine
+ * Kachel MIT Eintrag erscheint nur fuer Benutzer, die das Modul nutzen
+ * duerfen — im Katalog (Komfort, `visibleWidgetTypes`) und verbindlich
+ * serverseitig in `DashboardService.getWidgets` (fail-closed).
+ *
+ * Heute bewusst leer: alle neun Kacheln sind Plattform-Kacheln ohne
+ * Modulbezug. Die erste modulgebundene Kachel (Proxmox) traegt hier ihren
+ * Slug ein.
+ */
+export const WIDGET_MODULE_SLUGS: Partial<Record<WidgetType, string>> = {};

pnpm-lock.yaml

@@ -181,6 +181,9 @@ importers:
 
   apps/web:
     dependencies:
+      '@tessera/shared':
+        specifier: workspace:*
+        version: link:../../packages/shared
       '@uiw/react-md-editor':
         specifier: 4.1.1
         version: 4.1.1(@types/react@19.2.17)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)