Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 2802 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 2802 Rev 2858
Línea 1... Línea 1...
1 
import React from 'react'
 1 
import React from 'react'
2 
import { useDispatch } from 'react-redux'
 2 
import { useDispatch } from 'react-redux'
3 
import { useForm } from 'react-hook-form'
 3 
import { useForm } from 'react-hook-form'
Línea 4... Línea 4...
4 
 
 4 
 
5 
import { axios } from '../../utils'
 - 
 
6 
import { addNotification } from '../../redux/notification/notification.actions'
 5 
import { axios } from '@app/utils'
- 
 
 6 
import { useFetchHelper } from '@hooks'
Línea 7... Línea 7...
7 
import { useFetchHelper } from '@hooks'
 7 
import { addNotification } from '@app/redux/notification/notification.actions'
8 
 
 8 
 
9 
import Modal from 'components/UI/modal/Modal'
 9 
import Modal from '@components/UI/modal/Modal'
Línea 10... Línea 10...
10 
import FormErrorFeedback from 'components/UI/form/FormErrorFeedback'
 10 
import Input from '@components/UI/inputs/Input'
11 
import Input from '../UI/inputs/Input'
 11 
import Select from '@components/UI/inputs/Select'
12 
 
 12 
 
13 
const AddGroupModal = ({ show, onHide, fetchGroups }) => {
 13 
const AddGroupModal = ({ show, onHide, fetchGroups }) => {
Línea 14... Línea 14...
14 
  const { data: groupTypes } = useFetchHelper('group-types')
 14 
  const { data: groupTypes } = useFetchHelper('group-types')
15 
  const { data: industries } = useFetchHelper('industries')
 15 
  const { data: industries } = useFetchHelper('industries')
16 
  const dispatch = useDispatch()
 16 
  const dispatch = useDispatch()
17 
 
 - 
 
18 
  const {
 17 
 
19 
    register,
 18 
  const {
Línea 20... Línea 19...
20 
    handleSubmit,
 19 
    control,
21 
    setError,
 20 
    handleSubmit,
22 
    formState: { errors }
 21 
    formState: { errors }
Línea 23... Línea 22...
23 
  } = useForm()
 22 
  } = useForm()
24 
 
 23 
 
25 
  const onSubmit = handleSubmit((data) => {
 24 
  const onSubmit = handleSubmit((data) => {
26 
    const formData = new FormData()
 25 
    const formData = new FormData()
27 
    Object.entries(data).forEach(([key, value]) => formData.append(key, value))
 - 
 
28 
 
 - 
 
29 
    axios
 - 
 
30 
      .post(`/group/my-groups/add`, formData)
 - 
 
31 
      .then(({ data: responseData }) => {
 - 
 
32 
        const { data, success } = responseData
 - 
 
33 
 
 - 
 
34 
        if (!success) {
 - 
 
35 
          const errorMessage = data
 - 
 
36 
          const isObject = typeof errorMessage === 'object'
 - 
 
37 
 
 - 
 
38 
          if (isObject) {
 - 
 
39 
            Object.entries(errorMessage).map(([key, value]) =>
 - 
 
40 
              setError(key, {
 - 
 
41 
                type: 'manual',
 - 
 
42 
                message: Array.isArray(value) ? value[0] : value
 26 
    Object.entries(data).forEach(([key, value]) => formData.append(key, value))
43 
              })
 - 
 
44 
            )
 - 
 
45 
            return
 27 
 
46 
          }
 28 
    axios
47 
 
 29 
      .post(`/group/my-groups/add`, formData)
48 
          throw new Error(errorMessage)
 30 
      .then(({ data: responseData }) => {
49 
        }
 31 
        const { success } = responseData
Línea 57... Línea 39...
57 
  })
 39 
  })
Línea 58... Línea 40...
58 
 
 40 
 
59 
  return (
 41 
  return (
60 
    <Modal title='Nuevo Grupo' show={show} onClose={onHide} onAccept={onSubmit}>
 42 
    <Modal title='Nuevo Grupo' show={show} onClose={onHide} onAccept={onSubmit}>
- 
 
 43 
      <Input
61 
      <Input
 44 
        label='Nombre'
62 
        name='name'
 45 
        name='name'
63 
        placeholder='Nombre del grupo'
 46 
        placeholder='Nombre del grupo'
64 
        inputRef={register({
 47 
        control={control}
65 
          required: 'Por favor ingrese el nombre del grupo'
 - 
 
66 
        })}
 48 
        rules={{ required: 'Este campo es requerido' }}
67 
        error={errors.name?.message}
 49 
        error={errors.name?.message}
Línea 68... Línea -...
68 
      />
 - 
 
69 
 
 50 
      />
70 
      <div className='form-group'>
 51 
 
71 
        <select
 52 
      <Select
72 
          name='type_id'
 - 
 
73 
          id='type_id'
 53 
        label='Industria'
74 
          defaultValue=''
 54 
        name='type_id'
75 
          ref={register({
 - 
 
76 
            required: 'Por favor eliga un tipo'
 - 
 
77 
          })}
 - 
 
78 
        >
 - 
 
79 
          <option value='' hidden>
 - 
 
80 
            Tipo
 55 
        control={control}
81 
          </option>
 - 
 
82 
          {groupTypes.map(({ name, value }) => (
 - 
 
83 
            <option value={value} key={name}>
 - 
 
84 
              {name}
 - 
 
85 
            </option>
 - 
 
86 
          ))}
 56 
        rules={{ required: 'Por favor eliga un tipo' }}
87 
        </select>
 - 
 
88 
        {errors.type_id && (
 - 
 
89 
          <FormErrorFeedback>{errors.type_id.message}</FormErrorFeedback>
 57 
        error={errors.type_id?.message}
90 
        )}
 58 
        options={groupTypes}
91 
      </div>
 - 
 
92 
 
 59 
      />
93 
      <div className='form-group'>
 60 
 
94 
        <select
 61 
      <Select
95 
          name='industry_id'
 - 
 
96 
          id='industry_id'
 62 
        label='Tipo'
97 
          defaultValue=''
 63 
        name='industry_id'
98 
          ref={register({
 - 
 
99 
            required: 'Por favor eliga una industria'
 - 
 
100 
          })}
 - 
 
101 
        >
 - 
 
102 
          <option value='' hidden>
 - 
 
103 
            Industria
 - 
 
104 
          </option>
 64 
        control={control}
105 
          {industries.map(({ name, value }) => (
 - 
 
106 
            <option value={value} key={value}>
 - 
 
107 
              {name}
 - 
 
108 
            </option>
 - 
 
109 
          ))}
 65 
        rules={{ required: 'Por favor eliga un tipo' }}
110 
        </select>
 - 
 
111 
        {errors.industry_id && (
 - 
 
112 
          <FormErrorFeedback>{errors.industry_id.message}</FormErrorFeedback>
 66 
        error={errors.industry_id?.message}
113 
        )}
 67 
        options={industries}
114 
      </div>
 68 
      />
115 
    </Modal>
 69 
    </Modal>
Línea 116... Línea 70...
116 
  )
 70 
  )