Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable camelcase */

import React, { useEffect, useState } from 'react'

import { debounce } from '../../../utils'

import { useDispatch } from 'react-redux'

import { addNotification } from '../../../redux/notification/notification.actions'

import { searchEntities } from '../../../services/search'

import Spinner from '../../../shared/loading-spinner/Spinner'

import AddCompanyModal from './add-company-modal/AddCompanyModal'

import SearchList from '../../../components/SearchList'

import Profile from '../../../components/Profile'

import TitleSection from '../../../components/TitleSection'

import EmptySection from '../../../shared/empty-section/EmptySection'

const MyCompanies = ({ companySizes, industries }) => {

  const [companies, setCompanies] = useState([])

  const [loading, setLoading] = useState(true)

  const [showAddCompanyModal, setShowCompanyModal] = useState(false)

  const dispatch = useDispatch()

  useEffect(() => {

    getCompanies()

  }, [])

  const getCompanies = async (searchValue = '') => {

    setLoading(true)

    const response = await searchEntities('company/my-companies', searchValue)

    if (!response.success) {

      dispatch(addNotification({ style: 'danger', msg: response.data }))

      setLoading(false)

      return

    }

    setCompanies(response.data)

    setLoading(false)

  }

  const handleShowAddCompanyModal = () => {

    setShowCompanyModal(!showAddCompanyModal)

  }

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

  return (

    <section className="companies-info container">

      <TitleSection title={LABELS.MY_COMPANIES} allowAdd onAdd={handleShowAddCompanyModal} />

      <SearchList onChange={handleSearch} />

      <div className="companies-list">

        {loading && <Spinner />}

        {(!loading && Boolean(!companies.length)) && <EmptySection align='left' message={LABELS.DATATABLE_SZERORECORDS} />}

        {(!loading && Boolean(companies.length)) &&

          companies.map(({ image, link_my_company, link_view, name, status }, id) =>

            <Profile

              link_admin={link_my_company}

              key={id}

              name={name}

              image={image}

              status={status}

              link_view={link_view}

              btnAcceptTitle={LABELS.VIEW_COMPANY}

            />

          )}

      </div>

      <AddCompanyModal

        show={showAddCompanyModal}

        onHide={handleShowAddCompanyModal}

        fetchCompanies={getCompanies}

        companySizes={companySizes}

        industries={industries}

      />

    </section>

  )

}

export default MyCompanies