Proyectos de Subversion LeadersLinked - SPA

import React from 'react';
import { IconButton } from '@mui/material';
import Clear from '@mui/icons-material/Clear';
import Delete from '@mui/icons-material/Delete';
import Done from '@mui/icons-material/Done';

import { List, ListItem } from '@shared/components';

export function MembersModal({
  members = [],
  onApprove = function () {},
  onReject = function () {},
  onCancel = function () {}
}) {
  return (
    <List
      items={members}
      keyExtractor={(member) => member.id}
      renderItem={(member) => (
        <Member
          key={member.id}
          member={member}
          onApprove={onApprove}
          onReject={onReject}
          onCancel={onCancel}
        />
      )}
      emptyMessage='No hay miembros'
    />
  );
}

const Member = ({
  member: { name = '', image = '', actions = {} },
  onApprove = function () {},
  onReject = function () {},
  onCancel = function () {}
}) => {
  return (
    <ListItem
      image={image}
      title={name}
      renderAction={() => (
        <>
          {actions.link_approve && (
            <IconButton onClick={() => onApprove(actions.link_approve)} title='Aprobar'>
              <Done />
            </IconButton>
          )}
          {actions.link_reject && (
            <IconButton onClick={() => onReject(actions.link_reject)} title='Rechazar'>
              <Clear />
            </IconButton>
          )}
          {actions.link_cancel && (
            <IconButton onClick={() => onCancel(actions.link_cancel)} title='Cancelar'>
              <Delete />
            </IconButton>
          )}
        </>
      )}
    />
  );
};