Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4322 stevensc 1 
import React, { useEffect, useState } from "react";
4324 stevensc 2 
import { axios } from "../../../../utils";
4322 stevensc 3 
import { useDispatch } from "react-redux";
4 
import { addNotification } from "../../../../redux/notification/notification.actions";
4323 stevensc 5 
import EastIcon from '@mui/icons-material/East';
6 
import EmptySection from "../../../../shared/empty-section/EmptySection";
7 
import './Widget.scss'
4322 stevensc 8 
 
9 
const PeopleYouMayKnow = () => {
10 
 
4323 stevensc 11 
    const [peopleYouMayKnow, setPeopleYouMayKnow] = useState([]);
12 
    const dispatch = useDispatch()
4322 stevensc 13 
 
4323 stevensc 14 
    const handleConnect = (url) => {
15 
        axios.post(url)
16 
            .then(({ data }) => {
17 
                if (!data.success) {
18 
                    return dispatch(addNotification({
19 
                        style: 'danger',
20 
                        msg: typeof data.data === 'string'
21 
                            ? data.data
22 
                            : 'Ha ocurrido un error'
23 
                    }))
24 
                }
4322 stevensc 25 
 
4323 stevensc 26 
                dispatch(addNotification({
27 
                    style: 'success',
28 
                    msg: data.data
29 
                }))
30 
                return getSuggestion()
31 
            })
32 
    }
4322 stevensc 33 
 
4323 stevensc 34 
    const getSuggestion = async (url = `/helpers/people-you-may-know`) => {
35 
        try {
36 
            const { data: response } = await axios.get(url)
37 
            if (response.success) setPeopleYouMayKnow(response.data.slice(0, 3));
38 
        } catch (error) {
39 
            console.log(error);
40 
        }
4322 stevensc 41 
    }
42 
 
4323 stevensc 43 
    useEffect(() => {
44 
        getSuggestion()
45 
    }, []);
4322 stevensc 46 
 
4323 stevensc 47 
    return (
4324 stevensc 48 
        <div className='linked__widget'>
4323 stevensc 49 
            <div className="linked__widget-header">
50 
                <h3>Conecta con:</h3>
4322 stevensc 51 
            </div>
4326 stevensc 52 
            <div className='linked__widget-list'>
4323 stevensc 53 
                {peopleYouMayKnow.length
54 
                    ? peopleYouMayKnow.map(({ id, image, link_cancel, link_request, name, profile }) => {
55 
                        return (
56 
                            <div className="linked__widget-content" key={id}>
57 
                                <a href={profile} target="_blank" rel="noreferrer">
58 
                                    <img src={image} alt={`${name} profile image`} />
59 
                                </a>
60 
                                <div className="linked__widget-info">
61 
                                    <h4>{name}</h4>
62 
                                    {link_request &&
63 
                                        <button
64 
                                            className="btn btn-primary"
65 
                                            onClick={() => handleConnect(link_request)}
66 
                                        >
67 
                                            Conectar
68 
                                        </button>
69 
                                    }
70 
                                    {link_cancel &&
71 
                                        <button
72 
                                            className="btn btn-secondary"
73 
                                            onClick={() => handleConnect(link_cancel)}
74 
                                        >
75 
                                            Cancelar
76 
                                        </button>
77 
                                    }
78 
                                </div>
79 
                            </div>
80 
                        )
81 
                    })
82 
                    : <EmptySection message="Sin sugerencias" />
83 
                }
84 
            </div>
85 
            <a href="/connection/people-you-may-know" target='_blank' >
86 
                Ver todas las recomendaciones
87 
                <EastIcon className="ml-2" />
88 
            </a>
89 
        </div >
90 
    );
4322 stevensc 91 
};
92 
 
93 
export default PeopleYouMayKnow;