Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

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