Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev Autor Línea Nro. Línea
3719 stevensc 1 
import React from 'react';
2 
import { Box, IconButton, Typography } from '@mui/material';
3 
import Edit from '@mui/icons-material/Edit';
4 
import Delete from '@mui/icons-material/Delete';
5 
 
6 
import { parse } from '@utils';
7 
import { getMonthName } from '@utils/dates';
8 
 
9 
export default function ExperienceItem({
10 
  experience = {},
11 
  onDelete = () => {},
12 
  onEdit = () => {},
13 
  edit = false
14 
}) {
15 
  const {
16 
    title,
17 
    description,
18 
    company,
19 
    size,
20 
    industry,
21 
    formatted_adress,
22 
    from_month,
23 
    from_year,
24 
    to_month,
25 
    to_year
26 
  } = experience;
27 
  const industryName = typeof industry === 'object' ? industry.name : industry;
28 
 
29 
  return (
30 
    <Box
31 
      sx={{
32 
        display: 'flex',
33 
        alignItems: 'start',
34 
        justifyContent: 'space-between',
35 
        gap: 2,
36 
        marginBottom: 1
37 
      }}
38 
    >
39 
      <Box>
40 
        <Typography variant='h4'>{title}</Typography>
41 
        <Typography variant='body1' sx={{ fontSize: '14px' }}>
42 
          {company}
43 
        </Typography>
44 
 
45 
        <Typography
46 
          variant='overline'
47 
          sx={{ display: 'block' }}
48 
        >{`${industryName} / ${size}`}</Typography>
49 
 
50 
        <Typography variant='overline' sx={{ display: 'block' }}>
51 
          {`${getMonthName(from_month)} ${from_year}`} -{' '}
52 
          {to_year ? `${getMonthName(to_month)} ${to_year}` : 'Actual'}
53 
        </Typography>
54 
 
55 
        <Typography variant='overline' sx={{ display: 'block' }}>
56 
          {formatted_adress}
57 
        </Typography>
58 
 
59 
        {parse(description)}
60 
      </Box>
61 
 
62 
      {edit && (
63 
        <Box sx={{ display: 'flex', gap: 1, alignItems: 'center' }}>
64 
          <IconButton onClick={onEdit}>
65 
            <Edit />
66 
          </IconButton>
67 
          <IconButton onClick={onDelete}>
68 
            <Delete />
69 
          </IconButton>
70 
        </Box>
71 
      )}
72 
    </Box>
73 
  );
74 
}