Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 2901 Rev 3719
Línea 1... Línea 1...
1 
import React, { useMemo } from 'react'
 1 
import React, { useMemo } from 'react';
2 
import { styled } from '@mui/material'
 2 
import { styled } from '@mui/material';
3 
import { REACTIONS } from '@constants/feed'
 3 
import { REACTIONS } from '@constants/feed';
4 
 
 4 
 
5 
const ReactionsGroup = styled('div')(({ theme }) => ({
 5 
const ReactionsGroup = styled('div')(({ theme }) => ({
6 
  display: 'flex',
 6 
  display: 'flex',
7 
  alignItems: 'center',
 7 
  alignItems: 'center',
8 
  cursor: 'pointer',
 8 
  cursor: 'pointer',
9 
  '& > svg:not(:first-child)': {
 9 
  '& > svg:not(:first-of-type)': {
10 
    marginLeft: theme.spacing(-0.7)
 10 
    marginLeft: theme.spacing(-0.7)
11 
  }
 11 
  }
12 
}))
 12 
}));
13 
 
 13 
 
14 
export default function ReactionsIcons({ reactions = [] }) {
 14 
export default function ReactionsIcons({ reactions = [] }) {
15 
  const icons = useMemo(
 15 
  const icons = useMemo(
16 
    () =>
 - 
 
17 
      REACTIONS.filter(({ type }) =>
 - 
 
18 
        reactions.some(({ reaction }) => type === reaction)
 16 
    () => REACTIONS.filter(({ type }) => reactions.some(({ reaction }) => type === reaction)),
19 
      ),
 - 
 
20 
    [reactions]
 17 
    [reactions]
21 
  )
 18 
  );
22 
 
 19 
 
23 
  return (
 20 
  return (
24 
    <ReactionsGroup>
 21 
    <ReactionsGroup>
25 
      {icons.map(({ icon: Icon, color, label }) => (
 22 
      {icons.map(({ icon: Icon, color, label }) => (
26 
        <Icon key={label} style={{ color }} />
 23 
        <Icon key={label} style={{ color }} />
27 
      ))}
 24 
      ))}
28 
    </ReactionsGroup>
 25 
    </ReactionsGroup>
29 
  )
 26 
  );
30 
}
 27 
}