Proyectos de Subversion LeadersLinked - SPA

import React, { useState, useCallback } 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 = 300
  const truncatedText = stripText.slice(0, maxLength)
  const isTruncated = stripText.length > maxLength

  const toggleShowMore = useCallback(
    () => setShowMore((prevState) => !prevState),
    []
  )

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

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