Proyectos de Subversion LeadersLinked - SPA

import React from 'react';
import { Controller } from 'react-hook-form';
import { InputLabel } from '@mui/material';
import Datetime from 'react-datetime';

import FormErrorFeedback from '@components/UI/form/FormErrorFeedback';

import 'react-datetime/css/react-datetime.css';
import Input from '@components/UI/inputs/Input';

export default function DatetimePicker({
  control,
  rules,
  name = '',
  label = '',
  displayTime = false,
  dateFormat = 'DD-MM-YYYY',
  parseFormat = 'YYYY-MM-DD',
  color = 'primary'
}) {
  return (
    <Controller
      name={name}
      control={control}
      rules={rules}
      render={({ field: { onChange, ref, name, value }, fieldState: { error } }) => {
        const handleChange = (e) => {
          onChange(e.format(parseFormat));
        };

        const parsedValue = value ? new Date(value) : null;

        return (
          <>
            {label && <InputLabel>{label}</InputLabel>}
            <Datetime
              dateFormat={dateFormat}
              onChange={handleChange}
              timeFormat={displayTime}
              renderInput={(props) => <Input {...props} color={color} />}
              inputProps={{
                className: 'form-control',
                ref,
                name,
                autoComplete: 'off'
              }}
              value={parsedValue}
              closeOnSelect
            />
            {error && <FormErrorFeedback>{error.message}</FormErrorFeedback>}
          </>
        );
      }}
    />
  );
}