Cannot read property 'date' of undefined React material design

Question

I am using storybook reactJs and material-ui for an app. I am trying to build datepicker from Material-ui component and below is my code so far

import React, { Fragment, PureComponent } from 'react';
import  {DatePicker}  from 'material-ui-pickers';

class DatePickers extends PureComponent {
  state = {
    selectedDate: new Date(),
  }

  render() {
    console.log(this.state);
  const  { selectedDate } = this.state;

    return (
      <div>
        <DatePicker
          label="Basic example"
          value={selectedDate}
          onChange={this.handleDateChange}
          animateYearScrolling={false}
          />
      </div>
    )
  }
}

export default DatePickers;

when i open my storybook it shows the below error Cannot read property 'date' of undefined

TypeError: Cannot read property 'date' of undefined at DatePickerWrapper.PickerBase._this.getValidDateOrCurrent (http://localhost:6006/static/preview.bundle.js:52555:24) at DatePickerWrapper.PickerBase (http://localhost:6006/static/preview.bundle.js:52559:19)

Does anyone know. what's going on here?

Answer 1

make sure to npm install date-fns, react, react-dom, @mui/lab, and @mui/material