Proyectos de Subversion LeadersLinked - SPA

import React from 'react'

import { useNavigate } from 'react-router-dom'

import { useSelector } from 'react-redux'

import { Typography } from '@mui/material'

import { Delete, Edit, OpenInNew } from '@mui/icons-material'

import { parse } from '@app/utils'

import Widget from '@components/UI/Widget'

import Button from '@components/UI/buttons/Buttons'

export default function KnowledgeCard({ knowledge, onEdit, onDelete }) {

  const {

    link_delete,

    link_view,

    link_edit,

    category,

    description,

    image,

    title

  } = knowledge

  const labels = useSelector(({ intl }) => intl.labels)

  const navigate = useNavigate()

  return (

    <Widget>

      <Widget.Media height={200} src={image} alt={`${title} image`} />

      <Widget.Body>

        <Typography variant='h2'>{title}</Typography>

        <Typography variant='overline'>{category}</Typography>

        <Typography>{parse(description)}</Typography>

      </Widget.Body>

      <Widget.Actions>

        {link_view && (

          <Button onClick={() => navigate(link_view)}>

            <OpenInNew />

            {labels.view}

          </Button>

        )}

        {link_edit && (

          <Button onClick={() => onEdit(link_edit)}>

            <Edit />

            {labels.edit}

          </Button>

        )}

        {link_delete && (

          <Button onClick={() => onDelete(link_delete)}>

            <Delete />

            {labels.delete}

          </Button>

        )}

      </Widget.Actions>

    </Widget>

  )

}