Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
6336 stevensc 1 
import React, { useEffect, useState } from 'react'
2 
import { axios } from '../../../utils'
3 
import Spinner from '../../../shared/loading-spinner/Spinner'
4 
import { IconButton } from '@mui/material'
5 
import { AddRounded } from '@mui/icons-material'
6 
import { useDispatch } from 'react-redux'
7 
import { addNotification } from '../../../redux/notification/notification.actions'
8 
 
9 
const AddMember = ({ group }) => {
6340 stevensc 10 
  const { url_add_user_to_group, url_get_contacts_availables_for_group } = group
6336 stevensc 11 
  const [contacts, setContacts] = useState([])
12 
  const [loading, setLoading] = useState(false)
13 
  const dispatch = useDispatch()
14 
 
15 
  const getContacts = async () => {
16 
    setLoading(true)
17 
    axios
18 
      .get(url_get_contacts_availables_for_group)
19 
      .then(({ data: response }) => {
20 
        const { data, success } = response
21 
        if (!success) {
22 
          typeof data === 'string'
23 
            ? dispatch(addNotification({ style: 'danger', msg: data }))
24 
            : dispatch(
25 
                addNotification({
26 
                  style: 'danger',
27 
                  msg: 'Ha ocurrioo un error',
28 
                })
29 
              )
30 
          return
31 
        }
32 
 
33 
        setContacts(data)
34 
        setLoading(false)
35 
      })
36 
      .catch((err) => {
37 
        console.log(err)
38 
        throw new Error(err)
39 
      })
40 
      .finally(() => setLoading(false))
41 
  }
42 
 
43 
  const handleAddMember = async (id) => {
44 
    setLoading(true)
45 
    const formData = new FormData()
46 
    formData.append('uid', id)
47 
    axios
48 
      .post(url_add_user_to_group, formData)
49 
      .then(async ({ data: response }) => {
50 
        const { data, success } = response
51 
        if (!success) {
52 
          typeof data === 'string'
53 
            ? dispatch(addNotification({ style: 'danger', msg: data }))
54 
            : dispatch(
55 
                addNotification({
56 
                  style: 'danger',
57 
                  msg: 'Ha ocurrioo un error',
58 
                })
59 
              )
60 
          return
61 
        }
62 
 
63 
        await getContacts()
64 
        setLoading(false)
65 
      })
66 
      .catch((err) => {
67 
        console.log(err)
68 
        throw new Error(err)
69 
      })
70 
      .finally(() => setLoading(false))
71 
  }
72 
 
73 
  useEffect(() => {
74 
    getContacts()
75 
  }, [])
76 
 
77 
  return (
78 
    <div className="add-member">
6343 stevensc 79 
      <ul>
80 
        {contacts.map((member) => (
81 
          <li key={member.id}>
82 
            <AddMember.Item
83 
              {...member}
84 
              onClick={() => handleAddMember(member.id)}
85 
            />
86 
          </li>
87 
        ))}
88 
      </ul>
6336 stevensc 89 
      {loading && <Spinner />}
90 
    </div>
91 
  )
92 
}
93 
 
94 
const Item = ({ image, name, onClick }) => {
95 
  return (
96 
    <div className="entity">
97 
      <img src={image} alt={`user_${name}-image`} />
98 
      <span>{name}</span>
99 
      <IconButton onClick={onClick}>
100 
        <AddRounded />
101 
      </IconButton>
102 
    </div>
103 
  )
104 
}
105 
 
106 
AddMember.Item = Item
107 
 
108 
export default AddMember