Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev Autor Línea Nro. Línea
6539 stevensc 1 
import axios from 'axios'
2 
import React, { useEffect, useState } from 'react'
3 
import { Modal, Button } from 'react-bootstrap'
4 
import { getData } from '../../../helpers/fetchHelpers'
5 
import { useForm } from 'react-hook-form'
14843 stevensc 6 
import { addNotification } from '../../../redux/notification/notification.actions'
7 
import { useDispatch } from 'react-redux'
6539 stevensc 8 
 
9 
const SocialNetworksModal = ({
11152 stevensc 10 
	isOpen,
11 
	closeModal,
12 
	socialNetworksUrl,
13 
	action
6539 stevensc 14 
}) => {
15 
 
11152 stevensc 16 
	const [error, setError] = useState(null)
17 
	const { handleSubmit, setValue, register } = useForm()
14843 stevensc 18 
	const dispatch = useDispatch()
6539 stevensc 19 
 
11152 stevensc 20 
	const onSubmit = ({ facebook, twitter, instagram }) => {
6539 stevensc 21 
 
11152 stevensc 22 
		const data = new FormData()
23 
		data.append('facebook', facebook)
24 
		data.append('twitter', twitter)
25 
		data.append('instagram', instagram)
6539 stevensc 26 
 
11152 stevensc 27 
		axios.post(socialNetworksUrl, data)
28 
			.then(({ data }) => {
29 
				if (!data.success) {
14843 stevensc 30 
					typeof data.data === 'string'
31 
						?
32 
						dispatch(addNotification({
33 
							style: 'danger',
34 
							msg: data.data
35 
						}))
36 
						: Object.entries(data.data).map(([key, value]) =>
37 
							value.map(err =>
38 
								dispatch(addNotification({
39 
									style: 'danger',
40 
									msg: `${key}: ${err}`
41 
								}))
42 
							)
43 
						)
44 
					return
11152 stevensc 45 
				}
46 
				action(data.data)
47 
			})
48 
			.then(() => {
49 
				setError(null)
50 
				closeModal()
51 
			})
52 
			.catch((err) => setError(err))
53 
	}
6539 stevensc 54 
 
11152 stevensc 55 
	useEffect(() => {
56 
		getData(socialNetworksUrl)
57 
			.then(({ facebook, twitter, instagram }) => {
58 
				setValue('facebook', facebook)
59 
				setValue('twitter', twitter)
60 
				setValue('instagram', instagram)
61 
			})
62 
			.catch(err => setError(err))
63 
	}, [isOpen])
6539 stevensc 64 
 
11152 stevensc 65 
	return (
66 
		<Modal
67 
			size="md"
68 
			show={isOpen}
69 
			onHide={closeModal}
70 
			autoFocus={false}
71 
		>
72 
			<Modal.Header closeButton>
73 
				<Modal.Title>Cambiar</Modal.Title>
74 
			</Modal.Header>
75 
			<form onSubmit={handleSubmit(onSubmit)}>
76 
				<Modal.Body>
77 
					<div className="mb-3">
78 
						<label className="form-label">Facebook</label>
79 
						<input
80 
							type="text"
81 
							className="form-control"
82 
							name='facebook'
83 
							ref={register}
84 
						/>
85 
					</div>
86 
					<div className="mb-3">
87 
						<label className="form-label">Twitter</label>
88 
						<input
89 
							type="text"
90 
							className="form-control"
91 
							name='twitter'
92 
							ref={register}
93 
						/>
94 
					</div>
95 
					<div className="mb-3">
96 
						<label className="form-label">Instagram</label>
97 
						<input
98 
							type="text"
99 
							className="form-control"
100 
							name='instagram'
101 
							ref={register}
102 
						/>
103 
					</div>
104 
					{error && <p>{error}</p>}
105 
				</Modal.Body>
106 
				<Modal.Footer>
107 
					<Button
108 
						variant="primary"
109 
						type="submit"
110 
					>
14843 stevensc 111 
						Enviar
11152 stevensc 112 
					</Button>
113 
					<Button
114 
						className='btn-tertiary'
115 
						onClick={closeModal}
116 
					>
14843 stevensc 117 
						Cancelar
11152 stevensc 118 
					</Button>
119 
				</Modal.Footer>
120 
			</form>
121 
		</Modal >
122 
	)
6539 stevensc 123 
}
124 
 
125 
export default SocialNetworksModal