Proyectos de Subversion LeadersLinked - Backend

import React, { useState } from 'react'
import axios from 'axios'
import DeleteModal from '../../shared/DeleteModal'
import TableFilters from '../components/TableFilters'
import AddModal from '../components/Modals/AddModal'
import AppliedModal from '../components/Modals/AppliedModal'

const JobsTableView = ({ backendVars, labels }) => {

        const {
                allowAdd,
                allowDelete,
                allowEdit,
                allowUsersWhoApplied,
                link_add,
                link_table,
                onEdit,
                googleApi,
                jobCategoryOptions
        } = backendVars
        
        const [companyData, setCompanyData] = useState({})
        const [showModal, setShowModal] = useState(false)
        const [showDeleteModal, setShowDeleteModal] = useState(false)
        const [actionLink, setActionLink] = useState(link_add)
        const [appliedModal, setAppliedModal] = useState(false)

        const headers = [
                { key: 'last_date_of_application', label: 'Último día de aplicación', isSorteable: true },
                { key: 'title', label: 'Título', isSorteable: true },
                { key: 'details', label: 'Detalles', isSorteable: true },
                { key: 'actions', label: 'Acciones', isSorteable: false }
        ]

        const getData = (search = '', start = 1, length = 10) => {
                axios.get(
                        link_table,
                        {
                                params: {
                                        search: search,
                                        start: start,
                                        length: length
                                }
                        })
                        .then(({ data }) => {
                                if (data.success) {
                                        setCompanyData(data.data)

                                        return data.data
                                }
                        })
                        .catch((err) => console.log(err))
        }

        const closeModal = () => {
                setShowModal(false)
                setActionLink(link_add)
        }

        const closeAppliedModal = () => {
                setAppliedModal(false)
                setActionLink(link_add)
        }

        const closeDeleteModal = () => {
                setShowDeleteModal(false)
                setActionLink(link_add)
        }

        const deleteItem = (item) => {
                setActionLink(item.actions.link_delete)
                setShowDeleteModal(true)
        }

        const addItem = () => {
                setActionLink(link_add)
                setShowModal(true)
        }

        const handleUserWhoApplied = (link) => {
                setActionLink(link)
                setAppliedModal(true)
        }

        return (
                <>
                        <section className="content-header">
                                <div className="container-fluid">
                                        <div className="row mb-2">
                                                <div className="col-sm-12">
                                                        <h1>{labels.JOBS}</h1>
                                                </div>
                                        </div>
                                </div>
                        </section>
                        <TableFilters
                                data={companyData}
                                getData={getData}
                                onDelete={deleteItem}
                                onAdd={addItem}
                                onEdit={onEdit}
                                headers={headers}
                                allowAdd={allowAdd}
                                allowEdit={allowEdit}
                                allowDelete={allowDelete}
                                allowUsersWhoApplied={allowUsersWhoApplied}
                                handleUserWhoApplied={handleUserWhoApplied}
                                labels={labels}
                        />
                        {appliedModal &&
                                <AppliedModal
                                        dataLink={actionLink}
                                        closeModal={closeAppliedModal}
                                />
                        }
                        {showModal &&
                                <AddModal
                                        closeModal={closeModal}
                                        dataLink={actionLink}
                                        onComplete={getData}
                                        googleApiKey={googleApi}
                                        jobCategoryOptions={jobCategoryOptions}

                                />
                        }
                        <DeleteModal
                                isOpen={showDeleteModal}
                                closeModal={closeDeleteModal}
                                url={actionLink}
                                onComplete={getData}
                        />
                </>
        )
}

export default JobsTableView