Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3694 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3694 Rev 3719
Línea 1... Línea 1...
1
import React, { useState } from 'react';
1
import React, { useState } from 'react';
2
import { Avatar, AvatarGroup, Button } from '@mui/material';
2
import { Avatar, AvatarGroup, Button } from '@mui/material';
3
import East from '@mui/icons-material/East';
3
import East from '@mui/icons-material/East';
4
 
4
 
5
import { useFetch } from '@hooks';
5
import { useFetch } from '@hooks';
6
 
6
 
7
import Widget from '@components/UI/Widget';
7
import Widget from '@components/UI/Widget';
8
import MembersModal from '@components/modals/MembersModal';
8
import MembersModal from '@components/modals/MembersModal';
9
 
9
 
10
const CompanyFollowers = ({ companyId }) => {
10
const CompanyFollowers = ({ companyId }) => {
11
  const { data: followers } = useFetch(`/helpers/company-follower/${companyId}`, []);
11
  const { data: followers } = useFetch(`/helpers/company-follower/${companyId}`, []);
12
  const [showMembersModal, setShowMembersModal] = useState(false);
12
  const [showMembersModal, setShowMembersModal] = useState(false);
13
 
13
 
14
  const toggleModal = () => setShowMembersModal(!showMembersModal);
14
  const toggleModal = () => setShowMembersModal(!showMembersModal);
15
 
15
 
16
  return (
16
  return (
17
    <>
17
    <>
18
      <Widget>
18
      <Widget>
19
        <Widget.Header title={`${followers.length} Seguidores`} />
19
        <Widget.Header title={`${followers.length} Seguidores`} />
20
 
20
 
21
        <Widget.Body>
21
        <Widget.Body>
22
          <AvatarGroup max={5}>
22
          <AvatarGroup max={5}>
23
            {followers.map(({ name, image }) => (
23
            {followers.map(({ name, image }) => (
24
              <Avatar key={name} src={image} alt={name} />
24
              <Avatar key={name} src={image} alt={name} />
25
            ))}
25
            ))}
26
          </AvatarGroup>
26
          </AvatarGroup>
27
        </Widget.Body>
27
        </Widget.Body>
28
 
28
 
29
        <Widget.Actions styles={{ padding: '0' }}>
29
        <Widget.Actions styles={{ padding: '0' }}>
30
          <Button onClick={toggleModal} fullWidth sx={{ borderRadius: 0 }}>
30
          <Button onClick={toggleModal} fullWidth sx={{ borderRadius: 0 }}>
31
            Ver más
31
            Ver más
32
            <East />
32
            <East />
33
          </Button>
33
          </Button>
34
        </Widget.Actions>
34
        </Widget.Actions>
35
      </Widget>
35
      </Widget>
36
 
36
 
37
      <MembersModal
37
      <MembersModal
38
        isShow={showMembersModal}
38
        isShow={showMembersModal}
39
        handleClose={toggleModal}
39
        handleClose={toggleModal}
40
        members={followers}
40
        members={followers}
41
        handleAction={() => null}
41
        handleAction={() => null}
42
      />
42
      />
43
    </>
43
    </>
44
  );
44
  );
45
};
45
};
46
 
46
 
47
export default CompanyFollowers;
47
export default CompanyFollowers;