v3: chatbox improvements (typing indicators, answer to previous messages, backlog days separators, scroll to last message position, visual tweaks)

api/model/db.ts

@@ -313,6 +313,12 @@ export interface ChatMessageRow {
   updated_at: string | null;
   author_username: string;
   author_avatar_mime: string | null;
+  // Reply columns: reply_to_id is the stored target; the author/body preview are
+  // LEFT-JOINed from the target and go null when there's no reply (or it was
+  // since deleted).
+  reply_to_id: string | null;
+  reply_to_author: string | null;
+  reply_to_body: string | null;
   [key: string]: SQLOutputValue;
 }
 
@@ -327,7 +333,13 @@ export function isChatMessageRow(obj: unknown): obj is ChatMessageRow {
     "author_username" in obj && typeof obj.author_username === "string" &&
     "author_avatar_mime" in obj &&
     (typeof obj.author_avatar_mime === "string" ||
-      obj.author_avatar_mime === null);
+      obj.author_avatar_mime === null) &&
+    "reply_to_id" in obj &&
+    (typeof obj.reply_to_id === "string" || obj.reply_to_id === null) &&
+    "reply_to_author" in obj &&
+    (typeof obj.reply_to_author === "string" || obj.reply_to_author === null) &&
+    "reply_to_body" in obj &&
+    (typeof obj.reply_to_body === "string" || obj.reply_to_body === null);
 }
 
 export function chatMessageRowToApi(row: ChatMessageRow): ChatMessage {
@@ -339,6 +351,9 @@ export function chatMessageRowToApi(row: ChatMessageRow): ChatMessage {
     updatedAt: row.updated_at ? new Date(row.updated_at) : undefined,
     authorUsername: row.author_username,
     authorAvatarMime: row.author_avatar_mime ?? undefined,
+    replyToId: row.reply_to_id ?? undefined,
+    replyToAuthor: row.reply_to_author ?? undefined,
+    replyToBody: row.reply_to_body ?? undefined,
   };
 }
 

api/model/interfaces.ts

@@ -321,6 +321,13 @@ export interface ChatMessage {
   updatedAt?: Date;
   authorUsername: string;
   authorAvatarMime?: string;
+  /** Id of the message this one replies to, if any. Retained even when the
+   * target is later deleted (the preview fields below then go undefined). */
+  replyToId?: string;
+  /** Author/snippet of the replied-to message, for a subtle inline reference.
+   * Absent when there's no reply, or the target has since been deleted. */
+  replyToAuthor?: string;
+  replyToBody?: string;
 }
 
 /** Wire format — createdAt arrives as an ISO string over JSON. */
@@ -554,6 +561,15 @@ export interface CommentLikeRemoveMessage {
 export interface ChatSendMessage {
   type: "chat_send";
   body: string;
+  /** Id of the message being replied to, if this is a reply. */
+  replyToId?: string;
+}
+
+// Sent while the user is composing (true) and when they stop (false). The
+// server rebroadcasts the live set of typers to everyone as ChatTypingUpdate.
+export interface ChatTypingMessage {
+  type: "chat_typing";
+  typing: boolean;
 }
 
 // Tells the server whether this client currently has the chatbox open, so that
@@ -582,6 +598,7 @@ export type ClientToServerMessage =
   | CommentLikeCastMessage
   | CommentLikeRemoveMessage
   | ChatSendMessage
+  | ChatTypingMessage
   | ChatFocusMessage
   | ChatEditMessage
   | ChatDeleteMessage;
@@ -730,6 +747,13 @@ export interface ChatMessageDeletedMessage {
   id: string;
 }
 
+// The current set of users composing a chat message. Reuses OnlineUser so the
+// client can render the same avatars as the presence row.
+export interface ChatTypingUpdateMessage {
+  type: "chat_typing_update";
+  users: OnlineUser[];
+}
+
 export type ServerToClientMessage =
   | PingMessage
   | WelcomeMessage
@@ -754,7 +778,8 @@ export type ServerToClientMessage =
   | ForceLogoutMessage
   | ChatMessageMessage
   | ChatMessageUpdatedMessage
-  | ChatMessageDeletedMessage;
+  | ChatMessageDeletedMessage
+  | ChatTypingUpdateMessage;
 
 /**
  * Follows