Wrong time display on the left side of the calendar in DST week

[MartinaVilimova]

Check that this is really a bug

• [X] I confirm

Reproduction link

https://codesandbox.io/s/react-big-calendar-example-forked-59gkwn?file=/src/App.js

Bug description

bug simulation: file stories\demos\exampleCode\timezones.js

import React, { Fragment, useState, useEffect, useMemo } from 'react'
import { Calendar, momentLocalizer, Views } from 'react-big-calendar'
import moment from 'moment'
import 'moment-timezone'
import DemoLink from '../../DemoLink.component'
import events from '../../resources/events'
import TimezoneSelect from '../TimezoneSelect'

const defaultTZ = moment.tz.guess()
const defaultDateStr = '2023-3-29'

function getDate(str, momentObj) {
  return momentObj(str, 'YYYY-MM-DD').toDate()
}

export default function Timezones() {
  const [timezone, setTimezone] = useState(defaultTZ)

  const { defaultDate, getNow, localizer, myEvents, scrollToTime } =
    useMemo(() => {
      moment.tz.setDefault(timezone)
      return {
        defaultDate: getDate(defaultDateStr, moment),
        getNow: () => moment().toDate(),
        localizer: momentLocalizer(moment),
        myEvents: [...events],
        scrollToTime: moment().toDate(),
      }
    }, [timezone])

  moment.locale('ko', { week: { dow: 7 } })

  useEffect(() => {
    return () => {
      moment.tz.setDefault() // reset to browser TZ on unmount
    }
  }, [])

  return (
    <Fragment>
      <TimezoneSelect
        defaultTZ={defaultTZ}
        setTimezone={setTimezone}
        timezone={timezone}
      />
      <br />
      <div className="height600">
        <Calendar
          defaultDate={defaultDate}
          defaultView="week"
          events={[{
            id: "event1",
            start: new Date('2023-03-29, 12:00:00'),
            end: new Date('2023-03-29, 13:00:00'),
            desc: '12-13h',
          }]}
          getNow={getNow}
          localizer={localizer}
          scrollToTime={scrollToTime}
          min={new Date(2023, 3, 29, 8, 0, 0, 0)}
          max={new Date(2023, 3, 29, 18, 0, 0, 0)}
          formats={{ timeGutterFormat: 'HH:mm' }}
        />
      </div>
    </Fragment>
  )
}

Expected Behavior

No response

Actual Behavior

The time on the left side of the calendar is wrong. The calendar is supposed to start at 8am, but it starts at 9am. Because of the daylight saving time, the time on the calendar is not displayed correctly (see screen). The time changes on Sundays, so this bug is only visible if the calendar starts on Sunday.

react-big-calendar version

0.40.8 but behavior same last version 1.6.9

React version

16.14.0

Platform/Target and Browser Versions

Chrome 111.0.5563.146

Validations

• [X] Read the docs.
• [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• [X] Make sure this is a react-big-calendar issue and not an implementation issue

Would you like to open a PR for this bug?

• [ ] I'm willing to open a PR

[addiebarron]

I can reproduce this! I thought it was a bug with the DayJS localizer specifically, but it seems to happen with any of the time zone aware packages. The issue doesn't exist when using the date-fns localizer, but at the expense of being able to configure the time zone.

@MartinaVilimova have you found any workarounds for this?

[peterholcomb]

This is also surfacing for us this week as well.

[Shawnxkwang]

surfaced again this week. anyone has successfully solved it?