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