Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react'
import { Typography } from '@mui/material'

import { parse } from '@utils'

export default function FeedDescription({ description = '' }) {
  const [showMore, setShowMore] = useState(false)

  const stripText = description.replace(/<p>|<\/p>/g, '')
  const maxLength = 140
  const truncatedText = stripText.slice(0, maxLength)
  const isTruncated = stripText.length > maxLength

  const toggleShowMore = () => setShowMore((prevState) => !prevState)

  return (
    <Typography>
      {parse(showMore ? stripText : truncatedText)}

      {isTruncated && (
        <Typography
          onClick={toggleShowMore}
          variant='overline'
          color='primary'
          sx={{ cursor: 'pointer', display: 'inline-flex' }}
          aria-expanded={showMore}
        >
          {showMore ? ' Mostrar menos' : '... Mostrar más'}
        </Typography>
      )}
    </Typography>
  )
}