diff --git a/packages/pluggableWidgets/calendar-web/CHANGELOG.md b/packages/pluggableWidgets/calendar-web/CHANGELOG.md index 4bd6ccc4ac..a2538870ad 100644 --- a/packages/pluggableWidgets/calendar-web/CHANGELOG.md +++ b/packages/pluggableWidgets/calendar-web/CHANGELOG.md @@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +### Fixed + +- Improved handling of the start date attribute to ensure correct calendar initialization. + ## [2.3.0] - 2026-02-17 ### Added diff --git a/packages/pluggableWidgets/calendar-web/src/Calendar.tsx b/packages/pluggableWidgets/calendar-web/src/Calendar.tsx index a7d8d31d52..e245ee7b34 100644 --- a/packages/pluggableWidgets/calendar-web/src/Calendar.tsx +++ b/packages/pluggableWidgets/calendar-web/src/Calendar.tsx @@ -8,7 +8,7 @@ import "./ui/Calendar.scss"; import { useCalendarEvents } from "./helpers/useCalendarEvents"; import { useLocalizer } from "./helpers/useLocalizer"; -export default function MxCalendar(props: CalendarContainerProps): ReactElement { +export default function MxCalendar(props: CalendarContainerProps): ReactElement | null { // useMemo with empty dependency array is used // because style and calendar controller needs to be created only once // and not on every re-render @@ -26,6 +26,11 @@ export default function MxCalendar(props: CalendarContainerProps): ReactElement }, [props, calendarController, localizer, culture]); const calendarEvents = useCalendarEvents(props); + + if (props.startDateAttribute && props.startDateAttribute.status !== "available") { + return null; + } + return (
diff --git a/packages/pluggableWidgets/calendar-web/src/Calendar.xml b/packages/pluggableWidgets/calendar-web/src/Calendar.xml index 0af2436b56..24df8a40ed 100644 --- a/packages/pluggableWidgets/calendar-web/src/Calendar.xml +++ b/packages/pluggableWidgets/calendar-web/src/Calendar.xml @@ -62,9 +62,9 @@ - + Start date attribute - The start date that should be shown in the view + The DateTime attribute used on initial load diff --git a/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts b/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts index 6d3c119b8e..d6176e11a6 100644 --- a/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts +++ b/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts @@ -16,6 +16,7 @@ export class CalendarPropsBuilder { private toolbarItems?: ResolvedToolbarItem[]; private step: number; private timeSlots: number; + private defaultDate?: Date; constructor(private props: CalendarContainerProps) { this.isCustomView = props.view === "custom"; @@ -36,6 +37,7 @@ export class CalendarPropsBuilder { `[Calendar] timeslots value ${props.timeslots} was clamped to ${this.timeSlots}. Must be between 1 and 4.` ); } + this.defaultDate = props.startDateAttribute?.value; } updateProps(props: CalendarContainerProps): void { @@ -43,6 +45,7 @@ export class CalendarPropsBuilder { this.props = props; this.events = this.buildEvents(props.databaseDataSource?.items ?? []); this.toolbarItems = this.buildToolbarItems(); + this.defaultDate = props.startDateAttribute?.value; } build(localizer: DateLocalizer, culture: string): DragAndDropCalendarProps { @@ -86,7 +89,8 @@ export class CalendarPropsBuilder { min: this.minTime, max: this.maxTime, step: this.step, - timeslots: this.timeSlots + timeslots: this.timeSlots, + ...(this.defaultDate ? { defaultDate: this.defaultDate } : {}) }; } diff --git a/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts b/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts index b0a1628d5e..644e2f5a08 100644 --- a/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts +++ b/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts @@ -4,7 +4,7 @@ * @author Mendix Widgets Framework Team */ import { CSSProperties } from "react"; -import { ActionValue, DynamicValue, ListValue, Option, ListActionValue, ListAttributeValue, ListExpressionValue } from "mendix"; +import { ActionValue, DynamicValue, EditableValue, ListValue, Option, ListActionValue, ListAttributeValue, ListExpressionValue } from "mendix"; export type TitleTypeEnum = "attribute" | "expression"; @@ -79,7 +79,7 @@ export interface CalendarContainerProps { startAttribute?: ListAttributeValue; endAttribute?: ListAttributeValue; eventColor?: ListAttributeValue; - startDateAttribute?: ListAttributeValue; + startDateAttribute?: EditableValue; editable: DynamicValue; view: ViewEnum; defaultViewStandard: DefaultViewStandardEnum;