reactjsdevextremedevextreme-react

DevExtreme React Scheduler error value.isUTC is not a function


I am using DevExtreme React Scheduler with MUI and AdapterMoment, I even tried Dayjs and DateFNS adapters but none of those helped.

My Scheduler looks like this:

 <Paper>
        <Scheduler data={schedulerData}>
          <ViewState
            currentDate={currentDate}
            onCurrentDateChange={setCurrentDate}
          />

          <DayView startDayHour={0} endDayHour={23} />
          <WeekView />
          <MonthView />

          <EditingState onCommitChanges={handleCommitChanges} />

          <Toolbar />
          <ViewSwitcher />
          <DateNavigator />
          <TodayButton />

          <EditRecurrenceMenu />

          <Appointments />
          <AppointmentTooltip showCloseButton showOpenButton />
          <AppointmentForm readOnly />

          <DragDropProvider />
        </Scheduler>
      </Paper>

schedulerData looks like this:

export const schedulerData = [
  {
    id: 1,
    startDate: new Date(2023, 8, 19, 9, 45),
    endDate: new Date(2023, 8, 19, 11, 0),
    title: 'Meeting',
  },
  {
    id: 2,
    startDate: new Date(2023, 8, 19, 12, 0),
    endDate: new Date(2023, 10, 19, 13, 30),
    title: 'Go to a gym',
  },
]

The error the app is throwing is following:

value.isUTC is not a function
TypeError: value.isUTC is not a function
    at AdapterMoment.getTimezone (http://localhost:5173/node_modules/.vite/deps/chunk-4PQPXJTT.js?v=d816e2e5:219:17)
    at Object.getTimezone (http://localhost:5173/node_modules/.vite/deps/chunk-CJR5LQN3.js?v=d816e2e5:2380:88)
    at http://localhost:5173/node_modules/.vite/deps/chunk-CJR5LQN3.js?v=d816e2e5:1610:60
    at mountMemo (http://localhost:5173/node_modules/.vite/deps/chunk-GYWC62UC.js?v=d816e2e5:12817:27)
    at Object.useMemo (http://localhost:5173/node_modules/.vite/deps/chunk-GYWC62UC.js?v=d816e2e5:13141:24)
    at Object.useMemo (http://localhost:5173/node_modules/.vite/deps/chunk-HS5T2ZWL.js?v=d816e2e5:1094:29)
    at useValueWithTimezone (http://localhost:5173/node_modules/.vite/deps/chunk-CJR5LQN3.js?v=d816e2e5:1610:33)
    at usePickerValue (http://localhost:5173/node_modules/.vite/deps/chunk-CJR5LQN3.js?v=d816e2e5:10460:7)
    at usePicker (http://localhost:5173/node_modules/.vite/deps/chunk-CJR5LQN3.js?v=d816e2e5:10854:31)
    at useDesktopPicker (http://localhost:5173/node_modules/.vite/deps/chunk-CJR5LQN3.js?v=d816e2e5:10929:7)

The error is thrown when I try to open the AppointmentForm. I use "@mui/x-date-pickers": "^6.15.0", when I tried to uninstall it, it threw the exact same error.

Let me know if you need additional info! cheers


Solution

  • You need to run a yarn check command to see what dependencies are missing. In my case, I ran yarn add moment and the problem was solved.

    Edit: Also run yarn add @mui/x-date-pickers@5.0.15 because the library only works with that specific version of @mui/x-date-pickers.