Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3694 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

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;