Proyectos de Subversion LeadersLinked - Antes de SPA

import React, { useState, useEffect } from 'react'

import styles from './survey.module.scss'

import { useForm } from 'react-hook-form'

import { axios } from '../../../utils'

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

const SurveyForm = ({ question, answers = [], active, time, voteUrl }) => {

  const [isActive, setIsActive] = useState(true)

  const { register } = useForm()

  const sendVote = (data) => {

    setIsActive(!isActive)

    const formData = new FormData()

    formData.append('vote', data.vote)

    axios

      .post(voteUrl, formData)

      .then(({ data: response }) => {

        const { success, data } = response

        if (!success) {

          addNotification({ style: 'danger', msg: `Error: ${data}` })

          setIsActive(!isActive)

          return

        }

        addNotification({ style: 'success', msg: data })

      })

      .catch((err) => {

        addNotification({ style: 'danger', msg: `Error: ${err}` })

        throw new Error(err)

      })

  }

  useEffect(() => {

    setIsActive(Boolean(active))

  }, [active])

  return (

    <form onChange={sendVote} className={styles.survey_form}>

      <h3>{question}</h3>

      {answers.map(

        (option, index) =>

          option && (

            <div className={styles.survey_input} key={index}>

              <input

                type="radio"

                name="vote"

                id={`vote-${index + 1}`}

                disabled={!isActive}

                ref={register({ required: true })}

                value={index + 1}

              />

              <label htmlFor={`vote-${index + 1}`}>{option}</label>

            </div>

          )

      )}

    </form>

  )

}

export default SurveyForm