Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 3630 | Ir a la última revisión | 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