Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 7116 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import React, { useEffect, useState } from 'react'
import { axios } from '../../../utils'
import { useDispatch } from 'react-redux'

import { addNotification } from '../../../redux/notification/notification.actions'

const DailyPulse = ({ dailyPulseUrl = '' }) => {
  const [emojisHowAreYouFeel, setEmojisHowAreYouFeel] = useState([])
  const [emojisClimateOnYourOrganization, setEmojisClimateOnYourOrganization] =
    useState([])

  const getData = (url) => {
    axios
      .get(url)
      .then((response) => {
        const { success, data } = response.data

        if (success) {
          setEmojisHowAreYouFeel(data.emojis_how_are_you_feel)
          setEmojisClimateOnYourOrganization(
            data.emojis_climate_on_your_organization
          )
        }
      })
      .catch((error) => {
        console.trace(error)
        throw new Error(error)
      })
  }

  useEffect(() => {
    getData(dailyPulseUrl)
  }, [dailyPulseUrl])

  return (
    <div className="daily_pulse-widget">
      <h3>Pulso Diario</h3>
      <DailyPulse.List
        options={emojisHowAreYouFeel}
        title="¿Como te sientes hoy?"
        onComplete={getData}
      />
      <DailyPulse.List
        options={emojisClimateOnYourOrganization}
        title="¿Como esta el clima en la organización?"
        onComplete={getData}
      />
    </div>
  )
}

const PulseList = ({ options = [], title = '', onComplete = () => null }) => {
  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()
    })
  }

  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="fadedown"
                src={image}
                style={{ animationDelay: `${index + 10}00ms` }}
              />
            </a>
          </li>
        ))}
      </ul>
    </div>
  )
}

DailyPulse.List = PulseList

export default DailyPulse