Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import axios from 'axios'
import React, { useEffect, useState } from 'react'
import EmptySection from '../../empty-section/EmptySection'
import { useSelector } from 'react-redux'

const SuggestWidget = ({
  title = 'Mis Grupos:',
  url = '/helpers/my-groups',
  btnLabelAccept = 'Ver'
}) => {
  const [widgetData, setWidgetData] = useState([])
  const [lookMore, setLookMore] = useState(false)
  const labels = useSelector(state => state.labels)

  const getData = () => {
    axios.get(url)
      .then(({ data: response }) => {
        const { success, data } = response
        if (success) {
          setWidgetData(data.sort((a, b) => a.priority - b.priority).reverse())
        }
      })
  }

  useEffect(() => {
    getData()
  }, [])

  const dataSlice = () => {
    let infoFollows = [...widgetData]

    if (!lookMore) infoFollows = infoFollows.slice(0, 1)

    return infoFollows
  }

  return (
    <div className='suggests_widget'>
      <div className="suggests_widget-header">
        <h3>{title}</h3>
        {widgetData.length >= 3 &&
          <span onClick={() => setLookMore(!lookMore)}>
            {lookMore ? labels.VIEW_LESS : labels.VIEW_MORE}
          </span>}
      </div>
      <div className="suggest-list">
        {widgetData.length
          ? dataSlice().map((suggest) => <SuggestWidget.Item key={suggest.id} suggest={suggest} btnLabelAccept={btnLabelAccept}/>)
          : <EmptySection align='left' message={labels.DATATABLE_EMPTY} />
        }
      </div>
    </div>
  )
}

const Item = ({ suggest, btnLabelAccept }) => {
  return (
    <div className='user'>
      <div className="d-inline-flex align-items-center">
        <a href={suggest.profile} target="_blank" rel="noreferrer">
          <img src={suggest.image} alt={`${suggest.name} profile image`} />
        </a>
        <h4 className='break-ellipsis'>{suggest.name}</h4>
      </div>
      <a className="btn btn-primary ml-auto" href={suggest.profile}>
        {btnLabelAccept}
      </a>
    </div>
  )
}

SuggestWidget.Item = Item

export default SuggestWidget