Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

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