Proyectos de Subversion LeadersLinked - Antes de SPA

import React from 'react'

import { Avatar } from '@mui/material'

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

import parse from 'html-react-parser'

import { useSelector } from 'react-redux'

import styled from 'styled-components'

import EditIcon from '@mui/icons-material/Edit'

import DeleteIcon from '@mui/icons-material/Delete'

import {

  QuestionActions,

  QuestionDetails,

  QuestionStats,

  QuestionUserInfo,

  StyledQuestionCard,

} from './QuestionCard'

import CommentSection from '../feed/CommentSection'

import ReactionsButton from '../UI/buttons/ReactionsButton'

const AnswerActions = styled(QuestionActions)`

  margin-bottom: 0.5rem;

`

const AnswerCard = ({

  // unique = '',

  // uuid = '',

  // question_uuid = '',

  time_elapsed = '',

  user_image = '',

  user_url = '',

  user_name = '',

  text = '',

  reaction = '',

  total_comments = 0,

  total_reactions = 0,

  comments = [],

  link_edit = '',

  link_delete = '',

  link_reaction_delete = '',

  link_save_reaction = '',

  link_add_comment = '',

  onEdit = () => {},

  onDelete = () => {},

}) => {

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

  return (

    <>

      <StyledQuestionCard>

        <QuestionDetails>

          <QuestionUserInfo>

            <Link to={user_url}>

              <Avatar

                src={user_image}

                alt={`${user_name} profile image`}

                sx={{ width: '50px', height: '50px' }}

              />

            </Link>

            <p>{user_name}</p>

          </QuestionUserInfo>

          <QuestionStats className="mb-2">

            <span>{`${labels.published} ${time_elapsed}`}</span>

            <span>{`${total_reactions} ${labels.reactions}`}</span>

            <span>{`${total_comments} ${labels.comments}`}</span>

          </QuestionStats>

        </QuestionDetails>

        {text && parse(text)}

        <AnswerActions>

          {link_edit && (

            <button

              className="btn feed__share-option"

              onClick={() => onEdit(link_edit, text)}

            >

              <EditIcon />

              {labels.edit}

            </button>

          )}

          {link_delete && (

            <button

              className="btn feed__share-option"

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

            >

              <DeleteIcon />

              {labels.delete}

            </button>

          )}

          {link_save_reaction && (

            <ReactionsButton

              className="btn feed__share-option"

              currentReaction={reaction}

              saveUrl={link_save_reaction}

              deleteUrl={link_reaction_delete}

              withLabel

            />

          )}

        </AnswerActions>

        <CommentSection

          addUrl={link_add_comment}

          currentComments={comments}

          isShow

        />

      </StyledQuestionCard>

    </>

  )

}

export default AnswerCard