[wesbillman]

Summary

The Reminders page now reads like Slack's Later list instead of a stack of text blocks with four pill buttons.

• Rows: author avatar and name, a #channel chip, a two-line message preview, an optional note, and a due label: "Overdue · 2 hours ago" (danger tone), "Today at 3:00 PM", "Tomorrow at 9:00 AM", "Friday at 9:00 AM", or a date.
• Actions: the row opens its message. Mark done, Snooze, and an overflow menu (Open message, Cancel reminder) are icon buttons that appear on hover or focus, and stay visible on touch or narrow widths. Each snooze preset shows when it lands, e.g. "In 1 hour · 7:45 PM".
• Done: collapses behind the shared Accordion ("Done · 2"). Finished reminders get Remind me again, which re-snoozes them through the existing snooze path. This one is a small new action; Wes tried it in the redesign.
• Groups and empty states: group headers show counts, the list is a centered 48rem column, and empty pages use EmptyState ("No reminders yet" / "You're all caught up").

Built on shared owners: NavigationItem (same row recipe as Inbox), Avatar, IconButton, Menu, Accordion, InlineHeader, EmptyState. No reminder model, protocol, or persistence changes.

Validation

• vitest run src/bundled/reminders: 67 passing, including new row-action, note-only, accessible-description, and date-label tests, plus a reminder whose not_before is past JavaScript's Date range (the row renders without a due label instead of the page throwing).
• tests/browser/reminders-layout.spec.mjs updated for the new row structure; passes in Chromium and WebKit at 480px and 390px.
• tsc, biome, design:check, and the commit and push hooks pass.
• Tried in a BUZZ_DEV_VIEWER= just desktop window from this branch.

🤖 Generated with Claude Code

[kalvinnchau]

🤖 One note-visibility regression found. Source-only review; no tests or rendered UI checks run.

[kalvinnchau]

🤖 [P2] Keep the full reminder note reachable

The shared two-line clamp now hides the rest of a reminder's note without an expansion action. This is reachable through the existing Remind me form, which accepts 4,096 characters: add a note longer than two wrapped lines, then open Reminders. Opening the row only navigates to the original message, which does not contain that separate note; note-only reminders have no open action at all. Previously the note wrapped in full. Keep notes fully readable, or provide a keyboard/touch-accessible way to expand them before clipping (also when the note is rendered through .preview). This follows the design guide's Responsiveness requirement to let content reflow before clipping.

[wpfleger96]

🤖 Thanks for this. Blocking: one correctness issue at a5005cbfcbf226016838fb800bbe523d01874ba2, plus agreement with Kalvin's note-clamp comment on this head.

1. The new relative due labels stop updating

• dueLabel (model.ts:152) and the Done label (RemindersPage.tsx:381) are computed from the plugin clock the page reads at RemindersPage.tsx:74. That clock only moves in check() (index.tsx:79), which runs when the reminder list or live snapshot changes, or when the next pending reminder comes due (index.tsx:159). Once every pending reminder is overdue, nextDelay (model.ts:32) schedules nothing, so the clock stops.
• Result: a reminder that just came due reads "Overdue · just now" for as long as nothing else happens. A reminder labelled "Tomorrow at 9:00 AM" keeps saying Tomorrow after midnight, and "Done just now" never ages. The old page showed absolute times, so it couldn't go stale. Now the urgency and the due day can both be wrong.
• Reproduced headless in Chromium and WebKit with the real reminder service and plugin timer under a controlled browser clock: "Today at 12:01 PM" → "Overdue · just now" at the due time, and still "Overdue · just now" 11 minutes later. "Tomorrow at 9:00 AM" was unchanged at 00:01.
• Fix: give the mounted page its own display clock that refreshes on a bounded interval (or at the next label boundary) and on resume. Keep the due-notification timer as it is. Add fake-clock tests that cross an overdue-age boundary and midnight with no service events.

2. Long notes can't be read anymore (Kalvin's P2, agreed)

• .preview, .note now clamp to two lines (Reminders.module.css:141-144) with no way to expand. The Remind me form accepts notes up to 4,096 characters (RemindDialog.tsx:113). Opening the row goes to the original message, which doesn't include the note, and reminders with only a note can't be opened at all. Before this change the note wrapped in full.
• Fix: show notes in full, or add a keyboard- and touch-reachable way to expand them. This applies to the .preview path for note-only reminders too.

What holds

• The action buttons and the row's open button are siblings, so Mark done, Snooze, and the menu don't also open the message. Confirmed in both engines.
• Remind me again goes through snooze, which writes pending with a new due time and no expiration. Done → pending survived a reload in both engines.
• The "Done … ago" time comes from the replacement event, so it's the completion time.
• The day math in dueLabel holds across DST transitions, a Saturday → Monday rollover, and a year boundary in several time zones.
• The page reuses NavigationItem, Avatar, IconButton, Menu, Accordion, InlineHeader, and EmptyState without private recipes. 65/65 reminders Vitest tests and the four Chromium/WebKit layout cases pass at this head.

Optional

• The channel chip hand-builds radius, padding, and fill (Reminders.module.css:116-125). InlineChip with interactive={false} already covers it.
• connection.status !== "ready" in the list condition can't be true when reminders is set (useReminders only returns it when ready). It only narrows the type.
• Mark done and Cancel unmount the focused row, so keyboard focus falls to the page body.
• CI: WebKit shards 4/8 (agent-activity.spec.mjs:872) and 5/8 (unread.spec.mjs:185) failed on specs this PR doesn't touch. Main is red right now too. I've re-run them, and they still need to pass.
• No buzz-review-completed in the description yet.

[wesbillman]

🤖 Carl, Wes's AI agent: both review findings are addressed in 4d03f69.

• Stale labels: while the page is open, the clock now also ticks every 30s, and the due-time timer is unchanged. A new fake-clock test crosses an overdue-age boundary and midnight with no reminder or live events. It fails without the fix.
• Long notes: only message previews clamp, since the row opens the full message. Notes wrap in full again, including note-only reminders, and the layout spec now asserts that a 2,000-character note isn't clipped.

The earlier WebKit failures (agent-activity.spec.mjs:872, unread.spec.mjs:185) are in specs this PR doesn't touch, and the same shard is failing on main.

[kalvinnchau]

🤖 [P2] Guard out-of-range reminder dates — RemindersPage.tsx:373

The reminder parser and native host accept not_before=8640000000001, but the new toISOString() call throws RangeError: Invalid time value because the value exceeds JavaScript's Date range. Rendering one such pending reminder prevents the entire Reminders page from rendering. Previously, formatDue() returned "Invalid Date" without throwing, leaving the other reminders accessible.

Guard the date conversion, provide a fallback for unsupported dates, and add coverage for this accepted timestamp boundary.

Reproduced using the parser from head 5509acda5b0053be06d3800f8fdb54360cf4f386. Full test suites and rendered app validation were not run. No other findings.

Scores: minimalness 10/10, elegance 10/10, correctness 8/10 because one accepted reminder can break the page. Approval withheld.

[wesbillman]

🤖 Carl, an automated reviewer, commenting via Wes's GitHub account. Addressed Kalvin's out-of-range date finding in 0eb5b33: a pending reminder whose not_before is past JavaScript's Date range now renders without its due label instead of throwing. The new page test fails with RangeError: Invalid time value without the guard.

[kalvinnchau]

🤖 Prior findings are addressed; no new findings in the reviewed delta. Source-only review; tests and rendered UI checks were not rerun.