Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
5104 stevensc 1 
/* eslint-disable camelcase */
2 
import React, { useEffect, useState } from 'react'
5411 stevensc 3 
import { useDispatch, useSelector } from 'react-redux'
5104 stevensc 4 
import { addNotification } from '../../../redux/notification/notification.actions'
5 
import { axios } from '../../../utils'
6 
import EmptySection from '../../empty-section/EmptySection'
1 www 7 
 
4014 stevensc 8 
const PeopleYouMayKnow = () => {
5104 stevensc 9 
  const [peopleYouMayKnow, setPeopleYouMayKnow] = useState([])
10 
  const [lookMore, setLookMore] = useState(false)
2885 stevensc 11 
  const dispatch = useDispatch()
5411 stevensc 12 
  const labels = useSelector(state => state.labels)
1 www 13 
 
2885 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 
        }
25 
 
4014 stevensc 26 
        dispatch(addNotification({
27 
          style: 'success',
28 
          msg: data.data
29 
        }))
30 
        return getSuggestion()
2885 stevensc 31 
      })
32 
  }
33 
 
5104 stevensc 34 
  const getSuggestion = async (url = '/helpers/people-you-may-know') => {
4014 stevensc 35 
    try {
4111 stevensc 36 
      const { data: response } = await axios.get(url)
5104 stevensc 37 
      if (response.success) setPeopleYouMayKnow(response.data)
4014 stevensc 38 
    } catch (error) {
5104 stevensc 39 
      console.log(error)
4014 stevensc 40 
    }
41 
  }
42 
 
43 
  useEffect(() => {
44 
    getSuggestion()
5104 stevensc 45 
  }, [])
4014 stevensc 46 
 
4110 stevensc 47 
  const dataSlice = () => {
48 
    let infoFollows = [...peopleYouMayKnow]
49 
    if (!lookMore) {
50 
      infoFollows = infoFollows.slice(0, 3)
51 
    }
52 
    return infoFollows
53 
  }
54 
 
1 www 55 
  return (
5411 stevensc 56 
    <div className='suggests_widget'>
57 
      <div className="suggests_widget-header">
58 
        <h3>{`${labels.CONNECT_WITH}:`}</h3>
5104 stevensc 59 
        {peopleYouMayKnow.length >= 4 &&
5438 stevensc 60 
          <span onClick={() => setLookMore(!lookMore)}>
5411 stevensc 61 
            {lookMore ? labels.VIEW_LESS : labels.VIEW_MORE}
5438 stevensc 62 
          </span>}
2890 stevensc 63 
      </div>
3837 stevensc 64 
      <div className='suggest-list'>
4014 stevensc 65 
        {peopleYouMayKnow.length
4110 stevensc 66 
          ? dataSlice().map(({ id, image, link_cancel, link_request, name, profile }) =>
4090 stevensc 67 
            <div className='user' key={id}>
3921 stevensc 68 
              <div className="w-100 d-flex align-items-center" style={{ gap: '.5rem' }}>
69 
                <a href={profile} target="_blank" rel="noreferrer">
70 
                  <img src={image} alt={`${name} profile image`} />
71 
                </a>
4090 stevensc 72 
                <h4 className="break-ellipsis">{name}</h4>
3921 stevensc 73 
              </div>
4091 stevensc 74 
              {link_request &&
75 
                <button
76 
                  className="btn btn-primary"
77 
                  onClick={() => handleConnect(link_request)}
78 
                >
5411 stevensc 79 
                  {labels.CONNECT}
4091 stevensc 80 
                </button>
81 
              }
82 
              {link_cancel &&
83 
                <button
84 
                  className="btn btn-secondary"
85 
                  onClick={() => handleConnect(link_cancel)}
86 
                >
5411 stevensc 87 
                  {labels.CANCEL}
4091 stevensc 88 
                </button>
89 
              }
3921 stevensc 90 
            </div>
91 
          )
5411 stevensc 92 
          : <EmptySection align='left' message={labels.DATATABLE_EMPTY} />
3506 stevensc 93 
        }
2890 stevensc 94 
      </div>
5104 stevensc 95 
    </div>
96 
  )
97 
}
1 www 98 
 
5104 stevensc 99 
export default PeopleYouMayKnow