Statuszeile zwischen Navigation und Artikel (Aktualisierung, Wortzahl, Lesedauer) #134

New Issue

fable-5 · 2026-07-19T00:18:35+02:00

fable-5 commented

2026-07-19 00:18:35 +02:00

Ziel

Zwischen Navigation/Seitenkopf und Artikeltext soll eine schmale Statuszeile erscheinen mit drei Werten:

Letzte Aktualisierung
Anzahl der Wörter
Geschätzte Lesedauer

Bestand / Fundorte

Injektionspunkt: apps/web/src/pages/PageEditorPage.tsx zwischen .editor-page__header (Titel, ~L513-523) und .editor-page__body (~L524).
updatedAt liegt auf page.data (Query ['page', …]) — nicht im resolved-Objekt; direkt page.data?.updatedAt lesen.
Datumsformat-Vorbild: Intl.DateTimeFormat in apps/web/src/editor/HistoryPanel.tsx (~L96-99).
Wortzahl ist client nicht vorhanden. Zwei Wege: (a) editor.getText() in der inneren PageEditor-Komponente (dort ist die TipTap-Instanz), oder (b) docToPlainText aus @dorfteich/shared bzw. Markdown-Export ['page-markdown', pageId].

Umsetzung

Komponente apps/web/src/pages/PageStatusBar.tsx rendert die drei Werte.
Wortzahl aus dem Volltext (Whitespace-Split); Lesedauer = ceil(Wörter / WPM) mit WPM-Default 200 (deutschsprachig, als Konstante). i18n-Text z. B. „ca. X Min. Lesezeit".
In PageEditorPage an der Injektionsstelle einhängen — nur Lesemodus (Empfehlung; Editmodus optional/aus).
Öffentliche Ansicht: Dieselbe Zeile in PublicPageView.tsx. updatedAt ist im public-content-Interface bereits deklariert (nur nicht gerendert). Wortzahl serverseitig aus HTML/Plaintext ableiten und im public-content-Payload mitliefern (apps/api/src/public/public.service.ts), damit die anonyme Ansicht keinen Editor braucht.
i18n-Strings (de/en) + CSS in base.css.

Akzeptanzkriterien

Statuszeile zwischen Kopf und Artikel mit korrekt formatiertem Datum, plausibler Wortzahl und Lesedauer.
Identische Zeile in der anonymen öffentlichen Ansicht.
pnpm lint + betroffene CI-Packs grün.

Offene Frage

Lesedauer-WPM (Default 200) — bei Bedarf anpassen.

## Ziel Zwischen Navigation/Seitenkopf und Artikeltext soll eine schmale **Statuszeile** erscheinen mit drei Werten: - **Letzte Aktualisierung** - **Anzahl der Wörter** - **Geschätzte Lesedauer** ## Bestand / Fundorte - Injektionspunkt: `apps/web/src/pages/PageEditorPage.tsx` zwischen `.editor-page__header` (Titel, ~L513-523) und `.editor-page__body` (~L524). - `updatedAt` liegt auf `page.data` (Query `['page', …]`) — **nicht** im `resolved`-Objekt; direkt `page.data?.updatedAt` lesen. - Datumsformat-Vorbild: `Intl.DateTimeFormat` in `apps/web/src/editor/HistoryPanel.tsx` (~L96-99). - Wortzahl ist client nicht vorhanden. Zwei Wege: (a) `editor.getText()` in der inneren `PageEditor`-Komponente (dort ist die TipTap-Instanz), oder (b) `docToPlainText` aus `@dorfteich/shared` bzw. Markdown-Export `['page-markdown', pageId]`. ## Umsetzung 1. Komponente `apps/web/src/pages/PageStatusBar.tsx` rendert die drei Werte. 2. Wortzahl aus dem Volltext (Whitespace-Split); Lesedauer = `ceil(Wörter / WPM)` mit **WPM-Default 200** (deutschsprachig, als Konstante). i18n-Text z. B. „ca. X Min. Lesezeit". 3. In `PageEditorPage` an der Injektionsstelle einhängen — **nur Lesemodus** (Empfehlung; Editmodus optional/aus). 4. **Öffentliche Ansicht:** Dieselbe Zeile in `PublicPageView.tsx`. `updatedAt` ist im public-content-Interface bereits deklariert (nur nicht gerendert). Wortzahl **serverseitig** aus HTML/Plaintext ableiten und im public-content-Payload mitliefern (`apps/api/src/public/public.service.ts`), damit die anonyme Ansicht keinen Editor braucht. 5. i18n-Strings (de/en) + CSS in `base.css`. ## Akzeptanzkriterien - [ ] Statuszeile zwischen Kopf und Artikel mit korrekt formatiertem Datum, plausibler Wortzahl und Lesedauer. - [ ] Identische Zeile in der anonymen öffentlichen Ansicht. - [ ] `pnpm lint` + betroffene CI-Packs grün. ## Offene Frage - Lesedauer-WPM (Default 200) — bei Bedarf anpassen.

fable-5 added this to the M17 — Lesemodus-Ausbau milestone 2026-07-19 00:18:35 +02:00

fable-5 referenced this issue from a commit

2026-07-19 03:46:51 +02:00

#134 Statuszeile zwischen Navigation und Artikel

fable-5 referenced this issue

2026-07-19 05:47:32 +02:00

M17–M19: #133–#137 (Kommentare inline, Statuszeile, Transklusion, Excalidraw, Checkbox-Fix) #138

fable-5 commented

2026-07-19 21:48:47 +02:00

Umgesetzt in c858f12: Statuszeile (letzte Aktualisierung · Wortzahl · geschätzte Lesezeit) zwischen Seitenkopf und Artikel — im authentifizierten Lesemodus und in der öffentlichen Ansicht. Geteilte Komponente PageStatusBar (Intl-Datumsformat, Lesezeit = ceil(Wörter/200), Singular/Plural, Lesezeit bei 0 Wörtern ausgeblendet); Wortzahl auth aus dem Markdown-Export (geteilter Query-Key), öffentlich per DOMParser aus dem gelieferten HTML — kein Backend-Change.

Verifiziert: visuell auf Test/Int (u. a. „722 Wörter · ca. 4 Min. Lesezeit" auf der Lang-Testseite). Deployt bis 60be198, von Stefan abgenommen.

Umgesetzt in `c858f12`: Statuszeile (letzte Aktualisierung · Wortzahl · geschätzte Lesezeit) zwischen Seitenkopf und Artikel — im authentifizierten Lesemodus und in der öffentlichen Ansicht. Geteilte Komponente `PageStatusBar` (Intl-Datumsformat, Lesezeit = ceil(Wörter/200), Singular/Plural, Lesezeit bei 0 Wörtern ausgeblendet); Wortzahl auth aus dem Markdown-Export (geteilter Query-Key), öffentlich per DOMParser aus dem gelieferten HTML — kein Backend-Change. Verifiziert: visuell auf Test/Int (u. a. „722 Wörter · ca. 4 Min. Lesezeit" auf der Lang-Testseite). Deployt bis `60be198`, von Stefan abgenommen.

fable-5 closed this issue

2026-07-19 21:48:48 +02:00

Sign in to join this conversation.