Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3269 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3269 Rev 3719
Línea 1... Línea 1...
1
import React, { useEffect } from 'react'
1
import React, { useEffect } from 'react';
2
import { useDispatch, useSelector } from 'react-redux'
2
import { useDispatch, useSelector } from 'react-redux';
3
import { useForm } from 'react-hook-form'
3
import { useForm } from 'react-hook-form';
4
 
4
 
5
import { axios } from 'utils/index'
5
import { axios } from '@utils/index';
6
import { addNotification } from '../../redux/notification/notification.actions'
6
import { addNotification } from '../../redux/notification/notification.actions';
7
 
7
 
8
import CKEditor from '@components/common/ckeditor/Ckeditor'
8
import CKEditor from '@components/common/ckeditor/Ckeditor';
9
import Modal from 'components/UI/modal/Modal'
9
import Modal from '@components/UI/modal/Modal';
10
import FormErrorFeedback from 'components/UI/form/FormErrorFeedback'
10
import FormErrorFeedback from '@components/UI/form/FormErrorFeedback';
11
 
11
 
12
const AnswerModal = ({
12
const AnswerModal = ({
13
  show = false,
13
  show = false,
14
  currentAnswer = '',
14
  currentAnswer = '',
15
  url = '',
15
  url = '',
16
  onClose = () => null,
16
  onClose = () => null,
17
  onComplete = () => null
17
  onComplete = () => null
18
}) => {
18
}) => {
19
  const labels = useSelector(({ intl }) => intl.labels)
19
  const labels = useSelector(({ intl }) => intl.labels);
20
  const dispatch = useDispatch()
20
  const dispatch = useDispatch();
21
 
21
 
22
  const {
22
  const {
23
    register,
23
    register,
24
    handleSubmit,
24
    handleSubmit,
25
    setValue,
25
    setValue,
26
    formState: { errors }
26
    formState: { errors }
27
  } = useForm()
27
  } = useForm();
28
 
28
 
29
  const onSubmit = handleSubmit(({ description }) => {
29
  const onSubmit = handleSubmit(({ description }) => {
30
    const formData = new FormData()
30
    const formData = new FormData();
31
    formData.append('description', description)
31
    formData.append('description', description);
32
 
32
 
33
    axios.post(url, formData).then((response) => {
33
    axios.post(url, formData).then((response) => {
34
      const { data, success } = response.data
34
      const { data, success } = response.data;
35
 
35
 
36
      if (!success) {
36
      if (!success) {
37
        const errorMessage =
37
        const errorMessage =
38
          typeof data === 'string'
38
          typeof data === 'string'
39
            ? data
39
            ? data
40
            : 'Error interno. Por favor, inténtelo de nuevo más tarde.'
40
            : 'Error interno. Por favor, inténtelo de nuevo más tarde.';
41
 
41
 
42
        dispatch(addNotification({ style: 'danger', msg: errorMessage }))
42
        dispatch(addNotification({ style: 'danger', msg: errorMessage }));
43
        return
43
        return;
44
      }
44
      }
45
 
45
 
46
      onComplete(data)
46
      onComplete(data);
47
      onClose()
47
      onClose();
48
    })
48
    });
49
  })
49
  });
50
 
50
 
51
  useEffect(() => {
51
  useEffect(() => {
52
    register('description', { required: true })
52
    register('description', { required: true });
53
  }, [])
53
  }, []);
54
 
54
 
55
  useEffect(() => {
55
  useEffect(() => {
56
    setValue('description', currentAnswer)
56
    setValue('description', currentAnswer);
57
  }, [currentAnswer])
57
  }, [currentAnswer]);
58
 
58
 
59
  return (
59
  return (
60
    <Modal
60
    <Modal
61
      title={
-
 
62
        currentAnswer ? labels.my_coach_answer_edit : labels.my_coach_answer_add
61
      title={currentAnswer ? labels.my_coach_answer_edit : labels.my_coach_answer_add}
63
      }
-
 
64
      show={show}
62
      show={show}
65
      onClose={onClose}
63
      onClose={onClose}
66
      onAccept={onSubmit}
64
      onAccept={onSubmit}
67
    >
65
    >
68
      <CKEditor
-
 
69
        defaultValue={currentAnswer}
-
 
70
        onChange={(value) => setValue('description', value)}
66
      <CKEditor defaultValue={currentAnswer} onChange={(value) => setValue('description', value)} />
71
      />
-
 
72
      {errors.description && (
-
 
73
        <FormErrorFeedback>{labels.error_field_empty}</FormErrorFeedback>
67
      {errors.description && <FormErrorFeedback>{labels.error_field_empty}</FormErrorFeedback>}
74
      )}
-
 
75
    </Modal>
68
    </Modal>
76
  )
69
  );
77
}
70
};
78
 
71
 
79
export default AnswerModal
72
export default AnswerModal;