From ef6e28052487ebccf235a5fc891b3a8da3a51b4f Mon Sep 17 00:00:00 2001 From: gosangam Date: Tue, 9 Jun 2026 00:39:12 +0530 Subject: [PATCH] fix: sync sadhna calendar with local timezone --- components/sadhna/streak-calendar.tsx | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/components/sadhna/streak-calendar.tsx b/components/sadhna/streak-calendar.tsx index 7f27d75c..087627f8 100644 --- a/components/sadhna/streak-calendar.tsx +++ b/components/sadhna/streak-calendar.tsx @@ -11,8 +11,8 @@ * * Streak counters come from the dashboard payload; the grid itself is fed by * the /sadhna/history range endpoint, fetched per visible period and cached - * so paging back to a period you've seen is instant. Everything is bucketed - * by UTC calendar day to match the backend. + * so paging back to a period you've seen is instant. "Today" is the browser's + * local date, matching the backend's local-timezone day boundary. */ import { useEffect, useMemo, useRef, useState } from "react"; @@ -26,19 +26,24 @@ const WEEKDAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]; type View = "week" | "month"; -// ── UTC date helpers (operate on epoch-ms at UTC midnight) ── +// Each calendar day is represented as the UTC-midnight epoch-ms of that date +// (so the date string and all arithmetic stay tz-free and internally +// consistent). "Today", however, is anchored to the browser's LOCAL date so +// the day boundary matches the backend's local-timezone day reset. function ymd(ms: number): string { return new Date(ms).toISOString().slice(0, 10); } -function startOfDayUTC(d: Date): number { - return Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate()); +// UTC-midnight ms whose calendar date is the browser's local today. +function localTodayMs(): number { + const d = new Date(); + return Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()); } function startOfWeek(ms: number): number { return ms - new Date(ms).getUTCDay() * DAY; } export function StreakCalendar({ dash }: { dash: SadhnaDashboard | null }) { - const todayMs = startOfDayUTC(new Date()); + const todayMs = localTodayMs(); const todayStr = ymd(todayMs); const [view, setView] = useState("week");