diff --git a/docs/widgets/services/calendar.md b/docs/widgets/services/calendar.md index 1f44fe67..74751f6e 100644 --- a/docs/widgets/services/calendar.md +++ b/docs/widgets/services/calendar.md @@ -27,7 +27,7 @@ widget: url: https://domain.url/with/link/to.ics # URL with calendar events name: My Events # required - name for these calendar events color: zinc # optional - defaults to pre-defined color for the service (zinc for ical) - timezone: America/Los_Angeles # optional - force timezone for events when they are shown at the wrong time + timezone: America/Los_Angeles # optional - force timezone for events (if it's the same - no change, if missing or different in ical - will be converted to this timezone) params: # optional - additional params for the service showName: true # optional - show name before event title in event line - defaults to false ``` diff --git a/src/widgets/calendar/agenda.jsx b/src/widgets/calendar/agenda.jsx index ef90fe13..9313cb8e 100644 --- a/src/widgets/calendar/agenda.jsx +++ b/src/widgets/calendar/agenda.jsx @@ -2,7 +2,7 @@ import { DateTime } from "luxon"; import classNames from "classnames"; import { useTranslation } from "next-i18next"; -import Event, { compareIfSameAsEventDateTime } from "./event"; +import Event, { compareDateTimezoneAware } from "./event"; export default function Agenda({ service, colorVariants, events, showDate }) { const { widget } = service; @@ -58,7 +58,7 @@ export default function Agenda({ service, colorVariants, events, showDate }) { event={event} colorVariants={colorVariants} showDate={j === 0} - showTime={widget?.showTime && compareIfSameAsEventDateTime(showDate, event)} + showTime={widget?.showTime && compareDateTimezoneAware(showDate, event)} /> ))} diff --git a/src/widgets/calendar/event.jsx b/src/widgets/calendar/event.jsx index 4bff4131..7d348285 100644 --- a/src/widgets/calendar/event.jsx +++ b/src/widgets/calendar/event.jsx @@ -40,6 +40,6 @@ export default function Event({ event, colorVariants, showDate = false, showTime ); } -export function compareIfSameAsEventDateTime(date, event) { +export function compareDateTimezoneAware(date, event) { return date.setZone(event.date.zoneName).startOf("day").valueOf() === event.date.startOf("day").valueOf(); } diff --git a/src/widgets/calendar/monthly.jsx b/src/widgets/calendar/monthly.jsx index 4ef24bdb..ddb9cd87 100644 --- a/src/widgets/calendar/monthly.jsx +++ b/src/widgets/calendar/monthly.jsx @@ -3,7 +3,7 @@ import { DateTime, Info } from "luxon"; import classNames from "classnames"; import { useTranslation } from "next-i18next"; -import Event, { compareIfSameAsEventDateTime } from "./event"; +import Event, { compareDateTimezoneAware } from "./event"; const cellStyle = "relative w-10 flex items-center justify-center flex-col"; const monthButton = "pl-6 pr-6 ml-2 mr-2 hover:bg-theme-100/20 dark:hover:bg-white/5 rounded-md cursor-pointer"; @@ -12,7 +12,7 @@ export function Day({ weekNumber, weekday, events, colorVariants, showDate, setS const currentDate = DateTime.now(); const cellDate = showDate.set({ weekday, weekNumber }).startOf("day"); - const filteredEvents = events?.filter((event) => compareIfSameAsEventDateTime(cellDate, event)); + const filteredEvents = events?.filter((event) => compareDateTimezoneAware(cellDate, event)); const dayStyles = (displayDate) => { let style = "h-9 "; @@ -171,7 +171,7 @@ export default function Monthly({ service, colorVariants, events, showDate, setS
{eventsArray - ?.filter((event) => compareIfSameAsEventDateTime(showDate, event)) + ?.filter((event) => compareDateTimezoneAware(showDate, event)) .slice(0, widget?.maxEvents ?? 10) .map((event) => ( ))}