Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 4090 | Rev 4110 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
4014 stevensc 1
import React, { useEffect, useState } from "react";
2885 stevensc 2
import { useDispatch } from "react-redux";
3
import { addNotification } from "../../../redux/notification/notification.actions";
2232 stevensc 4
import { axios } from "../../../utils";
1 www 5
 
4014 stevensc 6
const PeopleYouMayKnow = () => {
4006 stevensc 7
 
4014 stevensc 8
  const [peopleYouMayKnow, setPeopleYouMayKnow] = useState([]);
2885 stevensc 9
  const dispatch = useDispatch()
1 www 10
 
2885 stevensc 11
  const handleConnect = (url) => {
12
    axios.post(url)
13
      .then(({ data }) => {
14
        if (!data.success) {
15
          return dispatch(addNotification({
16
            style: 'danger',
17
            msg: typeof data.data === 'string'
18
              ? data.data
19
              : 'Ha ocurrido un error'
20
          }))
21
        }
22
 
4014 stevensc 23
        dispatch(addNotification({
24
          style: 'success',
25
          msg: data.data
26
        }))
27
        return getSuggestion()
2885 stevensc 28
      })
29
  }
30
 
4014 stevensc 31
  const getSuggestion = async (url = `/helpers/people-you-may-know`) => {
32
    try {
33
      const { data } = await axios.get(url)
34
      const resData = [...data.data].slice(0, 3);
35
      if (data.success) setPeopleYouMayKnow(resData);
36
    } catch (error) {
37
      console.log(error);
38
    }
39
  }
40
 
41
  useEffect(() => {
42
    getSuggestion()
43
  }, []);
44
 
1 www 45
  return (
3921 stevensc 46
    <div className='peopleYouMayKnow'>
2890 stevensc 47
      <div className="sd-title d-flex align-items-center justify-content-between">
48
        <h3>Conecta con:</h3>
3921 stevensc 49
        <a href="/connection/people-you-may-know" target="_blank">
50
          Ver más
51
        </a>
2890 stevensc 52
      </div>
3837 stevensc 53
      <div className='suggest-list'>
4014 stevensc 54
        {peopleYouMayKnow.length
3921 stevensc 55
          ? peopleYouMayKnow.map(({ id, image, link_cancel, link_request, name, profile }) =>
4090 stevensc 56
            <div className='user' key={id}>
3921 stevensc 57
              <div className="w-100 d-flex align-items-center" style={{ gap: '.5rem' }}>
58
                <a href={profile} target="_blank" rel="noreferrer">
59
                  <img src={image} alt={`${name} profile image`} />
60
                </a>
4090 stevensc 61
                <h4 className="break-ellipsis">{name}</h4>
3921 stevensc 62
              </div>
4091 stevensc 63
              {link_request &&
64
                <button
65
                  className="btn btn-primary"
66
                  onClick={() => handleConnect(link_request)}
67
                >
68
                  Conectar
69
                </button>
70
              }
71
              {link_cancel &&
72
                <button
73
                  className="btn btn-secondary"
74
                  onClick={() => handleConnect(link_cancel)}
75
                >
76
                  Cancelar
77
                </button>
78
              }
3921 stevensc 79
            </div>
80
          )
3506 stevensc 81
          : <div className="view-more">Sin sugerencias</div>
82
        }
2890 stevensc 83
      </div>
2885 stevensc 84
    </div >
1 www 85
  );
86
};
87
 
88
export default PeopleYouMayKnow;