Proyectos de Subversion LeadersLinked - Backend

import axios from 'axios';
import React, { useState } from 'react'
import { Modal, Button } from 'react-bootstrap';
import { useForm } from "react-hook-form";

const EditModal = ({
    title = '',
    isEdit = false,
    isOpen = false,
    closeModal = function () { },
    currentItem,
    url,
    action
}) => {

    const {
        register,
        handleSubmit,
        formState: { errors }
    } = useForm();
    const [isActive, setIsActive] = useState(true);

    const onSubmit = (data) => {
        let newData = { ...data, status: data.status ? "a" : "i" }
        let formData = new URLSearchParams(newData).toString()
        axios.post(url, formData)
            .then(async ({ data }) => {
                if (data.success) {
                    try {
                        await action()
                        closeModal()
                    }
                    catch (err) { console.log(err) }
                }
            })
            .catch((err) => console.log(err))
    };

    return (
        <Modal
            size="lg"
            show={isOpen}
            onHide={closeModal}
            autoFocus={false}
        >
            <Modal.Header closeButton>
                <Modal.Title>{title} - {isEdit ? 'Editar' : 'Agregar'}</Modal.Title>
            </Modal.Header>
            <form onSubmit={handleSubmit(onSubmit)}>
                <Modal.Body>
                    <div className="form-group">
                        <label>Nombre</label>
                        <input
                            className='form-control'
                            name='name'
                            ref={register}
                            defaultValue={currentItem ? currentItem.name : ''}
                        />
                        {errors.name && <p>Este campo es requerido</p>}
                    </div>
                    <div className="form-group">
                        <label>Mínimo</label>
                        <input
                            className="form-control"
                            name="minimum_no_of_employee"
                            ref={register}
                            required
                            defaultValue={currentItem ? currentItem.minimum_no_of_employee : ''}
                        />
                        {errors.minimum_no_of_employee && <p>Este campo es requerido</p>}
                    </div>
                    <div className="form-group">
                        <label>Máximo</label>
                        <input
                            className="form-control"
                            name="maximum_no_of_employee"
                            ref={register}
                            defaultValue={currentItem ? currentItem.maximum_no_of_employee : ''}
                        />
                        {errors.maximum_no_of_employee && <p>Este campo es requerido</p>}
                    </div>
                    <div
                        className={`toggle btn btn-primary ${!isActive && "off"}`}
                        data-toggle="toggle"
                        role="button"
                        onClick={() => setIsActive(!isActive)}
                    >
                        <input
                            type="checkbox"
                            name="status"
                            ref={register}
                            checked={isActive}
                        />
                        <div className="toggle-group">
                            <label for="status" className="btn btn-primary toggle-on">Activo</label>
                            <label for="status" className="btn btn-light toggle-off">Inactivo</label>
                            <span className="toggle-handle btn btn-light"></span>
                        </div>
                    </div>
                </Modal.Body>
                <Modal.Footer>
                    <Button
                        variant="primary"
                        type="submit"
                    >
                        Enviar
                    </Button>
                    <Button variant="danger" onClick={closeModal}>
                        Cancelar
                    </Button>
                </Modal.Footer>
            </form>
        </Modal >
    )
}

export default EditModal