Issue with @mui/x-date-pickers DesktopDatePicker – Previous Dates Not Visible I'm using Material-UI's @mui/x-date-pickers in my React project, specifically the DesktopDatePicker. However, sometimes when I open the calendar, previous dates appear as blank spaces instead of showing the expected numbers. This issue occurs intermittently, and I haven't been able to identify a consistent pattern.
import React, { useState } from 'react'
import { Typography } from '@mui/material'
import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment'
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'
import { DesktopDatePicker } from '@mui/x-date-pickers/DesktopDatePicker'
import moment from 'moment'
import { Control, Controller } from 'react-hook-form'
const TimezoneDatePicker = ({
name,
control,
rules,
onChangeCallback,
styles,
inputVariant,
onBlurCallback,
disabled,
disableFuture = false
}) => {
const [open, setOpen] = useState(false)
const handleOpen = () => {
if (!disabled) {
setOpen(true)
}
}
const handleClose = () => {
setOpen(false)
}
return (
<>
<Controller
name={name}
control={control}
rules={rules}
render={({ field: { onChange, value } }) => {
const parsedValue = value ? moment(value) : null
return (
<LocalizationProvider dateAdapter={AdapterMoment}>
<DesktopDatePicker
closeOnSelect
format='MM-DD-YYYY'
open={open}
onClose={handleClose}
value={parsedValue ? parsedValue : null}
{...(!disableFuture && { minDate: moment() })}
disabled={disabled}
timezone='UTC'
disableFuture={disableFuture}
key={name}
onChange={(v: any) => {
onChange(v ? v.toISOString() : null)
onChangeCallback && onChangeCallback(v)
}}
onAccept={v => {
handleClose()
onBlurCallback && onBlurCallback(v)
}}
slotProps={{
textField: {
placeholder: 'Select Date',
fullWidth: true,
variant: inputVariant
},
inputAdornment: {
onClick: handleOpen
}
}}
sx={{ ...styles }}
/>
</LocalizationProvider>
)
}}
/>
</>
)
}
export default TimezoneDatePicker
Has anyone encountered a similar issue? Any suggestions or debugging tips would be greatly appreciated!