diff --git a/frontend/src/components/Topics/Topic/Messages/Message.tsx b/frontend/src/components/Topics/Topic/Messages/Message.tsx index 611385d83..6dfd5279f 100644 --- a/frontend/src/components/Topics/Topic/Messages/Message.tsx +++ b/frontend/src/components/Topics/Topic/Messages/Message.tsx @@ -110,7 +110,11 @@ const Message: React.FC = ({ {partition}
- {formatTimestamp({ timestamp, timezone: currentTimezone.value })} + {formatTimestamp({ + timestamp, + timezone: currentTimezone.value, + withMilliseconds: true, + })}
diff --git a/frontend/src/components/Topics/Topic/Messages/MessageContent/MessageContent.tsx b/frontend/src/components/Topics/Topic/Messages/MessageContent/MessageContent.tsx index 96eba6db3..45f9e1127 100644 --- a/frontend/src/components/Topics/Topic/Messages/MessageContent/MessageContent.tsx +++ b/frontend/src/components/Topics/Topic/Messages/MessageContent/MessageContent.tsx @@ -110,6 +110,7 @@ const MessageContent: React.FC = ({ {formatTimestamp({ timestamp, timezone: currentTimezone.value, + withMilliseconds: true, })} Timestamp type: {timestampType} diff --git a/frontend/src/components/Topics/Topic/Messages/__test__/Message.spec.tsx b/frontend/src/components/Topics/Topic/Messages/__test__/Message.spec.tsx index a82ccfbc8..d9c94513f 100644 --- a/frontend/src/components/Topics/Topic/Messages/__test__/Message.spec.tsx +++ b/frontend/src/components/Topics/Topic/Messages/__test__/Message.spec.tsx @@ -65,7 +65,12 @@ describe('Message component', () => { expect(screen.getByText(mockMessage.value as string)).toBeInTheDocument(); expect(screen.getByText(mockMessage.key as string)).toBeInTheDocument(); expect( - screen.getByText(formatTimestamp({ timestamp: mockMessage.timestamp })) + screen.getByText( + formatTimestamp({ + timestamp: mockMessage.timestamp, + withMilliseconds: true, + }) + ) ).toBeInTheDocument(); expect(screen.getByText(mockMessage.offset.toString())).toBeInTheDocument(); expect( diff --git a/frontend/src/lib/dateTimeHelpers.ts b/frontend/src/lib/dateTimeHelpers.ts index 1b2387324..52caa08ba 100644 --- a/frontend/src/lib/dateTimeHelpers.ts +++ b/frontend/src/lib/dateTimeHelpers.ts @@ -4,10 +4,12 @@ export const formatTimestamp = ({ timestamp, format = { hourCycle: 'h23' }, timezone, + withMilliseconds, }: { timestamp: number | string | Date | undefined; format?: Intl.DateTimeFormatOptions; timezone?: string; + withMilliseconds?: boolean; }): string => { if (!timestamp) { return ''; @@ -29,7 +31,13 @@ export const formatTimestamp = ({ timeZone: finalTimezone, }; - return date.toLocaleString(language || [], formatOptions); + let formattedTimestamp = date.toLocaleString(language || [], formatOptions); + + if (withMilliseconds) { + formattedTimestamp += `.${date.getMilliseconds()}`; + } + + return formattedTimestamp; }; export const formatMilliseconds = (input = 0) => {