Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6861 | Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6727 stevensc 1
import React from 'react'
2
import { axios } from '../../utils'
3
import { useForm } from 'react-hook-form'
4
import { Button, Modal } from 'react-bootstrap'
5
import { addNotification } from '../../redux/notification/notification.actions'
6
import { connect, useSelector } from 'react-redux'
7
import FormErrorFeedback from '../UI/FormErrorFeedback'
8
 
9
const AddProfileModal = ({
10
  show = '',
11
  onHide = () => null,
12
  getProfiles = () => null,
13
  addNotification, // redux action
14
}) => {
15
  const labels = useSelector(({ intl }) => intl.labels)
16
  const { register, handleSubmit, errors } = useForm()
17
 
18
  const onSubmitHandler = async (data) => {
19
    const formData = new FormData()
20
    Object.entries(data).map(([key, value]) => formData.append(key, value))
21
 
22
    await axios.post('/profile/my-profiles/add', formData).then(({ data }) => {
23
      if (data.success) {
24
        return addNotification({ style: 'success', msg: data.data })
25
      }
26
    })
27
    onHide()
28
    getProfiles()
29
  }
30
 
31
  return (
32
    <Modal show={show} onHide={onHide}>
33
      <Modal.Header closeButton>
34
        <Modal.Title id="contained-modal-title-vcenter">
35
          {labels.new_profile}
36
        </Modal.Title>
37
      </Modal.Header>
38
      <form onSubmit={handleSubmit(onSubmitHandler)}>
39
        <Modal.Body>
40
          <input
41
            type="text"
42
            name="name"
43
            placeholder={labels.profile_name}
44
            ref={register({ required: 'Este campo es requerido' })}
45
          />
46
          {errors.name && (
47
            <FormErrorFeedback>{errors.name.message}</FormErrorFeedback>
48
          )}
49
        </Modal.Body>
50
        <Modal.Footer>
51
          <Button type="submit">{labels.create_profile}</Button>
52
          <Button onClick={onHide} variant="danger">
53
            {labels.cancel}
54
          </Button>
55
        </Modal.Footer>
56
      </form>
57
    </Modal>
58
  )
59
}
60
 
61
const mapDispatchToProps = {
62
  addNotification: (notification) => addNotification(notification),
63
}
64
 
65
export default connect(null, mapDispatchToProps)(AddProfileModal)