Do not store Date objects in redux store.

src/modules/room/RoomChatMessageList.tsx

@@ -1,6 +1,6 @@
 import { FC } from "react";
 
-import { RoomMessage } from "modules/room/slice";
+import { RoomMessage, Timestamp, timestampToDate } from "modules/room/slice";
 
 interface Props {
   loginUserName: string;
@@ -11,12 +11,12 @@ const kCommonChildClass = "py-1 max-w-3/4 flex flex-col";
 
 const kCommonMessageClass = "px-3 py-1 rounded-xl";
 
-function formatReceivedAt(receivedAt: Date | null): string {
+function formatReceivedAt(receivedAt: Timestamp | null): string {
   if (receivedAt === null) {
     return "sending...";
   }
 
-  return receivedAt.toLocaleTimeString();
+  return timestampToDate(receivedAt).toLocaleTimeString();
 }
 
 const RoomChatMessageList: FC<Props> = ({ loginUserName, messages }) => {

src/modules/room/message.ts

@@ -32,24 +32,13 @@ function convertMembership(membership: string): RoomMembership {
   }
 }
 
-interface SystemTime {
-  secs_since_epoch: number;
-  nanos_since_epoch: number;
-}
-
-function convertDate(time: SystemTime): Date {
-  return new Date(
-    time.secs_since_epoch * 1000 + time.nanos_since_epoch / 1000000
-  );
-}
-
 function convertMessages(messages: any[]): RoomMessage[] {
   const result = [];
   for (const message of messages) {
     result.push({
       userName: message.user_name,
       message: message.message,
-      receivedAt: convertDate(message.received_at),
+      receivedAt: message.received_at,
       acked: true,
     });
   }
@@ -93,7 +82,7 @@ function handleRoomMessageResponse(dispatch: AppDispatch, response: any): void {
       message: {
         userName: response.message.user_name,
         message: response.message.message,
-        receivedAt: convertDate(response.message.received_at),
+        receivedAt: response.message.received_at,
       },
     })
   );

src/modules/room/slice.ts

@@ -12,6 +12,15 @@ export enum RoomMembership {
   Left,
 }
 
+export interface Timestamp {
+  secs_since_epoch: number;
+  nanos_since_epoch: number;
+}
+
+export function timestampToDate(t: Timestamp): Date {
+  return new Date(t.secs_since_epoch * 1000 + t.nanos_since_epoch / 1000000);
+}
+
 // A message sent to a chat room.
 export interface RoomMessage {
   // The sender's name.
@@ -21,7 +30,7 @@ export interface RoomMessage {
   message: string;
 
   // The time at which this message was received. `null` if unacked.
-  receivedAt: Date | null;
+  receivedAt: Timestamp | null;
 }
 
 // Attempts to ack `existing` upon receival of `received`.