Proyectos de Subversion LeadersLinked - Backend

import axios from 'axios'
import React, { useEffect, useState } from 'react'
import { Modal, Button } from 'react-bootstrap'
import { useForm } from 'react-hook-form'
import { getData } from '../../../helpers/fetchHelpers'

const CompanySizeModal = ({
    isOpen,
    closeModal,
    companySizeUrl,
    action
}) => {

    const { handleSubmit, register } = useForm()
    const [error, setError] = useState(null);
    const [companySizes, setCompanySizes] = useState([]);
    const [currentCompanySizeId, setCurrentCompanySizeId] = useState("");

    const onSubmit = ({ company_size }) => {

        const data = new FormData()
        data.append("company_size_id", company_size)

        axios.post(editUrl, data)
            .then(({ data }) => {
                if (!data.success) {
                    return setError("Error en la respuesta")
                }
                action(data.data.company_size)
            })
            .then(() => {
                setError(null)
                closeModal()
            })
            .catch((err) => console.log(err))
    }

    useEffect(() => {
        getData(companySizeUrl)
            .then(({ company_sizes, company_size_id }) => {
                Object.entries(company_sizes).map(([key, value]) => {
                    setCompanySizes(prev => [...prev, { value: key, name: value }])
                })

                setCurrentCompanySizeId(company_size_id)
            })
    }, [isOpen]);

    return (
        <Modal
            size="md"
            show={isOpen}
            onHide={closeModal}
            autoFocus={false}
        >
            <Modal.Header closeButton>
                <Modal.Title>Cambiar</Modal.Title>
            </Modal.Header>
            <form onSubmit={handleSubmit(onSubmit)}>
                <Modal.Body>
                    <div className="mb-3">
                        <label className="form-label">Tamaño de la empresa</label>
                        <select
                            className='form-control'
                            name="company_size"
                            ref={register}
                        >
                            {
                                companySizes.map(({ value, name }) => (
                                    <option key={value} value={value}>{name}</option>
                                ))
                            }
                        </select>
                    </div>
                    {error && <p>{error}</p>}
                </Modal.Body>
                <Modal.Footer>
                    <Button
                        variant="primary"
                        type="submit"
                    >
                        Enviar
                    </Button>
                    <Button
                        variant="default"
                        onClick={closeModal}
                    >
                        Cancelar
                    </Button>
                </Modal.Footer>
            </form>
        </Modal >
    )
}

export default CompanySizeModal