AutorÃa | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */import React from 'react'import { Button, Modal } from 'react-bootstrap'import { useForm } from 'react-hook-form'import { connect } from 'react-redux'import { axios } from '../../../../utils'import { addNotification } from '../../../../redux/notification/notification.actions'import FormErrorFeedback from '../../../../shared/form-error-feedback/FormErrorFeedback'const AddProfileModal = ({show = '',onHide = () => null,getProfiles = () => null,addNotification // redux action}) => {// React hook formconst { register, handleSubmit, errors } = useForm()const onSubmitHandler = async (data) => {const formData = new FormData()Object.entries(data).map(([key, value]) => formData.append(key, value))await axios.post('/profile/my-profiles/add', formData).then(({ data }) => {if (data.success) {return addNotification({ style: 'success', msg: data.data })}})onHide()getProfiles()}return (<Modal show={show} onHide={onHide}><Modal.Header closeButton><Modal.Title id="contained-modal-title-vcenter">{LABELS.NEW_PROFILE}</Modal.Title></Modal.Header><form onSubmit={handleSubmit(onSubmitHandler)}><Modal.Body><inputtype="text"name="name"placeholder={LABELS.PROFILE_MAME}ref={register({ required: 'Este campo es requerido' })}/>{errors.name && <FormErrorFeedback>{errors.name.message}</FormErrorFeedback>}</Modal.Body><Modal.Footer><Button type="submit">{LABELS.CREATE_PROFILE}</Button><Button onClick={onHide} variant="danger">{LABELS.CANCEL}</Button></Modal.Footer></form></Modal>)}const mapDispatchToProps = {addNotification: (notification) => addNotification(notification)}export default connect(null, mapDispatchToProps)(AddProfileModal)