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()

	useEffect(() => {

		setValue('name', section.name)

	}, [section])

	const submit = (data) => {

		onSubmit({ ...section, name: data.name, text: data.text })

		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