Proyectos de Subversion LeadersLinked - SPA

import React from 'react';
import { useSelector } from 'react-redux';
import { Typography } from '@mui/material';

import { parse } from '@app/utils';

import { Card, CardContent, CardHeader, CardMedia, Menu } from '@shared/components';

export function KnowledgeCard({
  knowledge: { category, description, image, title },
  onClick,
  onEdit,
  onDelete
}) {
  const labels = useSelector(({ intl }) => intl.labels);

  return (
    <Card onClick={onClick} styles={{ cursor: 'pointer' }}>
      <CardHeader
        renderAction={() => (
          <Menu>
            <Menu.Item onClick={onEdit}>{labels.edit}</Menu.Item>
            <Menu.Item onClick={onDelete}>{labels.delete}</Menu.Item>
          </Menu>
        )}
      />

      <CardMedia height={200} src={image} alt={`${title} image`} />

      <CardContent>
        <Typography variant='h2'>{title}</Typography>
        <Typography variant='overline'>{category}</Typography>
        <Typography>{parse(description)}</Typography>
      </CardContent>
    </Card>
  );
}