Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev Autor Línea Nro. Línea
3640 stevensc 1
import React, { useEffect, useState } from 'react';
2
import { useDispatch, useSelector } from 'react-redux';
3
import { IconButton } from '@mui/material';
4
import { Edit } from '@mui/icons-material';
1851 stevensc 5
 
3640 stevensc 6
import { axios } from '@utils';
7
import { addNotification } from '@store/notification/notification.actions';
1849 stevensc 8
 
3640 stevensc 9
import Widget from '@components/UI/Widget';
10
import TagsList from '@components/UI/TagsList';
11
import LanguagesModal from './LanguagesModal';
1851 stevensc 12
 
3640 stevensc 13
const LanguagesCard = ({ languages: defaultLanguages = [], uuid = '', edit = false }) => {
3432 stevensc 14
  const [languages, setLanguages] = useState([]);
15
  const [showModal, setShowModal] = useState(false);
16
  const labels = useSelector(({ intl }) => intl.labels);
17
  const dispatch = useDispatch();
1849 stevensc 18
 
3432 stevensc 19
  const toggleModal = () => setShowModal(!showModal);
1849 stevensc 20
 
3647 stevensc 21
  const handleEditLanguages = (languages) => {
1849 stevensc 22
    axios
3647 stevensc 23
      .post(`/profile/my-profiles/language/${uuid}`, languages)
3432 stevensc 24
      .then((response) => {
25
        const { success, data } = response.data;
1849 stevensc 26
 
27
        if (!success) {
3640 stevensc 28
          const errorMessage = typeof data === 'string' ? data : data.languages[0];
3432 stevensc 29
          throw new Error(errorMessage);
1849 stevensc 30
        }
31
 
3648 stevensc 32
        setLanguages(data);
3432 stevensc 33
        toggleModal();
1849 stevensc 34
      })
35
      .catch((err) => {
3640 stevensc 36
        dispatch(addNotification({ style: 'danger', msg: err.message }));
3432 stevensc 37
      });
38
  };
1849 stevensc 39
 
40
  useEffect(() => {
3432 stevensc 41
    setLanguages(defaultLanguages);
42
  }, [defaultLanguages]);
1849 stevensc 43
 
44
  return (
45
    <>
3047 stevensc 46
      <Widget>
47
        <Widget.Header
48
          title={labels.languages}
49
          renderAction={() => {
3432 stevensc 50
            if (!edit) return;
3047 stevensc 51
            return (
52
              <IconButton onClick={toggleModal}>
53
                <Edit />
54
              </IconButton>
3432 stevensc 55
            );
3047 stevensc 56
          }}
57
        />
58
        <Widget.Body>
59
          <TagsList tags={languages} />
60
        </Widget.Body>
61
      </Widget>
1849 stevensc 62
 
63
      <LanguagesModal
64
        show={showModal}
65
        onClose={toggleModal}
66
        onConfirm={handleEditLanguages}
67
        languages={languages}
68
      />
69
    </>
3432 stevensc 70
  );
71
};
1849 stevensc 72
 
3432 stevensc 73
export default LanguagesCard;