diff --git a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
index 4100202b..42eb8f7a 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
@@ -6,7 +6,7 @@ import Link from 'next/link';
import Icons from 'components/icons';
export function EventsTable({ data = [] }) {
- const { formatDate } = useTimezone();
+ const { formatTimezoneDate } = useTimezone();
const { formatMessage, labels } = useMessages();
const { renderTeamUrl } = useTeamUrl();
@@ -35,7 +35,7 @@ export function EventsTable({ data = [] }) {
}}
- {row => formatDate(row.createdAt, 'PPPpp')}
+ {row => formatTimezoneDate(row.createdAt, 'PPPpp')}
);
diff --git a/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx b/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx
index 8bae2c17..98b7a924 100644
--- a/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx
+++ b/src/app/(main)/websites/[websiteId]/realtime/RealtimeLog.tsx
@@ -31,7 +31,7 @@ export function RealtimeLog({ data }: { data: RealtimeData }) {
const { formatMessage, labels, messages, FormattedMessage } = useMessages();
const { formatValue } = useFormat();
const { locale } = useLocale();
- const { formatDate } = useTimezone();
+ const { formatTimezoneDate } = useTimezone();
const { countryNames } = useCountryNames(locale);
const [filter, setFilter] = useState(TYPE_ALL);
@@ -54,7 +54,7 @@ export function RealtimeLog({ data }: { data: RealtimeData }) {
},
];
- const getTime = ({ createdAt, firstAt }) => formatDate(firstAt || createdAt, 'h:mm:ss');
+ const getTime = ({ createdAt, firstAt }) => formatTimezoneDate(firstAt || createdAt, 'h:mm:ss');
const getColor = ({ id, sessionId }) => stringToColor(sessionId || id);
diff --git a/src/app/(main)/websites/[websiteId]/sessions/SessionsTable.tsx b/src/app/(main)/websites/[websiteId]/sessions/SessionsTable.tsx
index e2668856..3fea4836 100644
--- a/src/app/(main)/websites/[websiteId]/sessions/SessionsTable.tsx
+++ b/src/app/(main)/websites/[websiteId]/sessions/SessionsTable.tsx
@@ -6,7 +6,7 @@ import styles from './SessionsTable.module.css';
import TypeIcon from 'components/common/TypeIcon';
export function SessionsTable({ data = [] }: { data: any[]; showDomain?: boolean }) {
- const { formatDate } = useTimezone();
+ const { formatTimezoneDate } = useTimezone();
const { formatMessage, labels } = useMessages();
const { formatValue } = useFormat();
@@ -51,7 +51,7 @@ export function SessionsTable({ data = [] }: { data: any[]; showDomain?: boolean
)}
- {row => formatDate(row.createdAt, 'PPPpp')}
+ {row => formatTimezoneDate(row.createdAt, 'PPPpp')}
);
diff --git a/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionActivity.tsx b/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionActivity.tsx
index 187205e9..fd498ac3 100644
--- a/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionActivity.tsx
+++ b/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionActivity.tsx
@@ -15,7 +15,7 @@ export function SessionActivity({
startDate: Date;
endDate: Date;
}) {
- const { formatDate } = useTimezone();
+ const { formatTimezoneDate } = useTimezone();
const { data, isLoading } = useSessionActivity(websiteId, sessionId, startDate, endDate);
if (isLoading) {
@@ -33,12 +33,12 @@ export function SessionActivity({
return (
<>
{showHeader && (
-
{formatDate(createdAt, 'EEEE, PPP')}
+ {formatTimezoneDate(createdAt, 'EEEE, PPP')}
)}
- {formatDate(createdAt, 'h:mm:ss aaa')}
+ {formatTimezoneDate(createdAt, 'h:mm:ss aaa')}
{eventName ? : }
diff --git a/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx b/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx
index 641d2941..6f9a8f3d 100644
--- a/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx
+++ b/src/app/(main)/websites/[websiteId]/sessions/[sessionId]/SessionInfo.tsx
@@ -6,7 +6,7 @@ import styles from './SessionInfo.module.css';
export default function SessionInfo({ data }) {
const { locale } = useLocale();
- const { formatDate } = useTimezone();
+ const { formatTimezoneDate } = useTimezone();
const { formatMessage, labels } = useMessages();
const { formatValue } = useFormat();
const { getRegionName } = useRegionNames(locale);
@@ -20,10 +20,10 @@ export default function SessionInfo({ data }) {
{formatMessage(labels.lastSeen)}
-
{formatDate(data?.lastAt, 'EEEE, PPPpp')}
+
{formatTimezoneDate(data?.lastAt, 'EEEE, PPPpp')}
{formatMessage(labels.firstSeen)}
-
{formatDate(data?.firstAt, 'EEEE, PPPpp')}
+
{formatTimezoneDate(data?.firstAt, 'EEEE, PPPpp')}
{formatMessage(labels.country)}
diff --git a/src/components/hooks/useTimezone.ts b/src/components/hooks/useTimezone.ts
index 24cef02c..d06562a2 100644
--- a/src/components/hooks/useTimezone.ts
+++ b/src/components/hooks/useTimezone.ts
@@ -13,13 +13,15 @@ export function useTimezone() {
setTimezone(value);
};
- const formatDate = (date: string, pattern: string) => {
- return formatInTimeZone(
- /^[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}:[0-9]{2}Z$/.test(date)
- ? date
- : date.split(' ').join('T') + 'Z',
- timezone,
- pattern,
+ const formatTimezoneDate = (date: string, pattern: string) => {
+ return (
+ formatInTimeZone(
+ /^[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}:[0-9]{2}(\.[0-9]{3})?Z$/.test(date)
+ ? date
+ : date.split(' ').join('T') + 'Z',
+ timezone,
+ pattern,
+ ) + `, ${date}, ${pattern}, ${timezone}, ${formatInTimeZone(date, timezone, pattern)}`
);
};
@@ -31,7 +33,7 @@ export function useTimezone() {
return utcToZonedTime(date, timezone);
};
- return { timezone, saveTimezone, formatDate, toUtc, fromUtc };
+ return { timezone, saveTimezone, formatTimezoneDate, toUtc, fromUtc };
}
export default useTimezone;