Date separators in the message list #294

Closed
opened 2026-10-07 20:43:08 -04:00 by Salastil · 1 comment
Owner

Nothing draws a date line. The list only inserts the "New" divider and history gap (MessageList.tsx:716-733), and formatTime returns HH:MM only (lib/util.ts:287-290), so scrollback from different days looks identical.

Discord, Slack and Element draw a centred date line where the day changes ("Today", "Yesterday", "March 3, 2026").

Fix: insert separators in the same pass as the New divider; also in the thread panel and search results. Unit-tested.

Part of the v1.0 UI pass.

Nothing draws a date line. The list only inserts the "New" divider and history gap (MessageList.tsx:716-733), and `formatTime` returns `HH:MM` only (lib/util.ts:287-290), so scrollback from different days looks identical. Discord, Slack and Element draw a centred date line where the day changes ("Today", "Yesterday", "March 3, 2026"). **Fix:** insert separators in the same pass as the New divider; also in the thread panel and search results. Unit-tested. _Part of the v1.0 UI pass._
Salastil added this to the v1.0 milestone 2026-10-07 20:43:08 -04:00
Salastil added the feature label 2026-10-07 20:43:08 -04:00
Author
Owner

Finished: b2464e4.

Before (top) and after (bottom), from scripts/ui-shots.mjs - three days of history in a test channel:

date separators

A centred line says Today, Yesterday or the full date ("October 5, 2026") where the day changes, and on the first line drawn so the top of the screen always has a day. Days are compared by the clock on the wall (23:59 and 00:01 are different days, not 24 hours apart), and a line with no time of its own (a local notice) neither starts nor ends a day. The "New" marker still sits under it. Covered by unit tests in lib/util.test.ts.

Not done here: the thread panel and search results do not get separators yet - the thread panel is being reworked in #310.

Finished: [b2464e4](https://git.salastil.com/Salastil/moho/commit/b2464e4b3a775d0c13b8bd6170126c43ba555dd2). Before (top) and after (bottom), from `scripts/ui-shots.mjs` - three days of history in a test channel: ![date separators](https://git.salastil.com/attachments/dfd524c1-2379-4956-9f1b-69917f55b03c) A centred line says **Today**, **Yesterday** or the full date ("October 5, 2026") where the day changes, and on the first line drawn so the top of the screen always has a day. Days are compared by the clock on the wall (23:59 and 00:01 are different days, not 24 hours apart), and a line with no time of its own (a local notice) neither starts nor ends a day. The "New" marker still sits under it. Covered by unit tests in `lib/util.test.ts`. Not done here: the thread panel and search results do not get separators yet - the thread panel is being reworked in #310.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Salastil/moho#294