@agent-native/core 0.159.3 → 0.160.0

package/corpus/templates/calendar/app/pages/CalendarView.tsx

@@ -18,8 +18,6 @@ import {
 import { useQueryClient } from "@tanstack/react-query";
 import {
   format,
-  startOfMonth,
-  endOfMonth,
   startOfWeek,
   endOfWeek,
   addMonths,
@@ -28,8 +26,6 @@ import {
   subWeeks,
   addDays,
   subDays,
-  parseISO,
-  startOfDay,
 } from "date-fns";
 import { useState, useMemo, useEffect, useCallback, useRef } from "react";
 import { Link } from "react-router";
@@ -48,6 +44,7 @@ import {
 } from "@/components/calendar/GuestNotificationDialog";
 import { MonthView } from "@/components/calendar/MonthView";
 import { PeopleSearchDialog } from "@/components/calendar/PeopleSearchDialog";
+import { TimezoneSwitchDialog } from "@/components/calendar/TimezoneSwitchDialog";
 import { WeekView } from "@/components/calendar/WeekView";
 import { useCalendarContext } from "@/components/layout/AppLayout";
 import type { ViewMode } from "@/components/layout/AppLayout";
@@ -81,9 +78,26 @@ import { useGoogleAuthStatus } from "@/hooks/use-google-auth";
 import { useMeetingStartNotifications } from "@/hooks/use-meeting-start-notifications";
 import { useIsMobile } from "@/hooks/use-mobile";
 import { useOverlayPeople } from "@/hooks/use-overlay-people";
-import { useSettings } from "@/hooks/use-settings";
+import { useSettings, useUpdateSettings } from "@/hooks/use-settings";
 import { setUndoAction, runUndo } from "@/hooks/use-undo";
 import { useViewPreferences } from "@/hooks/use-view-preferences";
+import {
+  buildWorkingLocationDraft,
+  resolveDraftWorkingLocation,
+} from "@/lib/calendar-drafts";
+import {
+  addCalendarDays,
+  dateKeyToDate,
+  dateKeyToTimezoneIso,
+  dateToCalendarDateKey,
+  eventOverlapsCalendarDay,
+  getBrowserTimezone,
+  getDateKeyInTimezone,
+  getEventDateKey,
+  getViewDateRange,
+  moveEventToCalendarDate,
+  normalizeTimezone,
+} from "@/lib/calendar-timezone";
 import { resolveEventAccountEmail } from "@/lib/event-account-selection";
 import { getGoogleEventColorHex } from "@/lib/event-colors";
 import {
@@ -97,8 +111,19 @@ import { buildDeleteEventMutationInput } from "@/lib/event-mutation-inputs";
 import { getLocationSuggestions } from "@/lib/location-suggestions";
 import { isMcpEmbedSurface } from "@/lib/mcp-embed";
 import { cn } from "@/lib/utils";
+import {
+  buildWorkingLocationProperties,
+  findOwnedWorkingLocationForDay,
+} from "@/lib/working-location";
 
 const CALENDAR_DRAFT_EVENT_PREFIX = "calendar-draft-event:";
+const TIMEZONE_DISMISSAL_PREFIX = "calendar.timezone.dismissed.";
+
+function timezoneDismissalKey(savedTimezone: string, browserTimezone: string) {
+  return `${TIMEZONE_DISMISSAL_PREFIX}${encodeURIComponent(
+    savedTimezone,
+  )}:${encodeURIComponent(browserTimezone)}`;
+}
 
 type DraftEventPatch = Partial<CalendarEvent> & {
   fullDay?: boolean;
@@ -176,6 +201,14 @@ function draftRange(draft: CalendarEventDraft, fallbackDate: Date) {
   const fallback = fallbackDraftRange(fallbackDate);
   const fullDayTimezone = draft.startTimeZone ?? draft.endTimeZone;
   const fullDayDatePattern = /^\d{4}-\d{2}-\d{2}$/;
+  const dateOnlyAllDay =
+    draft.allDay === true &&
+    Boolean(
+      draft.start &&
+      draft.end &&
+      fullDayDatePattern.test(draft.start) &&
+      fullDayDatePattern.test(draft.end),
+    );
   const semanticFullDay =
     draft.eventType === "outOfOffice" &&
     draft.fullDay &&
@@ -184,18 +217,24 @@ function draftRange(draft: CalendarEventDraft, fallbackDate: Date) {
     draft.end &&
     fullDayDatePattern.test(draft.start) &&
     fullDayDatePattern.test(draft.end);
-  const start = semanticFullDay
-    ? new Date(dateTimeInTimezoneToIso(draft.start!, "00:00", fullDayTimezone!))
-    : (parseValidDate(draft.start) ?? fallback.start);
-  const parsedEnd = semanticFullDay
-    ? new Date(
-        dateTimeInTimezoneToIso(
-          format(addDays(parseISO(draft.end!), 1), "yyyy-MM-dd"),
-          "00:00",
-          fullDayTimezone!,
-        ),
-      )
-    : parseValidDate(draft.end);
+  const start = dateOnlyAllDay
+    ? dateKeyToDate(draft.start!)
+    : semanticFullDay
+      ? new Date(
+          dateTimeInTimezoneToIso(draft.start!, "00:00", fullDayTimezone!),
+        )
+      : (parseValidDate(draft.start) ?? fallback.start);
+  const parsedEnd = dateOnlyAllDay
+    ? dateKeyToDate(draft.end!)
+    : semanticFullDay
+      ? new Date(
+          dateTimeInTimezoneToIso(
+            addCalendarDays(draft.end!, 1),
+            "00:00",
+            fullDayTimezone!,
+          ),
+        )
+      : parseValidDate(draft.end);
   const end =
     parsedEnd && parsedEnd.getTime() > start.getTime()
       ? parsedEnd
@@ -209,24 +248,37 @@ function draftToCalendarEvent(
 ): CalendarEvent {
   const { start, end } = draftRange(draft, fallbackDate);
   const editableTitle = draft.title?.trim() ?? "";
+  const allDay =
+    draft.eventType === "outOfOffice" && draft.fullDay
+      ? false
+      : (draft.allDay ?? false);
+  const dateOnlyAllDay =
+    allDay &&
+    Boolean(
+      draft.start &&
+      draft.end &&
+      /^\d{4}-\d{2}-\d{2}$/.test(draft.start) &&
+      /^\d{4}-\d{2}-\d{2}$/.test(draft.end),
+    );
+  const { workingLocationType, workingLocationLabel } =
+    resolveDraftWorkingLocation(draft);
   return {
     id: calendarDraftEventId(draft.id),
     title:
       editableTitle ||
       (draft.eventType === "outOfOffice"
         ? "Out of office"
-        : UNNAMED_EVENT_TITLE),
+        : draft.eventType === "workingLocation"
+          ? "Working location"
+          : UNNAMED_EVENT_TITLE),
     titleIsGenerated: !editableTitle,
     description: draft.description ?? "",
-    start: start.toISOString(),
-    end: end.toISOString(),
+    start: dateOnlyAllDay ? draft.start! : start.toISOString(),
+    end: dateOnlyAllDay ? draft.end! : end.toISOString(),
     startTimeZone: draft.startTimeZone,
     endTimeZone: draft.endTimeZone ?? draft.startTimeZone,
-    location: draft.location ?? draft.workingLocationLabel ?? "",
-    allDay:
-      draft.eventType === "outOfOffice" && draft.fullDay
-        ? false
-        : (draft.allDay ?? false),
+    location: draft.location || workingLocationLabel,
+    allDay,
     source: "local",
     accountEmail: draft.accountEmail,
     colorId: draft.colorId,
@@ -234,6 +286,16 @@ function draftToCalendarEvent(
     transparency: draft.transparency,
     visibility: draft.visibility,
     eventType: draft.eventType ?? "default",
+    workingLocationProperties:
+      draft.eventType === "workingLocation"
+        ? buildWorkingLocationProperties(
+            { workingLocationProperties: undefined },
+            {
+              type: workingLocationType,
+              label: workingLocationLabel,
+            },
+          )
+        : undefined,
     outOfOfficeProperties: draft.outOfOfficeProperties,
     recurrence: draft.recurrence,
     attendees: draft.attendees,
@@ -273,6 +335,10 @@ function applyDraftPatch(
   copy("location");
   copy("allDay");
   copy("fullDay");
+  if (patch.allDay === true) {
+    delete next.startTimeZone;
+    delete next.endTimeZone;
+  }
   copy("eventType");
   copy("outOfOfficeProperties");
   copy("transparency");
@@ -361,6 +427,7 @@ export default function CalendarView() {
     Record<string, string>
   >({});
   const openedDraftIdRef = useRef<string | null>(null);
+  const preserveDraftViewRef = useRef(false);
   const committingDraftIdsRef = useRef<Set<string>>(new Set());
   const discardedCommittingDraftsRef = useRef<Map<string, CalendarEventDraft>>(
     new Map(),
@@ -375,6 +442,12 @@ export default function CalendarView() {
   const settingsQuery = useSettings();
   const { data: settings } = settingsQuery;
   const weekStartsOn = getWeekStartsOn(settings?.weekStart);
+  const updateSettings = useUpdateSettings();
+  const displayTimezone = normalizeTimezone(settings?.timezone);
+  const [timezonePrompt, setTimezonePrompt] = useState<{
+    savedTimezone: string;
+    browserTimezone: string;
+  } | null>(null);
   const { data: rawOverlayPeople } = useOverlayPeople();
   const overlayPeople = Array.isArray(rawOverlayPeople) ? rawOverlayPeople : [];
   const overlayEmails = useMemo(
@@ -393,32 +466,83 @@ export default function CalendarView() {
     day: t("calendarView.day"),
   };
 
-  // Compute date range for query based on view
-  const { from, to } = useMemo(() => {
-    switch (viewMode) {
-      case "month": {
-        const ms = startOfMonth(selectedDate);
-        const me = endOfMonth(selectedDate);
-        return {
-          from: startOfWeek(ms, { weekStartsOn }).toISOString(),
-          to: endOfWeek(me, { weekStartsOn }).toISOString(),
-        };
-      }
-      case "week": {
-        return {
-          from: startOfWeek(selectedDate, { weekStartsOn }).toISOString(),
-          to: endOfWeek(selectedDate, { weekStartsOn }).toISOString(),
-        };
+  useEffect(() => {
+    if (!settings?.timezone || typeof window === "undefined") return;
+
+    const checkBrowserTimezone = () => {
+      const browserTimezone = getBrowserTimezone();
+      if (browserTimezone === settings.timezone) {
+        setTimezonePrompt(null);
+        return;
       }
-      case "day": {
-        const dayStart = new Date(selectedDate);
-        dayStart.setHours(0, 0, 0, 0);
-        const dayEnd = new Date(selectedDate);
-        dayEnd.setHours(23, 59, 59, 999);
-        return { from: dayStart.toISOString(), to: dayEnd.toISOString() };
+
+      const dismissalKey = timezoneDismissalKey(
+        settings.timezone,
+        browserTimezone,
+      );
+      try {
+        if (window.localStorage.getItem(dismissalKey) === "1") {
+          setTimezonePrompt(null);
+          return;
+        }
+      } catch (error) {
+        console.warn(
+          "Calendar timezone dismissal could not be read from local storage.",
+          error,
+        );
       }
+      setTimezonePrompt({
+        savedTimezone: settings.timezone,
+        browserTimezone,
+      });
+    };
+
+    checkBrowserTimezone();
+    window.addEventListener("focus", checkBrowserTimezone);
+    document.addEventListener("visibilitychange", checkBrowserTimezone);
+    return () => {
+      window.removeEventListener("focus", checkBrowserTimezone);
+      document.removeEventListener("visibilitychange", checkBrowserTimezone);
+    };
+  }, [settings?.timezone]);
+
+  const keepSavedTimezone = useCallback(() => {
+    if (!timezonePrompt) return;
+    try {
+      window.localStorage.setItem(
+        timezoneDismissalKey(
+          timezonePrompt.savedTimezone,
+          timezonePrompt.browserTimezone,
+        ),
+        "1",
+      );
+    } catch (error) {
+      console.warn(
+        "Calendar timezone dismissal could not be saved to local storage.",
+        error,
+      );
     }
-  }, [viewMode, selectedDate, weekStartsOn]);
+    setTimezonePrompt(null);
+  }, [timezonePrompt]);
+
+  const switchToBrowserTimezone = useCallback(() => {
+    if (!timezonePrompt || !settings) return;
+    updateSettings.mutate(
+      { ...settings, timezone: timezonePrompt.browserTimezone },
+      {
+        onSuccess: () => setTimezonePrompt(null),
+        onError: () => toast.error(t("settings.saveFailed")),
+      },
+    );
+  }, [settings, t, timezonePrompt, updateSettings]);
+
+  // The saved Calendar Settings timezone owns the range boundary. The browser
+  // timezone is only a temporary fallback while settings are loading.
+  const { from, to } = useMemo(
+    () =>
+      getViewDateRange(viewMode, selectedDate, displayTimezone, weekStartsOn),
+    [displayTimezone, selectedDate, viewMode, weekStartsOn],
+  );
 
   const {
     data: rawEventsData,
@@ -471,31 +595,25 @@ export default function CalendarView() {
         case "month": {
           const next = addMonths(selectedDate, 1);
           const prev = subMonths(selectedDate, 1);
-          return [next, prev].map((d) => ({
-            from: startOfWeek(startOfMonth(d), { weekStartsOn }).toISOString(),
-            to: endOfWeek(endOfMonth(d), { weekStartsOn }).toISOString(),
-          }));
+          return [next, prev].map((date) =>
+            getViewDateRange("month", date, displayTimezone, weekStartsOn),
+          );
         }
         case "week": {
           // Two weeks forward so rapid `j j` stays instant, plus one back.
           const next = addWeeks(selectedDate, 1);
           const next2 = addWeeks(selectedDate, 2);
           const prev = subWeeks(selectedDate, 1);
-          return [next, next2, prev].map((d) => ({
-            from: startOfWeek(d, { weekStartsOn }).toISOString(),
-            to: endOfWeek(d, { weekStartsOn }).toISOString(),
-          }));
+          return [next, next2, prev].map((date) =>
+            getViewDateRange("week", date, displayTimezone, weekStartsOn),
+          );
         }
         case "day": {
           const next = addDays(selectedDate, 1);
           const prev = subDays(selectedDate, 1);
-          return [next, prev].map((d) => {
-            const start = new Date(d);
-            start.setHours(0, 0, 0, 0);
-            const end = new Date(d);
-            end.setHours(23, 59, 59, 999);
-            return { from: start.toISOString(), to: end.toISOString() };
-          });
+          return [next, prev].map((date) =>
+            getViewDateRange("day", date, displayTimezone, weekStartsOn),
+          );
         }
       }
     })();
@@ -503,11 +621,12 @@ export default function CalendarView() {
       void prefetchEvents(queryClient, range.from, range.to, overlayEmails);
     }
   }, [
+    displayTimezone,
     isLoading,
-    viewMode,
-    selectedDate,
     overlayEmails,
     queryClient,
+    selectedDate,
+    viewMode,
     weekStartsOn,
   ]);
 
@@ -581,31 +700,31 @@ export default function CalendarView() {
 
   // Filter events for day view — use overlap check so multi-day continuation
   // events (started on a prior day) still appear on the selected day.
-  const dayEvents = useMemo(
-    () =>
-      viewMode === "day"
-        ? events.filter((e) => {
-            const evStart = parseISO(e.start);
-            const evEnd = parseISO(e.end);
-            const dayStart = startOfDay(selectedDate);
-            const dayEnd = addDays(dayStart, 1);
-            return evStart < dayEnd && evEnd > dayStart;
-          })
-        : events,
-    [events, viewMode, selectedDate],
-  );
+  const dayEvents = useMemo(() => {
+    if (viewMode !== "day") return events;
+    return events.filter((event) =>
+      eventOverlapsCalendarDay(event, selectedDate, displayTimezone),
+    );
+  }, [displayTimezone, events, selectedDate, viewMode]);
   const locationSuggestions = useMemo(
     () => getLocationSuggestions(events),
     [events],
   );
   const openNotificationEvent = useCallback(
     (event: CalendarEvent) => {
-      setSelectedDate(parseISO(event.start));
+      const eventDate = getEventDateKey(event, displayTimezone);
+      if (eventDate) setSelectedDate(dateKeyToDate(eventDate));
       setViewMode("day");
       setSidebarEvent(event);
       setFocusedEvent(event);
     },
-    [setFocusedEvent, setSelectedDate, setSidebarEvent, setViewMode],
+    [
+      displayTimezone,
+      setFocusedEvent,
+      setSelectedDate,
+      setSidebarEvent,
+      setViewMode,
+    ],
   );
   useMeetingStartNotifications(events, openNotificationEvent);
 
@@ -616,10 +735,17 @@ export default function CalendarView() {
     }
     if (openedDraftIdRef.current === eventDraft.id) return;
     openedDraftIdRef.current = eventDraft.id;
+    const preserveView = preserveDraftViewRef.current;
+    preserveDraftViewRef.current = false;
 
-    const { start } = draftRange(eventDraft, selectedDate);
-    setSelectedDate(start);
-    if (isMobile || viewMode === "month") {
+    const draftDate = getEventDateKey(
+      draftToCalendarEvent(eventDraft, selectedDate),
+      displayTimezone,
+    );
+    if (!preserveView && draftDate) {
+      setSelectedDate(dateKeyToDate(draftDate));
+    }
+    if (!preserveView && (isMobile || viewMode === "month")) {
       setViewMode("day");
     }
     setCreateDefaultStart(undefined);
@@ -630,6 +756,7 @@ export default function CalendarView() {
     setQuickEditEventId(calendarDraftEventId(eventDraft.id));
   }, [
     eventDraft,
+    displayTimezone,
     isMobile,
     selectedDate,
     setEventDetailSidebar,
@@ -670,7 +797,11 @@ export default function CalendarView() {
       const eventType = draft.eventType ?? "default";
       const title =
         editableTitle || (eventType === "outOfOffice" ? "Out of office" : "");
-      if (!title && !isSlotDraftId(draftId)) {
+      if (
+        !title &&
+        eventType !== "workingLocation" &&
+        !isSlotDraftId(draftId)
+      ) {
         committingDraftIdsRef.current.delete(draftId);
         toast.error(t("calendarView.addTitleBeforeCreate"));
         return;
@@ -683,27 +814,31 @@ export default function CalendarView() {
         return;
       }
 
-      const location = draft.location ?? draft.workingLocationLabel ?? "";
+      const { workingLocationType, workingLocationLabel } =
+        resolveDraftWorkingLocation(draft);
+      const location =
+        eventType === "workingLocation"
+          ? workingLocationLabel
+          : (draft.location ?? "");
       const timezone = resolveEventTimezone(
-        draft.startTimeZone ?? draft.endTimeZone,
+        draft.startTimeZone ?? draft.endTimeZone ?? displayTimezone,
       );
       const semanticFullDay =
         eventType === "outOfOffice" &&
         draft.fullDay === true &&
         /^\d{4}-\d{2}-\d{2}$/.test(draft.start ?? "") &&
         /^\d{4}-\d{2}-\d{2}$/.test(draft.end ?? "");
+      const dateOnlyAllDay =
+        draft.allDay === true &&
+        /^\d{4}-\d{2}-\d{2}$/.test(draft.start ?? "") &&
+        /^\d{4}-\d{2}-\d{2}$/.test(draft.end ?? "");
       const statusPatch =
         eventType === "default"
           ? {}
           : {
               eventType,
-              workingLocationType:
-                draft.workingLocationType ?? "customLocation",
-              workingLocationLabel:
-                (draft.workingLocationType ?? "customLocation") ===
-                "customLocation"
-                  ? location
-                  : draft.workingLocationLabel,
+              workingLocationType,
+              workingLocationLabel,
               autoDeclineMode:
                 eventType === "outOfOffice"
                   ? draft.outOfOfficeProperties?.autoDeclineMode
@@ -720,8 +855,11 @@ export default function CalendarView() {
         titleIsGenerated: !editableTitle,
         description:
           eventType === "outOfOffice" ? "" : (draft.description ?? ""),
-        start: semanticFullDay ? draft.start! : start.toISOString(),
-        end: semanticFullDay ? draft.end! : end.toISOString(),
+        start:
+          semanticFullDay || dateOnlyAllDay
+            ? draft.start!
+            : start.toISOString(),
+        end: semanticFullDay || dateOnlyAllDay ? draft.end! : end.toISOString(),
         startTimeZone: draft.allDay ? undefined : timezone,
         endTimeZone: draft.allDay
           ? undefined
@@ -803,6 +941,7 @@ export default function CalendarView() {
       defaultAccountEmail,
       deleteEvent,
       eventDraft,
+      displayTimezone,
       googleStatus.data?.accounts,
       selectedDate,
       setEventDraft,
@@ -882,7 +1021,8 @@ export default function CalendarView() {
   }
 
   function handleToday() {
-    setSelectedDate(new Date());
+    const today = getDateKeyInTimezone(new Date(), displayTimezone);
+    if (today) setSelectedDate(dateKeyToDate(today));
   }
 
   const handleDateSelect = useCallback(
@@ -1047,54 +1187,24 @@ export default function CalendarView() {
     const event = events.find((e) => e.id === eventId);
     if (!event) return;
 
+    const moved = moveEventToCalendarDate(event, newDate, displayTimezone);
+    if (!moved) return;
+
     if (calendarDraftIdFromEventId(eventId)) {
-      const originalStart = parseISO(event.start);
-      const originalEnd = parseISO(event.end);
-      const newStart = new Date(originalStart);
-      const newEnd = new Date(originalEnd);
-      newStart.setFullYear(
-        newDate.getFullYear(),
-        newDate.getMonth(),
-        newDate.getDate(),
-      );
-      newEnd.setFullYear(
-        newDate.getFullYear(),
-        newDate.getMonth(),
-        newDate.getDate(),
-      );
-      updateDraftEvent(eventId, {
-        start: newStart.toISOString(),
-        end: newEnd.toISOString(),
-      });
+      updateDraftEvent(eventId, moved);
       return;
     }
 
     const oldStartISO = event.start;
     const oldEndISO = event.end;
-    const originalStart = parseISO(event.start);
-    const originalEnd = parseISO(event.end);
-    const newStart = new Date(originalStart);
-    const newEnd = new Date(originalEnd);
-
-    newStart.setFullYear(
-      newDate.getFullYear(),
-      newDate.getMonth(),
-      newDate.getDate(),
-    );
-    newEnd.setFullYear(
-      newDate.getFullYear(),
-      newDate.getMonth(),
-      newDate.getDate(),
-    );
+    const newStart = new Date(moved.start);
+    const newEnd = new Date(moved.end);
 
     // Guard against a zero/negative duration reaching the server (e.g. a
     // DST transition collapsing a short event's start/end onto each other).
     if (newEnd.getTime() <= newStart.getTime()) return;
 
-    const updates = {
-      start: newStart.toISOString(),
-      end: newEnd.toISOString(),
-    };
+    const updates = moved;
     const isRecurring = isRecurringCalendarEvent(event);
     const guestNotification = await promptGuestNotification({
       event,
@@ -1155,7 +1265,7 @@ export default function CalendarView() {
 
       if (calendarDraftIdFromEventId(eventId)) {
         const timezone = resolveEventTimezone(
-          event.startTimeZone ?? event.endTimeZone,
+          event.startTimeZone ?? event.endTimeZone ?? displayTimezone,
         );
         updateDraftEvent(eventId, {
           start: newStart.toISOString(),
@@ -1167,8 +1277,8 @@ export default function CalendarView() {
         return;
       }
 
-      const oldStart = parseISO(event.start).getTime();
-      const oldEnd = parseISO(event.end).getTime();
+      const oldStart = new Date(event.start).getTime();
+      const oldEnd = new Date(event.end).getTime();
       if (oldStart === newStart.getTime() && oldEnd === newEnd.getTime()) {
         return;
       }
@@ -1226,8 +1336,9 @@ export default function CalendarView() {
       );
     },
     [
+      displayTimezone,
       events,
-      settings,
+      displayTimezone,
       updateDraftEvent,
       promptGuestNotification,
       updateEvent,
@@ -1261,7 +1372,7 @@ export default function CalendarView() {
       setCreateDefaultStart(startTime);
       setCreateDialogOpen(false);
 
-      const dateStr = format(clickedDate, "yyyy-MM-dd");
+      const dateStr = dateToCalendarDateKey(clickedDate);
       // A drag-to-create gesture already computed the exact dragged range;
       // a plain click falls back to the user's configured default duration.
       const end = options?.explicitDuration
@@ -1302,6 +1413,53 @@ export default function CalendarView() {
     ],
   );
 
+  const handleCreateWorkingLocation = useCallback(
+    (date: Date) => {
+      const existing = findOwnedWorkingLocationForDay(
+        events,
+        date,
+        displayTimezone,
+        defaultAccountEmail,
+      );
+
+      preserveDraftViewRef.current = true;
+      setCreateDefaultStart(undefined);
+      setCreateDefaultEnd(undefined);
+
+      if (existing) {
+        const existingDraftId = calendarDraftIdFromEventId(existing.id);
+        if (!existingDraftId && eventDraft) {
+          discardDraftEvent(calendarDraftEventId(eventDraft.id));
+        }
+        setQuickEditEventId(existing.id);
+        return;
+      }
+
+      if (eventDraft) {
+        discardDraftEvent(calendarDraftEventId(eventDraft.id));
+      }
+
+      const draftId = `slot-working-location-${Date.now()}`;
+      const draft = buildWorkingLocationDraft({
+        id: draftId,
+        date,
+        accountEmail: defaultAccountEmail,
+      });
+
+      persistCalendarDraft(draft);
+      setEventDraft(draft);
+      setQuickEditEventId(calendarDraftEventId(draftId));
+    },
+    [
+      defaultAccountEmail,
+      discardDraftEvent,
+      displayTimezone,
+      eventDraft,
+      events,
+      setEventDraft,
+    ],
+  );
+
   // Command palette natural-language quick create (e.g. "lunch with Sam
   // tomorrow 12:30") — builds a prefilled draft and jumps to it, reusing the
   // same draft/quick-edit flow as clicking a time slot.
@@ -1806,7 +1964,9 @@ export default function CalendarView() {
               <MonthView
                 events={events}
                 selectedDate={selectedDate}
+                timezone={displayTimezone}
                 onDateSelect={handleDateSelect}
+                onCreateWorkingLocation={handleCreateWorkingLocation}
                 onDeleteEvent={handleDeleteEvent}
                 onEventDrop={handleEventDrop}
                 draftEventIds={draftEventIds}
@@ -1821,10 +1981,12 @@ export default function CalendarView() {
               <WeekView
                 events={events}
                 selectedDate={selectedDate}
+                timezone={displayTimezone}
                 onDateSelect={handleDateSelect}
                 onDeleteEvent={handleDeleteEvent}
                 onEventTimeChange={handleEventTimeChange}
                 onClickTimeSlot={handleClickTimeSlot}
+                onCreateWorkingLocation={handleCreateWorkingLocation}
                 quickEditEventId={quickEditEventId}
                 onQuickEditSave={handleQuickEditSave}
                 onQuickEditCancel={handleQuickEditCancel}
@@ -1840,9 +2002,11 @@ export default function CalendarView() {
               <DayView
                 events={dayEvents}
                 date={selectedDate}
+                timezone={displayTimezone}
                 onDeleteEvent={handleDeleteEvent}
                 onEventTimeChange={handleEventTimeChange}
                 onClickTimeSlot={handleClickTimeSlot}
+                onCreateWorkingLocation={handleCreateWorkingLocation}
                 quickEditEventId={quickEditEventId}
                 onQuickEditSave={handleQuickEditSave}
                 onQuickEditCancel={handleQuickEditCancel}
@@ -1867,6 +2031,19 @@ export default function CalendarView() {
         )}
 
         {/* Dialogs */}
+        {timezonePrompt && (
+          <TimezoneSwitchDialog
+            open
+            savedTimezone={timezonePrompt.savedTimezone}
+            browserTimezone={timezonePrompt.browserTimezone}
+            isSwitching={updateSettings.isPending}
+            onKeep={keepSavedTimezone}
+            onSwitch={switchToBrowserTimezone}
+            onOpenChange={(open) => {
+              if (!open) keepSavedTimezone();
+            }}
+          />
+        )}
         <CommandPalette
           open={commandPaletteOpen}
           onClose={() => setCommandPaletteOpen(false)}
@@ -1874,7 +2051,8 @@ export default function CalendarView() {
           onGoToDate={handleGoToDate}
           onEventClick={(event) => {
             setCommandPaletteOpen(false);
-            handleGoToDate(parseISO(event.start));
+            const eventDate = getEventDateKey(event, displayTimezone);
+            if (eventDate) handleGoToDate(dateKeyToDate(eventDate));
           }}
           onCreateEvent={() => {
             setCommandPaletteOpen(false);