Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3432 | Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
2781 stevensc 1 
import React, { useEffect, useState } from 'react'
2 
import { useForm } from 'react-hook-form'
3 
import { connect } from 'react-redux'
4 
 
5 
import { axios } from 'utils'
6 
import { addNotification } from '@app/redux/notification/notification.actions'
7 
 
8 
import Widget from '@components/UI/Widget'
9 
import Spinner from '@components/UI/Spinner'
10 
import SwitchInput from '@components/UI/SwitchInput'
11 
 
12 
const PRIVACY_OPTIONS = [
13 
  {
14 
    label: 'Mostrar en la búsqueda',
15 
    input_name: 'show_in_search',
16 
    value: false
17 
  }
18 
]
19 
 
20 
const Privacy = ({ addNotification }) => {
21 
  const [loading, setLoading] = useState(false)
22 
  const [options, setOptions] = useState(PRIVACY_OPTIONS)
23 
  const { handleSubmit } = useForm()
24 
 
25 
  const handleOnSubmit = () => {
26 
    setLoading(true)
27 
    const formData = new FormData()
28 
 
29 
    options.forEach(({ input_name, value }) =>
30 
      formData.append(input_name, value ? 'y' : 'n')
31 
    )
32 
 
33 
    axios
34 
      .post('/account-settings/privacy', formData)
35 
      .then(({ data: response }) => {
36 
        if (!response.success) {
37 
          typeof response.data === 'string'
38 
            ? addNotification({ style: 'danger', msg: response.data })
39 
            : Object.entries(response.data).map(([key, value]) =>
40 
                addNotification({
41 
                  style: 'success',
42 
                  msg: `${key} error: ${value} `
43 
                })
44 
              )
45 
        }
46 
        addNotification({ style: 'success', msg: response.data })
47 
      })
48 
      .finally(() => setLoading(false))
49 
  }
50 
 
51 
  const handleChecked = (value, element) => {
52 
    setOptions((prevNotifications) =>
53 
      prevNotifications.map((notification) =>
54 
        notification.input_name === element
55 
          ? { ...notification, value: Boolean(value) }
56 
          : notification
57 
      )
58 
    )
59 
  }
60 
 
61 
  useEffect(() => {
62 
    setLoading(true)
63 
    axios
64 
      .get('/account-settings/privacy')
65 
      .then(({ data: response }) => {
66 
        if (response.success) {
67 
          Object.entries(response.data).map(([key, value]) =>
68 
            setOptions((prevOption) =>
69 
              prevOption.map((option) =>
70 
                option.input_name === key
71 
                  ? { ...option, value: Boolean(value) }
72 
                  : option
73 
              )
74 
            )
75 
          )
76 
        }
77 
      })
78 
      .finally(() => setLoading(false))
79 
  }, [])
80 
 
81 
  if (loading) {
82 
    return <Spinner />
83 
  }
84 
 
85 
  return (
86 
    <Widget>
87 
      <Widget.Header title='Privacidad' />
88 
 
89 
      <Widget.Body>
90 
        <form onSubmit={handleSubmit(handleOnSubmit)}>
91 
          {options.map((option, index) => {
92 
            return (
93 
              <div className='notbat' key={index}>
94 
                <span>{option.label}</span>
95 
                <SwitchInput
96 
                  isChecked={option.value}
97 
                  setValue={(value) => handleChecked(value, option.input_name)}
98 
                />
99 
              </div>
100 
            )
101 
          })}
102 
 
103 
          <button type='submit' className='btn btn-primary mt-3'>
104 
            Guardar
105 
          </button>
106 
        </form>
107 
      </Widget.Body>
108 
    </Widget>
109 
  )
110 
}
111 
 
112 
const mapDispatchToProps = {
113 
  addNotification: (notification) => addNotification(notification)
114 
}
115 
 
116 
export default connect(null, mapDispatchToProps)(Privacy)