(@mui/x-date-pickers: 6.0.3 compatible) TypeError: date.isBefore is not a function

[NoerNova]

(@mui/x-date-pickers: 6.0.3 compatible) TypeError: date.isBefore is not a function

[jjcroftiv]

I received this error today. I changed my form field values from strings, "2022-12-01T05:00:00.000Z", to dayjs dates,
dayjs("2022-12-01T05:00:00.000Z"), which has resolved the issue for me.

[artem-kurchenko]

Hello,

Reactive Scheduler doesn't support v6 of @mui/x-date-pickers. This package contains a number of breaking changes that we didn't address. The issue you encountered occurs due to changes made to the value property: Update the format of the value prop.

While we're not planning to migrate to v6, your idea to replace an editor is valid. I've modified my example as a starting point: CodeSandBox. Note that I used the AdapterMoment adapter because Reactive Scheduler uses moment.js internally. Anyway, I cannot guarantee that these new editors will work in all cases as we didn't test them. Please keep in mind that more changes may be needed depending on your Scheduler configuration.

[shurshilov]

6.0.4 still error!

[shurshilov]

its also work for me
<DesktopDateTimePicker
{...field}
value={dayjs(field.value)}
format={"DD MM YYYY HH:mm"}
slotProps={{ textField: { variant: 'outlined' } }}
/>}

[NoerNova]

My current issue came from dx-react-scheduler not @mui/x-date-pickers itself,
dx-react-scheduler not accept dayjs object but native Date object.

I tried this

const currentDate = dayjs("2023-03-28").toDate();

  const events = mockupEventData?.map(
    ({ title, date, startDate, endDate, type }) => ({
      startDate: dayjs(startDate).toDate(),
      endDate: dayjs(endDate).toDate(),
      title,
      type,
    })
  );

  return (
    <Scheduler data={events}>
      <ViewState currentDate={currentDate} />
      <EditingState onCommitChanges={commitChanges} />
      <IntegratedEditing />
      <DayView startDayHour={8} endDayHour={20} />
      <ConfirmationDialog />
      <Appointments />
      <AppointmentTooltip showOpenButton showDeleteButton />
      <AppointmentForm />
      <Resources data={resources} />
    </Scheduler>

the error will appear when clicking to edit the appointment events

• I need to use some new features in @mui/x-date-pickers 6.0
• My workaround is to install multiple @mui/x-date-pickers as npm name alias