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>

  )

}