docs(frontend): DataTable Snippet-Rendering in AGENTS.md dokumentieren #85

New issue

Closed

opened 2026-06-22 17:11:44 +00:00 by niboer · 0 comments

niboer commented

2026-06-22 17:11:44 +00:00

Owner

Beschreibung

Das Snippet-basierte Zellen-Rendering der DataTable (eingefuehrt in #72) ist ein wiederverwendbares Pattern, das in zukuenftigen Seiten (Zahlungsabgleich #73, Self-Service #74) ebenfalls zum Einsatz kommt. Es fehlt eine Dokumentation der Schnittstelle in rontend/AGENTS.md.

Motivation

Aktuell kennen nur Entwickler, die #72 implementiert haben, die API (children-Snippet mit Parametern (column, row, value)). Ohne Dokumentation wird das Pattern entweder nicht genutzt oder inkonsistent nachimplementiert (z. B. dupliziertes {@html}-Rendering).

Vorgeschlagene Umsetzung

In rontend/AGENTS.md unter "App-Template-Komponenten" einen Eintrag ergaenzen:

DataTable Snippet-Rendering: Bei Bedarf an Svelte-Komponenten in Tabellenzellen (z. B. StatusBadge, Button) wird der optionale children-Snippet verwendet: {#snippet children(col, row, value)}...{/snippet}. Der bestehende
ender-Callback ((row) => string) bleibt fuer einfache Text-Formatierung. Beide koennen nicht gleichzeitig verwendet werden.

Betroffene Dateien

rontend/AGENTS.md
rontend/src/lib/components/data-table.svelte (Referenz)
rontend/src/routes/app/events/[eventId]/+page.svelte (Anwendungsbeispiel)

### Beschreibung Das Snippet-basierte Zellen-Rendering der DataTable (eingefuehrt in #72) ist ein wiederverwendbares Pattern, das in zukuenftigen Seiten (Zahlungsabgleich #73, Self-Service #74) ebenfalls zum Einsatz kommt. Es fehlt eine Dokumentation der Schnittstelle in rontend/AGENTS.md. ### Motivation Aktuell kennen nur Entwickler, die #72 implementiert haben, die API (children-Snippet mit Parametern (column, row, value)). Ohne Dokumentation wird das Pattern entweder nicht genutzt oder inkonsistent nachimplementiert (z. B. dupliziertes {@html}-Rendering). ### Vorgeschlagene Umsetzung In rontend/AGENTS.md unter "App-Template-Komponenten" einen Eintrag ergaenzen: > **DataTable Snippet-Rendering:** Bei Bedarf an Svelte-Komponenten in Tabellenzellen (z. B. StatusBadge, Button) wird der optionale children-Snippet verwendet: <DataTable columns={...} data={...}>{#snippet children(col, row, value)}...{/snippet}</DataTable>. Der bestehende ender-Callback ((row) => string) bleibt fuer einfache Text-Formatierung. Beide koennen nicht gleichzeitig verwendet werden. ### Betroffene Dateien - rontend/AGENTS.md - rontend/src/lib/components/data-table.svelte (Referenz) - rontend/src/routes/app/events/[eventId]/+page.svelte (Anwendungsbeispiel)

niboer added this to the MS0: Projekt-Konventionen & Tooling milestone

2026-06-22 17:11:44 +00:00

niboer added the

component/frontend

type/chore

prio/low

labels

2026-06-22 17:11:44 +00:00

niboer referenced this issue from a commit

2026-06-22 17:37:02 +00:00

docs(frontend): DataTable Snippet-Rendering in AGENTS.md dokumentiert

niboer closed this issue