Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6830 stevensc 1
/* eslint-disable react/display-name */
2
import React, { useEffect, useState } from 'react'
3
import { useDispatch } from 'react-redux'
4
import {
5
  EmailIcon,
6
  EmailShareButton,
7
  FacebookIcon,
8
  FacebookShareButton,
9
  RedditIcon,
10
  RedditShareButton,
11
  TelegramIcon,
12
  TelegramShareButton,
13
  TwitterIcon,
14
  TwitterShareButton,
15
  WhatsappIcon,
16
  WhatsappShareButton,
17
} from 'react-share'
18
import { addNotification } from '../../../../redux/notification/notification.actions'
19
import { axios } from '../../../../utils'
20
 
21
export default function withExternalShare(Component, url, params) {
22
  return function () {
23
    const dispatch = useDispatch()
24
    const [shareOptions, setShareOptions] = useState(false)
25
    const [shareUrl, setShareUrl] = useState('')
26
 
27
    const handleDisplayReactionList = () => setShareOptions(!shareOptions)
28
 
29
    const getShareUrl = async () => {
30
      await axios
31
        .get(url)
32
        .then(({ data }) => {
33
          if (!data.success) {
34
            dispatch(addNotification({ style: 'danger', msg: data.data }))
35
            setShareOptions(false)
36
            return
37
          }
38
 
39
          setShareUrl(data.data)
40
        })
41
        .catch((err) => console.log(err))
42
    }
43
 
44
    const incrementCount = async () => {
45
      await axios
46
        .post(params.shareUrl)
47
        .then(({ data }) => {
48
          if (!data.success) {
49
            dispatch(addNotification({ style: 'danger', msg: data.data }))
50
            return
51
          }
52
 
53
          setShareOptions(false)
54
          params.setValue(data.data)
55
        })
56
        .catch((err) => console.log(err))
57
    }
58
 
59
    useEffect(() => {
60
      if (shareOptions && !shareUrl) getShareUrl()
61
    }, [shareOptions])
62
 
63
    return (
64
      <div
65
        className="position-relative d-inline-flex"
66
        onClick={handleDisplayReactionList}
67
        style={{ flexGrow: 1 }}
68
      >
69
        <Component {...params} />
70
        {shareOptions && (
71
          <div className="external__share">
72
            <FacebookShareButton
73
              url={shareUrl}
74
              onShareWindowClose={() => incrementCount()}
75
            >
76
              <FacebookIcon size={32} round />
77
            </FacebookShareButton>
78
            <TwitterShareButton
79
              url={shareUrl}
80
              onShareWindowClose={() => incrementCount()}
81
            >
82
              <TwitterIcon size={32} round />
83
            </TwitterShareButton>
84
            <TelegramShareButton
85
              url={shareUrl}
86
              onShareWindowClose={() => incrementCount()}
87
            >
88
              <TelegramIcon size={32} round />
89
            </TelegramShareButton>
90
            <WhatsappShareButton
91
              url={shareUrl}
92
              onShareWindowClose={() => incrementCount()}
93
            >
94
              <WhatsappIcon size={32} round />
95
            </WhatsappShareButton>
96
            <RedditShareButton
97
              url={shareUrl}
98
              onShareWindowClose={() => incrementCount()}
99
            >
100
              <RedditIcon size={32} round />
101
            </RedditShareButton>
102
            <EmailShareButton
103
              url={shareUrl}
104
              onShareWindowClose={() => incrementCount()}
105
            >
106
              <EmailIcon size={32} round />
107
            </EmailShareButton>
108
          </div>
109
        )}
110
      </div>
111
    )
112
  }
113
}