Rev 3949 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React, { useState } from 'react'
import parse from 'html-react-parser'
const SharedContent = ({
name,
image,
timeElapse,
description,
fileVideo,
fileImagePreview,
fileImage,
fileDocument
}) => {
const [isReadMoreActive, setIsReadMoreActive] = useState(false)
const readMoreHandler = () => setIsReadMoreActive(!isReadMoreActive)
const htmlParsedText = (fullStringText) => {
const fullText = parse(fullStringText)
if (fullStringText.length > 500) {
const shortenedString = fullStringText.substr(0, 500)
const shortenedText = parse(`${shortenedString}... `)
return (
<p>
{isReadMoreActive ? fullText : shortenedText}
<span className='cursor-pointer' onClick={readMoreHandler}>
{isReadMoreActive ? ' Leer menos' : ' Leer más'}
</span>
</p>
)
}
return <p>{fullText}</p>
}
return (
<div className="shared-post-bar">
<div className="post-bar">
<div className="post_topbar">
<div className="usy-dt">
<img
src={image}
alt=""
style={{ width: '50px', height: 'auto' }}
/>
<div className="usy-name">
<h3>{name}</h3>
<span>
{timeElapse}
</span>
</div>
</div>
</div>
<div className="job_descp">
<div className="show-read-more">
{htmlParsedText(description)}
</div>
{fileImage &&
<img src={fileImage} className="Entradas" loading='lazy' />
}
{fileVideo &&
<video
src={fileVideo}
controls
poster={fileImagePreview}
preload="none"
/>
}
{fileDocument &&
<a href={fileDocument} target="_blank" rel="noreferrer">
Descargar
</a>
}
</div>
</div>
</div>
)
}
export default SharedContent