Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
7268 stevensc 1 
import React, { useState } from 'react'
2 
import { axios } from '../../utils'
3 
import { Button, Modal } from 'react-bootstrap'
4 
import { useForm } from 'react-hook-form'
5 
import { connect } from 'react-redux'
6 
import { addNotification } from '../../redux/notification/notification.actions'
7 
 
8 
import Spinner from '../UI/Spinner'
9 
import LoaderContainer from '../UI/LoaderContainer'
10 
import FormErrorFeedback from '../UI/FormErrorFeedback'
11 
 
12 
const ApplyModal = ({
13 
  onHide = function () {},
14 
  jobId,
15 
  show,
16 
  userProfiles,
17 
  onApplied,
18 
  addNotification = function () {}, // redux destructuring
19 
}) => {
20 
  const [loading, setLoading] = useState(false)
21 
  const { register, handleSubmit, errors, getValues, setError } = useForm()
22 
 
23 
  const handleOnSubmit = async (data) => {
24 
    setLoading(true)
25 
    const formData = new FormData()
26 
    Object.entries(data).map(([key, value]) => formData.append(key, value))
27 
 
28 
    await axios.post(`/job/apply-job/${jobId}`, formData).then(({ data }) => {
29 
      if (data.success) {
30 
        onApplied()
31 
        onHide()
32 
      } else {
33 
        if (typeof data.data === 'object') {
34 
          Object.entries(data.data).map(([key, value]) => {
35 
            if (key in getValues()) {
36 
              setError(key, { type: 'manual', message: value[0] })
37 
            }
38 
          })
39 
        } else if (typeof data.data === 'string') {
40 
          addNotification({
41 
            style: 'danger',
42 
            msg: data.data,
43 
          })
44 
        } else {
45 
          addNotification({
46 
            style: 'danger',
47 
            msg: 'Ha ocurrido un error, por favor intente más tarde',
48 
          })
49 
        }
50 
      }
51 
    })
52 
    setLoading(false)
53 
  }
54 
 
55 
  return (
56 
    <Modal
57 
      show={show}
58 
      onHide={onHide}
59 
      aria-labelledby="contained-modal-title-vcenter"
60 
      centered
61 
    >
62 
      <Modal.Header closeButton>
63 
        <Modal.Title id="contained-modal-title-vcenter">
64 
          Perfil de Applicación
65 
        </Modal.Title>
66 
      </Modal.Header>
67 
      <form onSubmit={handleSubmit(handleOnSubmit)}>
68 
        <Modal.Body>
69 
          <div className="form-groupp">
70 
            <select
71 
              name="user_profile_id"
72 
              id="user_profile_id"
73 
              defaultValue=""
74 
              ref={register({
75 
                required: 'Por favor seleccione un perfil',
76 
              })}
77 
            >
78 
              <option value="">Perfil de applicación</option>
79 
              {Object.entries(userProfiles).map(([key, value]) => (
80 
                <option value={key} key={key}>
81 
                  {value}
82 
                </option>
83 
              ))}
84 
            </select>
85 
            {errors?.user_profile_id?.message && (
86 
              <FormErrorFeedback>
87 
                {errors.user_profile_id.message}
88 
              </FormErrorFeedback>
89 
            )}
90 
          </div>
91 
        </Modal.Body>
92 
        <Modal.Footer>
93 
          <Button type="submit">Aplicar</Button>
94 
          <Button onClick={onHide}>Cancelar</Button>
95 
        </Modal.Footer>
96 
      </form>
97 
      {loading && (
98 
        <LoaderContainer>
99 
          <Spinner />
100 
        </LoaderContainer>
101 
      )}
102 
    </Modal>
103 
  )
104 
}
105 
 
106 
const mapDispatchToProps = {
107 
  addNotification: (notification) => addNotification(notification),
108 
}
109 
 
110 
export default connect(null, mapDispatchToProps)(ApplyModal)