Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import React, { useState } from 'react'
import parse from "html-react-parser";
import moment from 'moment'
import { BiShareAlt } from 'react-icons/bi'
import { EmailIcon, EmailShareButton, FacebookIcon, FacebookShareButton, RedditIcon, RedditShareButton, TelegramIcon, TelegramShareButton, TwitterIcon, TwitterShareButton, WhatsappIcon, WhatsappShareButton } from 'react-share';
import { useRef } from 'react';

export default function PostView({ post = {} }) {

    const baseUrl = `/storage/type/post/code/${post.uuid}/filename/`
    const shareContainer = useRef(null)
    const [shareOptions, setShareOptions] = useState(false)

    return (
        <div className="container">
            <div className='postContainer mx-auto col-5'>
                <div className="post_topbar" >
                    <div className="usy-dt">
                        <div className="usy-name">
                            <h3>{post.title}</h3>
                            <span>
                                {moment(post.date).format('DD-MM-YYYY')}
                            </span>
                        </div>
                    </div>
                </div >
                <div className="job_descp">
                    <div className="show-read-more">
                        {parse(post.description)}
                    </div>
                    <img
                        alt={post.title}
                        src={baseUrl + post.image}
                        className="Entradas"
                    />
                </div>
                <div className="job-status-bar">
                    <ul className="reactions-list">
                        <li className="position-relative">
                            <button
                                type="button"
                                className="btn-indicator"
                                onClick={() => setShareOptions(!shareOptions)}
                            >
                                <BiShareAlt />
                            </button>
                            {
                                shareOptions &&
                                <div className="ext_share" ref={shareContainer}>
                                    <FacebookShareButton url={post.share_external_url}>
                                        <FacebookIcon size={32} round />
                                    </FacebookShareButton>
                                    <TwitterShareButton url={post.share_external_url}>
                                        <TwitterIcon size={32} round />
                                    </TwitterShareButton>
                                    <TelegramShareButton url={post.share_external_url}>
                                        <TelegramIcon size={32} round />
                                    </TelegramShareButton>
                                    <WhatsappShareButton url={post.share_external_url}>
                                        <WhatsappIcon size={32} round />
                                    </WhatsappShareButton>
                                    <RedditShareButton url={post.share_external_url}>
                                        <RedditIcon size={32} round />
                                    </RedditShareButton>
                                    <EmailShareButton url={post.share_external_url}>
                                        <EmailIcon size={32} round />
                                    </EmailShareButton>
                                </div>
                            }
                        </li>
                    </ul>
                </div>
            </div >
        </div>
    )
}