Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 3688 Rev 3719
Línea 1... Línea 1...
1 
import React, { useMemo } from 'react'
 1 
import React, { useMemo } from 'react';
2 
import { useDispatch } from 'react-redux'
 2 
import { useDispatch } from 'react-redux';
3 
import { useForm } from 'react-hook-form'
 3 
import { useForm } from 'react-hook-form';
4 
 
 4 
 
5 
import { axios } from '@utils'
 5 
import { axios } from '@utils';
6 
import { addNotification } from '@store/notification/notification.actions'
 6 
import { addNotification } from '@store/notification/notification.actions';
7 
 
 7 
 
8 
import Modal from '@components/UI/modal/Modal'
 8 
import Modal from '@components/UI/modal/Modal';
9 
import Select from '@components/UI/inputs/Select'
 9 
import Select from '@components/UI/inputs/Select';
10 
 
 10 
 
11 
export default function AccessibilityModal({
 11 
export default function AccessibilityModal({
12 
  show = false,
 12 
  show = false,
13 
  accessibilities = {},
 13 
  accessibilities = {},
14 
  accessibility,
 14 
  accessibility,
15 
  privacy,
 15 
  privacy,
16 
  groupId = '',
 16 
  groupId = '',
17 
  onClose = () => {},
 17 
  onClose = () => {},
18 
  onConfirm = () => {}
 18 
  onConfirm = () => {}
19 
}) {
 19 
}) {
20 
  const accessibilityId = useMemo(
 20 
  const accessibilityId = useMemo(
21 
    () =>
 - 
 
22 
      Object.entries(accessibilities).find(
 - 
 
23 
        ([name, value]) => value === accessibility
 21 
    () => Object.values(accessibilities).find((value) => value === accessibility) || '',
24 
      )?.[0] || '',
 - 
 
25 
    [accessibilities, accessibility]
 22 
    [accessibilities, accessibility]
26 
  )
 23 
  );
27 
  const accessibilitiesOptions = useMemo(() => {
 24 
  const accessibilitiesOptions = useMemo(() => {
28 
    const options = Object.entries(accessibilities).map(([value, name]) => ({
 25 
    const options = Object.entries(accessibilities).map(([value, name]) => ({
29 
      name,
 26 
      name,
30 
      value
 27 
      value
31 
    }))
 28 
    }));
32 
 
 29 
 
33 
    if (privacy === 'Privado') {
 30 
    if (privacy === 'Privado') {
34 
      return options.filter((acc) => acc.value !== 'aj')
 31 
      return options.filter((acc) => acc.value !== 'aj');
35 
    }
 32 
    }
36 
 
 33 
 
37 
    return options
 34 
    return options;
38 
  }, [accessibilities, privacy])
 35 
  }, [accessibilities, privacy]);
39 
  const dispatch = useDispatch()
 36 
  const dispatch = useDispatch();
40 
 
 37 
 
41 
  const {
 38 
  const {
42 
    control,
 39 
    control,
43 
    handleSubmit,
 40 
    handleSubmit,
44 
    formState: { errors, isSubmitting }
 41 
    formState: { errors, isSubmitting }
45 
  } = useForm({
 42 
  } = useForm({
46 
    defaultValues: {
 43 
    defaultValues: {
47 
      accessibility: ''
 44 
      accessibility: ''
48 
    },
 45 
    },
49 
    values: {
 46 
    values: {
50 
      accessibility: accessibilityId
 47 
      accessibility: accessibilityId
51 
    }
 48 
    }
52 
  })
 49 
  });
53 
 
 50 
 
54 
  const onSubmit = handleSubmit(async ({ accessibility }) => {
 51 
  const onSubmit = handleSubmit(async ({ accessibility }) => {
55 
    const url = `/group/my-groups/accessibility/${groupId}`
 52 
    const url = `/group/my-groups/accessibility/${groupId}`;
56 
    const formData = new FormData()
 53 
    const formData = new FormData();
57 
    formData.append('accessibility', accessibility)
 54 
    formData.append('accessibility', accessibility);
58 
 
 55 
 
59 
    try {
 56 
    try {
60 
      const response = await axios.post(url, formData)
 57 
      const response = await axios.post(url, formData);
61 
      const { data, success } = response.data
 58 
      const { data, success } = response.data;
62 
 
 59 
 
63 
      if (!success) {
 60 
      if (!success) {
64 
        throw new Error('Error al editar el tipo de grupo')
 61 
        throw new Error('Error al editar el tipo de grupo');
65 
      }
 62 
      }
66 
 
 63 
 
67 
      onConfirm(data)
 64 
      onConfirm(data);
68 
      onClose()
 65 
      onClose();
69 
    } catch (error) {
 66 
    } catch (error) {
70 
      dispatch(addNotification({ style: 'danger', msg: error.message }))
 67 
      dispatch(addNotification({ style: 'danger', msg: error.message }));
71 
    }
 68 
    }
72 
  })
 69 
  });
73 
 
 70 
 
74 
  return (
 71 
  return (
75 
    <Modal
 72 
    <Modal
76 
      title='Accesibilidad'
 73 
      title='Accesibilidad'
77 
      show={show}
 74 
      show={show}
78 
      onClose={onClose}
 75 
      onClose={onClose}
79 
      onAccept={onSubmit}
 76 
      onAccept={onSubmit}
80 
      loading={isSubmitting}
 77 
      loading={isSubmitting}
81 
    >
 78 
    >
82 
      <Select
 79 
      <Select
83 
        name='accessibility'
 80 
        name='accessibility'
84 
        control={control}
 81 
        control={control}
85 
        placeholder='Accesibilidad'
 82 
        placeholder='Accesibilidad'
86 
        rules={{
 83 
        rules={{
87 
          required: 'Por favor eliga una accesibilidad'
 84 
          required: 'Por favor eliga una accesibilidad'
88 
        }}
 85 
        }}
89 
        error={errors.accessibility?.message}
 86 
        error={errors.accessibility?.message}
90 
        options={accessibilitiesOptions}
 87 
        options={accessibilitiesOptions}
91 
      />
 88 
      />
92 
    </Modal>
 89 
    </Modal>
93 
  )
 90 
  );
94 
}
 91 
}