Calendar Component Not Displaying Multi Day Events Correctly

Before I go and create an entire custom calendar component I wanted to ask on here if anybody has had a similar issue.

I am using Xano as my backend and storing all my dates as timestamps, in WeWeb I have the calendar set to UTC for simplicity. I can schedule an event just fine and see that the timestamp loads into Xano as the correct timestamp (I’m using the Date plugin to convert from ISO to timestamp). Then when displaying the event I use the date plugin to convert from the timestamp back into ISO. So I know that the dates and times are correct.

All my events start at 7:30am UTC on the start date and end at 11:59:59pm UTC on the end date. Yet the calendar component displays multi day events missing the last day.

Both of the events above are week long events, but both are missing the Friday.

I tried googling around and asking the WeWeb AI helper, but I have had no luck finding a solution. The WeWeb builder AI’s solution was to “to add one day to the end date, ensuring events display correctly” :laughing:.

Hi Tristan :waving_hand:

Can you open a support chat so we can take a better look at your project and figure out if its an error on our element or in your specific project?

Posting this so that anybody else having a similar issue can resolve it without having to spend days not getting an answer from support.

WeWeb is using the FullCalendar codebase for the Calendar component, which is great as its a very powerful codebase, however what’s not great is that they don’t mention this in the docs which makes figuring out more complex issues difficult.

My issue ended up being that I was marking my events as “All Day”, when you do this FullCalendar expects an exclusive endate (The endate is the event cutoff), so it would stop displaying before the last day of the event because the last day was the cutoff date. So in a weird way the AI solution of adding a day was kind of correct? :laughing:

See the documentation on FullCalendar for more details. The WeWeb docs for the Calendar are essentially just an incomplete copy of them anyways. https://fullcalendar.io/docs/event-parsing.

1 Like