Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 5 | Rev 1330 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
5 stevensc 1 
import React from 'react'
1220 stevensc 2 
import { Link } from 'react-router-dom'
3 
import { Avatar, IconButton } from '@mui/material'
4 
import { Clear, Delete, Done } from '@mui/icons-material'
5 
import styled from 'styled-components'
5 stevensc 6 
 
1220 stevensc 7 
import Modal from 'components/UI/Modal'
8 
 
9 
const StyledMemberContainer = styled.div`
10 
  display: flex;
11 
  align-items: center;
12 
  justify-content: space-between;
13 
  gap: 0.5rem;
14 
  padding: 10px 0;
15 
  border-top: 1px solid ${(props) => props.theme.border.color.primary};
16 
`
17 
 
18 
const StyledMemberInfo = styled.div`
19 
  display: flex;
20 
  align-items: center;
21 
  gap: 0.5rem;
22 
`
23 
 
24 
const StyledMemberImage = styled(Avatar)`
25 
  width: 40px !important;
26 
  height: 40px !important;
27 
`
28 
 
5 stevensc 29 
const MembersModal = ({
30 
  isShow = false,
31 
  members = [],
32 
  handleClose = function () {},
1220 stevensc 33 
  handleAction = function () {}
5 stevensc 34 
}) => {
35 
  return (
1220 stevensc 36 
    <Modal title='Miembros' show={isShow} onHide={handleClose}>
37 
      {members.map((member) => (
38 
        <Member key={member.id} member={member} handleAction={handleAction} />
39 
      ))}
5 stevensc 40 
    </Modal>
41 
  )
42 
}
43 
 
1220 stevensc 44 
const Member = ({ member = {}, handleAction = function () {} }) => {
45 
  const { name = '', image = '', profile = '', actions = {} } = member
46 
 
47 
  return (
48 
    <StyledMemberContainer>
49 
      <StyledMemberInfo>
50 
        <Link to={profile}>
51 
          <StyledMemberImage src={image} alt={`${name} profile image`} />
52 
        </Link>
53 
 
54 
        <h4>{name}</h4>
55 
      </StyledMemberInfo>
56 
 
57 
      {actions?.link_approve && (
58 
        <IconButton
59 
          onClick={() => handleAction(actions.link_approve)}
60 
          title='Aprobar'
61 
        >
62 
          <Done />
63 
        </IconButton>
64 
      )}
65 
      {actions?.link_reject && (
66 
        <IconButton
67 
          onClick={() => handleAction(actions.link_reject)}
68 
          title='Rechazar'
69 
        >
70 
          <Clear />
71 
        </IconButton>
72 
      )}
73 
      {actions?.link_cancel && (
74 
        <IconButton
75 
          onClick={() => handleAction(actions.link_cancel)}
76 
          title='Cancelar'
77 
        >
78 
          <Delete />
79 
        </IconButton>
80 
      )}
81 
    </StyledMemberContainer>
82 
  )
83 
}
84 
 
5 stevensc 85 
export default MembersModal