Чтобы исправить это, отмените все подписки и асинхронные задачи в функции очистки useEffect

import React, { useCallback, useState } from 'react';
import { DateRangePicker } from '@mui/lab';
import { Box, Button, Grid, TextField } from '@mui/material';
import { Controller, useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
import FilterAltIcon from '@mui/icons-material/FilterAlt';
import { mt } from '../../../common/common.styled';
import { Modal } from '../../../common/ui';
import { yup } from '../../../app/core';
import { Styled } from './RangeData.styled';

type RangeData = {
  startEndData: unknown;
};
const defaultValues = {
  startEndData: ['', ''],
};

const schema = yup.object().shape({
  startEndData: yup
    .array()
    .of(yup.string())
    .required('Выберите дату ')
    .test('', 'Выберите дату ', function (startEndData) {
      return !(!startEndData[0] || !startEndData[1]);
    }),
});
const RangeDate: React.FC = () => {
  const [open, setOpen] = useState(false);

  const handleClose = useCallback(() => {
    setOpen(false);
  }, []);
  const handleOpen = useCallback(() => setOpen(true), []);

  const {
    handleSubmit,
    control,
    reset,
    formState: { errors },
  } = useForm<RangeData>({ defaultValues, resolver: yupResolver(schema) });

  const handleCreateRangeDate = handleSubmit((data: RangeData) => {
    console.log(data, 'data');
  });
  return (
    <Styled.Root>
      <Grid>
        <Button color="primary" onClick={handleOpen} variant="contained">
          Выберите диапазон <FilterAltIcon />
        </Button>
        <Modal open={open} onClose={handleClose} title={' Выберите диапазон '}>
          <form onSubmit={handleCreateRangeDate}>
            <Controller
              control={control}
              name="startEndData"
              render={({ field: { value, onChange } }) => (
                <DateRangePicker
                  startText="Начальная дата"
                  endText="Конечная дата"
                  error={Boolean(errors.startEndData?.message)}
                  value={value}
                  onChange={onChange}
                  renderInput={(startProps, endProps) => (
                    <React.Fragment>
                      <TextField {...startProps} />
                      <Box sx={{ mx: 2 }}> До </Box>
                      <TextField {...endProps} />
                    </React.Fragment>
                  )}
                />
              )}
            />
            <Grid>
              <Button css={mt(25)} variant="contained" color="primary" size="medium" type="submit">
                Подтвердить
              </Button>
            </Grid>
          </form>
        </Modal>
      </Grid>
    </Styled.Root>
  );
};

export default RangeDate;

введите сюда код

Ответы (0 шт):