Support timezones (#11434)

* Handle offset timezones

* Fix previews loading

* Cleanup

* remove unused

web/src/utils/dateUtil.ts

@@ -235,7 +235,10 @@ export const getDurationFromTimestamps = (
  * @param timezone string representation of the timezone the user is requesting
  * @returns number of minutes offset from UTC
  */
-export const getUTCOffset = (date: Date, timezone: string): number => {
+export const getUTCOffset = (
+  date: Date,
+  timezone: string = getResolvedTimeZone(),
+): number => {
   // If timezone is in UTC±HH:MM format, parse it to get offset
   const utcOffsetMatch = timezone.match(/^UTC([+-])(\d{2}):(\d{2})$/);
   if (utcOffsetMatch) {
@@ -259,10 +262,10 @@ export const getUTCOffset = (date: Date, timezone: string): number => {
     target = new Date(`${iso}+000`);
   }
 
-  return (
+  return Math.round(
     (target.getTime() - utcDate.getTime() - date.getTimezoneOffset()) /
-    60 /
-    1000
+      60 /
+      1000,
   );
 };
 

web/src/utils/timelineUtil.tsx

@@ -20,7 +20,7 @@ import {
   MdOutlinePictureInPictureAlt,
 } from "react-icons/md";
 import { FaBicycle } from "react-icons/fa";
-import { endOfHourOrCurrentTime } from "./dateUtil";
+import { endOfHourOrCurrentTime, getUTCOffset } from "./dateUtil";
 import { TimeRange, Timeline } from "@/types/timeline";
 
 export function getTimelineIcon(timelineItem: Timeline) {
@@ -131,12 +131,25 @@ export function getChunkedTimeDay(timeRange: TimeRange): TimeRange[] {
   endOfThisHour.setSeconds(0, 0);
   const data: TimeRange[] = [];
   const startDay = new Date(timeRange.after * 1000);
-  startDay.setMinutes(0, 0, 0);
+  const timezoneMinuteOffset =
+    getUTCOffset(new Date(timeRange.before * 1000)) % 60;
+
+  if (timezoneMinuteOffset == 0) {
+    startDay.setMinutes(0, 0, 0);
+  } else {
+    startDay.setSeconds(0, 0);
+  }
+
   let start = startDay.getTime() / 1000;
   let end = 0;
 
   for (let i = 0; i < 24; i++) {
-    startDay.setHours(startDay.getHours() + 1, 0, 0, 0);
+    startDay.setHours(
+      startDay.getHours() + 1,
+      Math.abs(timezoneMinuteOffset),
+      0,
+      0,
+    );
 
     if (startDay > endOfThisHour) {
       break;