Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

import { useSelector } from 'react-redux';

import Add from '@mui/icons-material/Add';

import { IconButton } from '@mui/material';

import { addEducation, deleteEducation, editEducation } from '@services/profile/education';

import { useResource } from '@hooks';

import Widget from '@components/UI/Widget';

import EducationItem from './education-item';

import EducationModal from './education-modal';

import EmptySection from '@components/UI/EmptySection';

import ConfirmModal from '@components/modals/ConfirmModal';

const EducationsCard = ({ uuid = '', educations = [], edit = false }) => {

  const labels = useSelector(({ intl }) => intl.labels);

  const { showModal, modalState, onAdd, onEdit, onDelete, resources, clearModal, currentResource } =

    useResource({

      defaultResources: educations,

      addResource: addEducation,

      editResource: editEducation,

      deleteResource: deleteEducation

    });

  return (

    <>

      <Widget>

        <Widget.Header

          title={labels.education}

          renderAction={() => {

            if (!edit) return null;

            return (

              <IconButton onClick={() => showModal('add')}>

                <Add />

              </IconButton>

            );

          }}

        />

        <Widget.Body>

          {resources.length ? (

            resources.map((education) => (

              <EducationItem

                key={education}

                education={education}

                onEdit={() => showModal('edit', education)}

                onDelete={() => showModal('delete', education)}

                edit={edit}

              />

            ))

          ) : (

            <EmptySection align='left' message={labels.datatable_empty} />

          )}

        </Widget.Body>

      </Widget>

      <EducationModal

        show={modalState === 'add' || modalState === 'edit'}

        currentEducation={currentResource}

        onClose={clearModal}

        onConfirm={(education) => {

          console.log(modalState);

          if (modalState === 'add') onAdd(uuid, education);

          if (modalState === 'edit') onEdit(education);

        }}

      />

      <ConfirmModal

        show={modalState === 'delete'}

        title='Eliminar Educación'

        message='¿Esta seguro de eliminar esta educación?'

        onAccept={onDelete}

        onClose={clearModal}

      />

    </>

  );

};

export default EducationsCard;