Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6404 | Rev 6410 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6399 stevensc 1
import React, { useState } from 'react'
6393 stevensc 2
import { axios } from '../../../utils'
6392 stevensc 3
import { useForm } from 'react-hook-form'
6393 stevensc 4
import { connect } from 'react-redux'
5
 
6392 stevensc 6
import { addNotification } from '../../../redux/notification/notification.actions'
6390 stevensc 7
 
6393 stevensc 8
import styles from './survey.module.scss'
6396 stevensc 9
import { updateFeed } from '../../../redux/feed/feed.actions'
6393 stevensc 10
 
11
const SurveyForm = ({
12
  question,
13
  answers = [],
14
  active,
15
  time,
6401 stevensc 16
  resultType,
6393 stevensc 17
  voteUrl,
6401 stevensc 18
  addNotification, // Redux action
19
  updateFeed, // Redux action
6393 stevensc 20
}) => {
6395 stevensc 21
  const [isActive, setIsActive] = useState(Boolean(active))
6393 stevensc 22
  const { register, handleSubmit } = useForm()
6390 stevensc 23
 
6395 stevensc 24
  const sendVote = handleSubmit(({ vote }) => {
25
    setIsActive(false)
6392 stevensc 26
    const formData = new FormData()
27
 
6395 stevensc 28
    formData.append('vote', vote)
29
 
6392 stevensc 30
    axios
31
      .post(voteUrl, formData)
32
      .then(({ data: response }) => {
33
        const { success, data } = response
34
        if (!success) {
35
          addNotification({ style: 'danger', msg: `Error: ${data}` })
6395 stevensc 36
          setIsActive(true)
6392 stevensc 37
        }
38
 
6407 stevensc 39
        updateFeed({ feed: data, uuid: data.feed_uuid })
6392 stevensc 40
      })
41
      .catch((err) => {
42
        addNotification({ style: 'danger', msg: `Error: ${err}` })
6395 stevensc 43
        setIsActive(true)
6392 stevensc 44
        throw new Error(err)
45
      })
6393 stevensc 46
  })
6392 stevensc 47
 
6390 stevensc 48
  return (
6392 stevensc 49
    <form onChange={sendVote} className={styles.survey_form}>
6390 stevensc 50
      <h3>{question}</h3>
6401 stevensc 51
      {resultType === 'pu' && <p>El autor puede ver tu voto</p>}
52
      {resultType === 'pr' && <p>Tu voto es privado</p>}
6390 stevensc 53
      {answers.map(
54
        (option, index) =>
55
          option && (
6401 stevensc 56
            <div
6402 stevensc 57
              className={
58
                isActive
59
                  ? styles.survey_input
6404 stevensc 60
                  : styles.survey_input + ' ' + styles.disabled
6402 stevensc 61
              }
6401 stevensc 62
              key={index}
63
            >
6390 stevensc 64
              <input
65
                type="radio"
6392 stevensc 66
                name="vote"
67
                id={`vote-${index + 1}`}
6390 stevensc 68
                disabled={!isActive}
6392 stevensc 69
                ref={register({ required: true })}
70
                value={index + 1}
6390 stevensc 71
              />
6392 stevensc 72
              <label htmlFor={`vote-${index + 1}`}>{option}</label>
6390 stevensc 73
            </div>
74
          )
75
      )}
76
    </form>
77
  )
78
}
79
 
6393 stevensc 80
const mapDispatchToProps = {
81
  addNotification: (notification) => addNotification(notification),
6401 stevensc 82
  updateFeed: (payload) => updateFeed(payload),
6393 stevensc 83
}
84
 
85
export default connect(null, mapDispatchToProps)(SurveyForm)