Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 2885 | Rev 2888 | 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 
import styles from "./peopleYouMayKnow.module.scss";
7 
 
8 
const PeopleYouMayKnow = () => {
9 
  // states
10 
  const [peopleYouMayKnow, setPeopleYouMayKnow] = useState([]);
11 
  const [error, setError] = useState("");
2885 stevensc 12 
  const dispatch = useDispatch()
1 www 13 
 
14 
  useEffect(() => {
15 
    axios.get(`/helpers/people-you-may-know`).then((response) => {
16 
      const resData = response.data;
17 
      if (resData.success) {
18 
        setPeopleYouMayKnow(resData.data);
19 
      } else {
20 
        // alert error
21 
      }
22 
    });
23 
  }, []);
24 
 
2885 stevensc 25 
  const handleConnect = (url) => {
26 
    axios.post(url)
27 
      .then(({ data }) => {
28 
        if (!data.success) {
29 
          return dispatch(addNotification({
30 
            style: 'danger',
31 
            msg: typeof data.data === 'string'
32 
              ? data.data
33 
              : 'Ha ocurrido un error'
34 
          }))
35 
        }
36 
 
37 
        return dispatch(addNotification({
38 
          style: 'success',
39 
          msg: data.data
40 
        }))
41 
      })
42 
  }
43 
 
1 www 44 
  return (
2883 stevensc 45 
    <div className={styles.peopleYouMayKnow} id="suggestions-list-people-you-may-know">
1 www 46 
      <div className="sd-title">
47 
        <h3>Personas que puede conocer</h3>
48 
      </div>
49 
      <>
50 
        <div className={styles.suggestionList}>
51 
          {peopleYouMayKnow.length ? (
52 
            <React.Fragment>
53 
              {error ? (
54 
                <div className="suggestion-usd"> Ha ocurrido un error :( </div>
55 
              ) : (
2883 stevensc 56 
                peopleYouMayKnow.map(({ id, image, link_cancel, link_request, name, profile, relation }) => (
1 www 57 
                  <div className={styles.user} key={id}>
2887 stevensc 58 
                    <div className="w-100 d-flex align-items-center">
1 www 59 
                      <a href={profile} target="_blank">
2885 stevensc 60 
                        <img src={image} alt={`${name} profile image`} />
1 www 61 
                      </a>
2885 stevensc 62 
                      <h4>{name}</h4>
1 www 63 
                    </div>
2887 stevensc 64 
                    <div className="w-100 d-flex align-items-center justify-content-center">
2885 stevensc 65 
                      {
66 
                        link_request
67 
                        &&
68 
                        <button
69 
                          className="btn btn-primary"
70 
                          onClick={() => handleConnect(link_request)}
71 
                        >
72 
                          Conectar
73 
                        </button>
74 
                      }
75 
                      {
76 
                        link_cancel
77 
                        &&
78 
                        <button
79 
                          className="btn btn-secondary"
80 
                          onClick={() => handleConnect(link_cancel)}
81 
                        >
82 
                          Cancelar
83 
                        </button>
84 
                      }
85 
                    </div>
1 www 86 
                  </div>
87 
                ))
88 
              )}
2232 stevensc 89 
 
1 www 90 
            </React.Fragment>
91 
          ) : (
92 
            <div className="view-more">Sin sugerencias</div>
93 
          )}
94 
        </div>
95 
        {
96 
          !error && (
97 
            <div className={styles.viewMore}>
2232 stevensc 98 
              <a href="/connection/people-you-may-know" target="_blank">
99 
                <button
100 
                  className="btn btn-primary"
101 
                  type="button"
102 
                  style={{ padding: '2px 10px' }}
103 
                >
104 
                  Ver más
105 
                </button>
106 
              </a>
1 www 107 
            </div>
108 
          )
109 
        }
110 
      </>
2885 stevensc 111 
    </div >
1 www 112 
  );
113 
};
114 
 
115 
export default PeopleYouMayKnow;