Merge pull request #341 from Hexastack/336-bug-time-formatting-breaks-after-sending-a-new-message-in-the-inbox

fix(frontend): date normalization

frontend/src/components/inbox/components/Chat.tsx

@@ -22,6 +22,7 @@ import { useAuth } from "@/hooks/useAuth";
 import { useConfig } from "@/hooks/useConfig";
 import { useTranslate } from "@/hooks/useTranslate";
 import { EntityType } from "@/services/types";
+import { normalizeDate } from "@/utils/date";
 
 import {
   getAvatarSrc,
@@ -115,8 +116,9 @@ export function Chat() {
                           key={message.id}
                           title={`${subscriber.first_name} ${
                             subscriber.last_name
-                          } : ${message.createdAt.toLocaleString(
+                          } : ${normalizeDate(
                             i18n.language,
+                            message.createdAt,
                           )}`}
                           src={getAvatarSrc(
                             apiUrl,

frontend/src/components/inbox/components/ConversationsList.tsx

@@ -20,6 +20,7 @@ import { useConfig } from "@/hooks/useConfig";
 import { useTranslate } from "@/hooks/useTranslate";
 import { Title } from "@/layout/content/Title";
 import { EntityType, RouterType } from "@/services/types";
+import { normalizeDate } from "@/utils/date";
 import { extractQueryParamsUrl } from "@/utils/URL";
 
 import { getAvatarSrc } from "../helpers/mapMessages";
@@ -82,7 +83,7 @@ export const SubscribersList = (props: {
                   {subscriber.first_name} {subscriber.last_name}
                 </div>
                 <div className="cs-conversation__info">
-                  {subscriber.lastvisit?.toLocaleString(i18n.language)}
+                  {normalizeDate(i18n.language, subscriber.lastvisit)}
                 </div>
               </Conversation.Content>
               <Conversation.Operations visible>

frontend/src/utils/date.ts

@@ -14,3 +14,25 @@ export const getDateTimeFormatter = (date: Date) => ({
     val: DATE_TIME_FORMAT,
   },
 });
+
+/**
+ * Normalizes and formats a date using the provided locale
+ *
+ * @param {string} locale - The locale to use for formatting (e.g., 'en-US', 'fr-FR')
+ * @param {Date | string} dateField - The date to format, either as Date object or string
+ * @param {Intl.DateTimeFormatOptions} options - An object that contains one or more properties that specify comparison options
+ * @returns {string | undefined} Formatted date string, or undefined if dateField is undefined
+ */
+export const normalizeDate = (
+  locale: string = "en-US",
+  dateField?: Date | string,
+  options?: Intl.DateTimeFormatOptions,
+) => {
+  if (!dateField) return undefined;
+
+  const date = typeof dateField === "string" ? new Date(dateField) : dateField;
+
+  return !isNaN(date.getTime())
+    ? date.toLocaleString(locale, options)
+    : undefined;
+};