I'm making calendar view and there is a bug. Everytime I make longer events, the calendar does not show events in sundays or in the ending day. Here is a picture:
The starting time is: Mon Aug 07 2023 15:44:00 GMT+0300 The ending time is: Tue Aug 29 2023 15:44:00 GMT+0300
What am I doing wrong in my code? Is the starting index day of the week wrong or something else? Below my code:
import { Calendar, dayjsLocalizer } from "react-big-calendar";
import 'react-big-calendar/lib/css/react-big-calendar.css';
import dayjs from "dayjs";
import fi from 'dayjs/locale/fi';
dayjs.locale(fi)
<Calendar
culture="fi"
events={data}
titleAccessor="definition"
localizer={localizer}
startAccessor="startTime"
endAccessor="endTime"
style={{ height: 600 }}
messages={defaultMessagesFi}
defaultView={'month'}
views={['day', 'week', 'work_week', 'month','agenda']}
scrollToTime={dayjs().set('hour', 8).set('minute', 0).set('second', 0)}
//showMultiDayTimes={true}
//allDayAccessor={true}
/>
Thanks.
One of my users had the same issue, Sundays and the ending day weren't showing, though for all the other users the same calendar displayed correctly. I'm using moment and not dayjs though, but because the problem is so similar, it's maybe caused by the same issue... All my users are in the same timezone so I used the work around described here and now it works: https://github.com/jquense/react-big-calendar/issues/2376
So apparently "if the client pc time zone utc-offset is less than your calendar time zone utc-offset, momentLocalizer/browserTZOffset will return 1 to adjust span in this situation" and you can reset it with:
moment.tz.setDefault('your tz');
const localizer = momentLocalizer(moment);
localizer.segmentOffset = 0 ;
<Calendar
...
localizer={localizer}
/>