Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/display-name */
import React, { useEffect, useState } from 'react'
import { useDispatch } from 'react-redux'
import {
  EmailIcon,
  EmailShareButton,
  FacebookIcon,
  FacebookShareButton,
  RedditIcon,
  RedditShareButton,
  TelegramIcon,
  TelegramShareButton,
  TwitterIcon,
  TwitterShareButton,
  WhatsappIcon,
  WhatsappShareButton,
} from 'react-share'
import { addNotification } from '../../../../redux/notification/notification.actions'
import { axios } from '../../../../utils'

export default function withExternalShare(Component, url, params) {
  return function () {
    const dispatch = useDispatch()
    const [shareOptions, setShareOptions] = useState(false)
    const [shareUrl, setShareUrl] = useState('')

    const handleDisplayReactionList = () => setShareOptions(!shareOptions)

    const getShareUrl = async () => {
      await axios
        .get(url)
        .then(({ data }) => {
          if (!data.success) {
            dispatch(addNotification({ style: 'danger', msg: data.data }))
            setShareOptions(false)
            return
          }

          setShareUrl(data.data)
        })
        .catch((err) => console.log(err))
    }

    const incrementCount = async () => {
      await axios
        .post(params.shareUrl)
        .then(({ data }) => {
          if (!data.success) {
            dispatch(addNotification({ style: 'danger', msg: data.data }))
            return
          }

          setShareOptions(false)
          params.setValue(data.data)
        })
        .catch((err) => console.log(err))
    }

    useEffect(() => {
      if (shareOptions && !shareUrl) getShareUrl()
    }, [shareOptions])

    return (
      <div
        className="position-relative d-inline-flex"
        onClick={handleDisplayReactionList}
        style={{ flexGrow: 1 }}
      >
        <Component {...params} />
        {shareOptions && (
          <div className="external__share">
            <FacebookShareButton
              url={shareUrl}
              onShareWindowClose={() => incrementCount()}
            >
              <FacebookIcon size={32} round />
            </FacebookShareButton>
            <TwitterShareButton
              url={shareUrl}
              onShareWindowClose={() => incrementCount()}
            >
              <TwitterIcon size={32} round />
            </TwitterShareButton>
            <TelegramShareButton
              url={shareUrl}
              onShareWindowClose={() => incrementCount()}
            >
              <TelegramIcon size={32} round />
            </TelegramShareButton>
            <WhatsappShareButton
              url={shareUrl}
              onShareWindowClose={() => incrementCount()}
            >
              <WhatsappIcon size={32} round />
            </WhatsappShareButton>
            <RedditShareButton
              url={shareUrl}
              onShareWindowClose={() => incrementCount()}
            >
              <RedditIcon size={32} round />
            </RedditShareButton>
            <EmailShareButton
              url={shareUrl}
              onShareWindowClose={() => incrementCount()}
            >
              <EmailIcon size={32} round />
            </EmailShareButton>
          </div>
        )}
      </div>
    )
  }
}