feat(redesign): notifications panel — grouped, directional, unread-aware #322

Merged

Cordy merged 4 commits from feat/redesign3c into main

2026-08-27 15:09:16 +00:00

Cordy commented

2026-08-27 15:07:02 +00:00

Owner

Redesign phase 3, slice 3.

What changes

Anchored like the user menu: #bellmenu moves into a .bellwrap beside the bell; rect-measured positioning removed; opening toggles.
Three channels the old list couldn't express, each with its own signal:
- Unread: left accent bar + tinted plate + heavier filename, per item. The API only sends an unread count, so the newest unread items are marked (items arrive newest-first) — an approximation until the backend carries per-item read state.
- Direction: received (accent down-arrow), sent (muted up-arrow), failed (danger triangle) icons.
- Failure: the reason gets its own danger line under the meta instead of being appended to the sentence.
Filename is the strong element; meta is "from/to {peer} · time · state" (new i18n keys in all four languages).
Today / Earlier group labels from timestamps.
Header: title + unread count chip + "Mark all read" as a safe link; Clear moves to the foot as the destructive action, no longer adjacent to Mark-all-read.
Proper empty state (bell glyph, "Nothing yet.", explanatory line).
Rail inbox dot retired (#inboxdot{display:none !important}) — the bell is the single "something arrived" channel. The element and its JS remain so nothing null-derefs; full removal can come later.

Verification

node --check all blocks; splices count=1. Operator check: bell → groups/icons/unread markers, mark-all-read clears chip+markers, Clear in foot.

Redesign phase 3, slice 3. ## What changes - **Anchored** like the user menu: `#bellmenu` moves into a `.bellwrap` beside the bell; rect-measured positioning removed; opening toggles. - **Three channels the old list couldn't express**, each with its own signal: - *Unread*: left accent bar + tinted plate + heavier filename, per item. The API only sends an unread **count**, so the newest `unread` items are marked (items arrive newest-first) — an approximation until the backend carries per-item read state. - *Direction*: received (accent down-arrow), sent (muted up-arrow), failed (danger triangle) icons. - *Failure*: the reason gets its own danger line under the meta instead of being appended to the sentence. - **Filename is the strong element**; meta is "from/to {peer} · time · state" (new i18n keys in all four languages). - **Today / Earlier group labels** from timestamps. - Header: title + unread count chip + "Mark all read" as a safe link; **Clear moves to the foot** as the destructive action, no longer adjacent to Mark-all-read. - Proper empty state (bell glyph, "Nothing yet.", explanatory line). - **Rail inbox dot retired** (`#inboxdot{display:none !important}`) — the bell is the single "something arrived" channel. The element and its JS remain so nothing null-derefs; full removal can come later. ## Verification `node --check` all blocks; splices count=1. Operator check: bell → groups/icons/unread markers, mark-all-read clears chip+markers, Clear in foot.

Cordy added 4 commits

2026-08-27 15:07:04 +00:00