Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 3763 | Rev 3810 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3361 stevensc 1
/* eslint-disable react/prop-types */
2
import React, { useState } from 'react'
1 www 3
import parse from "html-react-parser";
4
import moment from 'moment'
3363 stevensc 5
import { BiShareAlt } from 'react-icons/bi'
3470 stevensc 6
import { EmailIcon, EmailShareButton, FacebookIcon, FacebookShareButton, RedditIcon, RedditShareButton, TelegramIcon, TelegramShareButton, TwitterIcon, TwitterShareButton, WhatsappIcon, WhatsappShareButton } from 'react-share';
3361 stevensc 7
import { useRef } from 'react';
8
 
9
export default function PostView({ post = {} }) {
10
 
1 www 11
    const baseUrl = `/storage/type/post/code/${post.uuid}/filename/`
3361 stevensc 12
    const shareContainer = useRef(null)
13
    const [shareOptions, setShareOptions] = useState(false)
14
 
1 www 15
    return (
3760 stevensc 16
        <div className="container">
3763 stevensc 17
            <div className='postContainer mx-auto col-md-8'>
3761 stevensc 18
                <div className="row">
19
                    <div className="col-md-7">
20
                        <div className="job_descp">
21
                            <img
22
                                alt={post.title}
23
                                src={baseUrl + post.image}
24
                                className="Entradas"
25
                            />
3760 stevensc 26
                        </div>
3761 stevensc 27
                        <div className="job-status-bar">
28
                            <ul className="reactions-list">
29
                                <li className="position-relative">
30
                                    <button
31
                                        type="button"
32
                                        className="btn-indicator"
33
                                        onClick={() => setShareOptions(!shareOptions)}
34
                                    >
35
                                        <BiShareAlt />
36
                                    </button>
3764 stevensc 37
                                    {shareOptions &&
38
                                        <div className="ext_share post" ref={shareContainer}>
3761 stevensc 39
                                            <FacebookShareButton url={post.share_external_url}>
40
                                                <FacebookIcon size={32} round />
41
                                            </FacebookShareButton>
42
                                            <TwitterShareButton url={post.share_external_url}>
43
                                                <TwitterIcon size={32} round />
44
                                            </TwitterShareButton>
45
                                            <TelegramShareButton url={post.share_external_url}>
46
                                                <TelegramIcon size={32} round />
47
                                            </TelegramShareButton>
48
                                            <WhatsappShareButton url={post.share_external_url}>
49
                                                <WhatsappIcon size={32} round />
50
                                            </WhatsappShareButton>
51
                                            <RedditShareButton url={post.share_external_url}>
52
                                                <RedditIcon size={32} round />
53
                                            </RedditShareButton>
54
                                            <EmailShareButton url={post.share_external_url}>
55
                                                <EmailIcon size={32} round />
56
                                            </EmailShareButton>
57
                                        </div>
58
                                    }
59
                                </li>
60
                            </ul>
61
                        </div>
1 www 62
                    </div>
3761 stevensc 63
                    <div className="col-md-5">
64
                        <div className="post_topbar" >
65
                            <div className="usy-dt">
66
                                <div className="usy-name">
67
                                    <h3>{post.title}</h3>
68
                                    <span>
69
                                        {moment(post.date).format('DD-MM-YYYY')}
70
                                    </span>
71
                                </div>
72
                            </div>
73
                        </div >
74
                        <div className="job_descp">
75
                            <div className="show-read-more">
76
                                {parse(post.description)}
77
                            </div>
78
                        </div>
3760 stevensc 79
                    </div>
1 www 80
                </div>
3757 stevensc 81
            </div >
3760 stevensc 82
        </div>
1 www 83
    )
84
}