Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6301 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6301 stevensc 1 
import React from 'react'
6311 stevensc 2 
import { Modal } from 'react-bootstrap'
6301 stevensc 3 
import FormErrorFeedback from '../../../shared/form-error-feedback/FormErrorFeedback'
4 
import { useForm } from 'react-hook-form'
5 
import { axios } from '../../../utils'
6 
import { addNotification } from '../../../redux/notification/notification.actions'
7 
import { useDispatch } from 'react-redux'
8 
 
9 
const CreateGroupModal = ({ isOpen, onClose }) => {
10 
  const { register, handleSubmit, errors } = useForm()
11 
  const dispatch = useDispatch()
12 
 
13 
  const onSubmitHandler = async (data) => {
14 
    const formData = new FormData()
15 
    Object.entries(data).map(([key, value]) => formData.append(key, value))
16 
    axios
17 
      .post('/chat/create-group', formData)
18 
      .then(({ data: response }) => {
19 
        const { success } = response
20 
 
21 
        if (!success) {
22 
          dispatch(
23 
            addNotification({
24 
              style: 'danger',
25 
              message: 'Ha ocurrido un error, por favor intente más tarde.',
26 
            })
27 
          )
28 
          return
29 
        }
30 
 
31 
        onClose()
32 
      })
33 
      .catch((error) => {
34 
        dispatch(
35 
          addNotification({
36 
            style: 'danger',
37 
            message: 'Ha ocurrido un error, por favor intente más tarde.',
38 
          })
39 
        )
40 
        throw new Error(error)
41 
      })
42 
  }
43 
  return (
44 
    <Modal show={isOpen} onHide={onClose}>
45 
      <Modal.Header closeButton>
46 
        <Modal.Title>Crear grupo</Modal.Title>
47 
      </Modal.Header>
48 
      <Modal.Body>
49 
        <form onSubmit={handleSubmit(onSubmitHandler)}>
50 
          <label className="mb-1" htmlFor="name">
51 
            Nombre del grupo
52 
          </label>
53 
          <input
54 
            type="text"
55 
            name="name"
56 
            id="name"
57 
            ref={register({ required: 'Este campo es requerido' })}
58 
          />
59 
          {errors.name && (
60 
            <FormErrorFeedback>{errors.name.message}</FormErrorFeedback>
61 
          )}
6311 stevensc 62 
          <div className="mt-3 d-flex gap-3">
63 
            <button className="btn btn-primary" type="submit">
64 
              Enviar
65 
            </button>
66 
            <button className="btn btn-secondary" onClick={onClose}>
67 
              Cancelar
68 
            </button>
69 
          </div>
6301 stevensc 70 
        </form>
71 
      </Modal.Body>
72 
    </Modal>
73 
  )
74 
}
75 
 
76 
export default CreateGroupModal