diff --git a/src/components/ChatMessage.tsx b/src/components/ChatMessage.tsx index c6f5dd9..17ade50 100644 --- a/src/components/ChatMessage.tsx +++ b/src/components/ChatMessage.tsx @@ -1,19 +1,27 @@ import { Box, Typography, useMediaQuery, useTheme } from "@mui/material"; +import { isDateToday } from "@root/utils/date"; interface Props { unAuthenticated?: boolean; isSelf: boolean; text: string; - time: string; + createdAt: string; } -export default function ChatMessage({ unAuthenticated = false, isSelf, text, time }: Props) { +export default function ChatMessage({ unAuthenticated = false, isSelf, text, createdAt }: Props) { const theme = useTheme(); const upMd = useMediaQuery(theme.breakpoints.up("md")); const messageBackgroundColor = isSelf ? "white" : unAuthenticated ? "#EFF0F5" : theme.palette.grey2.main; + const date = new Date(createdAt); + const time = date.toLocaleString([], { + hour: "2-digit", + minute: "2-digit", + ...(!isDateToday(date) && { year: "2-digit", month: "2-digit", day: "2-digit" }) + }); + return ( {time} ))} diff --git a/src/pages/Support/SupportChat.tsx b/src/pages/Support/SupportChat.tsx index 5583ffd..dffa819 100644 --- a/src/pages/Support/SupportChat.tsx +++ b/src/pages/Support/SupportChat.tsx @@ -250,7 +250,7 @@ export default function SupportChat() { ))} diff --git a/src/utils/date.ts b/src/utils/date.ts new file mode 100644 index 0000000..844654a --- /dev/null +++ b/src/utils/date.ts @@ -0,0 +1,7 @@ + + +export function isDateToday(date: Date): boolean { + const today = new Date(); + today.setHours(0, 0, 0, 0); + return date.getTime() > today.getTime(); +} \ No newline at end of file