Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable camelcase */
/* eslint-disable react/prop-types */
import React, { useEffect, useState } from 'react'
import { debounce } from '../../../../utils'
import Profile from '../../../../components/Profile'
import SearchList from '../../../../components/SearchList'
import TitleSection from '../../../../components/TitleSection'
import Spinner from '../../../../shared/loading-spinner/Spinner'
import AddProfileModal from '../add-profile-modal/AddProfileModal'
import { searchEntities } from '../../../../services/search'
import { addNotification } from '../../../../redux/notification/notification.actions'
import EmptySection from '../../../../shared/empty-section/EmptySection'

const MyProfiles = ({ allowAdd, allowEdit, allowDelete }) => {
  const [myProfiles, setMyProfiles] = useState([])
  const [loading, setLoading] = useState(true)
  const [showAddProfileModal, setShowAddProfileModal] = useState(false)

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

  const getProfiles = async (searchValue = '') => {
    setLoading(true)
    const response = await searchEntities('profile/my-profiles', searchValue)

    if (!response.success) {
      addNotification({ style: 'danger', msg: response.data })
      setLoading(false)
      return
    }

    setMyProfiles(response.data)
    setLoading(false)
  }

  const handleSearch = debounce((value) => getProfiles(value), 500)

  const handleShowAddProfileModal = () => setShowAddProfileModal(!showAddProfileModal)

  return (
    <>
      <section className="companies-info container">
        <TitleSection allowAdd={allowAdd} title={LABELS.MY_PROFILES} onAdd={handleShowAddProfileModal} />
        <SearchList onChange={handleSearch} />
        <div className="companies-list">
          {loading && <Spinner />}
          {(!loading && Boolean(!myProfiles.length)) && <EmptySection align='left' message={LABELS.DATATABLE_SZERORECORDS} />}
          {(!loading && Boolean(myProfiles.length)) &&
            myProfiles.map(({ image, name, status, link_view, link_edit, link_delete }, id) =>
              <Profile
                key={id}
                image={image}
                name={name}
                status={status}
                link_view={link_view}
                link_edit={allowEdit && link_edit}
                link_delete={allowDelete && link_delete}
                fetchCallback={getProfiles}
              />
            )}
        </div>
      </section>
      <AddProfileModal
        show={showAddProfileModal}
        onHide={handleShowAddProfileModal}
        getProfiles={getProfiles}
      />
    </>
  )
}

export default MyProfiles