Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable camelcase */
/* eslint-disable react/prop-types */
import React, { useEffect, useState } from 'react'
import { useDispatch } from 'react-redux'
import { addNotification } from '../../../redux/notification/notification.actions'
import { axios } from '../../../utils'

const PulseList = ({
  options = [],
  title = '',
  onComplete = () => null
}) => {
  const [isMounted, setIsMounted] = useState(false)
  const dispatch = useDispatch()

  const handleEmojiSave = (url) => {
    if (!url) {
      return false
    }

    axios.post(url)
      .then(({ data }) => {
        if (!data.success) {
          return dispatch(addNotification({
            style: 'danger',
            msg: typeof data.data === 'string'
              ? data.data
              : 'Ha ocurrido un error'
          }))
        }

        return onComplete()
      })
  }

  useEffect(() => {
    setIsMounted(true)
  }, [])

  return (
        <div className="daily_pulse-quest">
            <h4>{title}</h4>
            <ul>
                {options.map(({ link_save, id, image }, index) =>
                    <li key={id}>
                        <a href={link_save} onClick={(e) => {
                          e.preventDefault()
                          handleEmojiSave(link_save)
                        }}>
                            <img className={isMounted && 'fadedown'} src={image} style={{ animationDelay: `${index + 10}00ms` }} />
                        </a>
                    </li>
                )}
            </ul>
        </div>
  )
}

export default PulseList