Proyectos de Subversion LeadersLinked - Backend

import React, { useEffect } from 'react'
import { Button, Modal } from 'react-bootstrap'
import { useForm } from 'react-hook-form'
import DescriptionInput from '../../../shared/DescriptionInput'

const SectionModal = ({ show, closeModal, section, onSubmit }) => {

        const { handleSubmit, errors, register, setValue } = useForm()
        const uuid = Math.random() * (9999999999999 - 1000000000000) + 1

        useEffect(() => {
                setValue('name', section.name)
        }, [section])

        const submit = (data) => {
                onSubmit({
                        ...section,
                        name: data.name,
                        text: data.text,
                        slug_section: section.slug_section ? section.slug_section : `section${parseInt(uuid)}`
                })
                closeModal()
        }

        return (
                <Modal size="md" onHide={closeModal} show={show}>
                        <Modal.Header closeButton>
                                <Modal.Title>Nuevo candidato</Modal.Title>
                        </Modal.Header>
                        <form onSubmit={handleSubmit(submit)}>
                                <Modal.Body>
                                        <div className='form-group'>
                                                <label className="form-label">Nombre</label>
                                                <input type="text" name='name' className='form-control' ref={register({ required: true })} />
                                                {errors.name && <p>{errors.name.message}</p>}
                                        </div>
                                        <div className='form-group'>
                                                <label className="form-label">Texto</label>
                                                <DescriptionInput
                                                        defaultValue={section.text}
                                                        name='text'
                                                        onChange={setValue}
                                                />
                                        </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 SectionModal