import React from 'react';

import { getImportsString, getPropsString } from '../helpers';

import Playground from '../Playground/Playground';
import { Typography } from '@/mui/components';

function DateTimeRangePickerSection() {
  return (
    <Playground
      initialState={[
        {
          type: 'checkbox',
          stateId: 'disabled',
          selected: false,
        },
      ]}
      renderCallback={(state) => {
        const props = {
          ...state,
        };

        const propsString = {
          ...props,
        };

        const importsList = getImportsString([[['DateTimeRangePicker']]]);

        return {
          component: <Typography>Doesn`t exists</Typography>,
          code: `${importsList}\n<DateTimeRangePicker${getPropsString(propsString)}/>`,
        };
      }}
    />
  );
}

export default DateTimeRangePickerSection;
