Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3278 | Rev 3432 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3278 Rev 3416
Línea 1... Línea 1...
1 
import React from 'react'
 1 
import React from "react";
2 
import { useDispatch, useSelector } from 'react-redux'
 2 
import { useDispatch, useSelector } from "react-redux";
3 
import { Controller, useForm } from 'react-hook-form'
 3 
import { Controller, 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 '../modal/Modal'
 8 
import Modal from "../modal/Modal";
9 
import FormErrorFeedback from '../form/FormErrorFeedback'
 9 
import FormErrorFeedback from "../form/FormErrorFeedback";
10 
import DropzoneComponent from '@components/dropzone/DropzoneComponent'
 10 
import DropzoneComponent from "@components/dropzone/DropzoneComponent";
Línea 11... Línea 11...
11 
 
 11 
 
12 
const CoverModal = ({
 12 
const CoverModal = ({
13 
  show = false,
 13 
  show = false,
14 
  sizes = '',
 14 
  sizes = "",
15 
  onClose = () => {},
 15 
  onClose = () => {},
16 
  onChange = () => {},
 16 
  onChange = () => {},
17 
  url = ''
 17 
  url = "",
18 
}) => {
 18 
}) => {
19 
  const labels = useSelector(({ intl }) => intl.labels)
 19 
  const labels = useSelector(({ intl }) => intl.labels);
Línea 20... Línea 20...
20 
  const dispatch = useDispatch()
 20 
  const dispatch = useDispatch();
21 
 
 21 
 
22 
  const {
 22 
  const {
23 
    control,
 23 
    control,
24 
    formState: { isSubmitting },
 24 
    formState: { isSubmitting },
Línea 25... Línea 25...
25 
    handleSubmit
 25 
    handleSubmit,
26 
  } = useForm()
 26 
  } = useForm();
27 
 
 - 
 
28 
  const onSubmit = handleSubmit(async ({ cover }) => {
 - 
 
29 
    try {
 - 
 
30 
      const formData = new FormData()
 27 
 
31 
      formData.append('cover', cover)
 - 
 
32 
 
 - 
 
33 
      const response = await axios.post(url, formData)
 - 
 
34 
 
 - 
 
35 
      const { data, success } = response
 - 
 
36 
 
 28 
  const onSubmit = handleSubmit(async () => {
37 
      if (!success) throw new Error('Error al actualizar el portada')
 29 
    try {
38 
 
 30 
      const newCover = await axios.post(url, cover);
- 
 
 31 
      onChange(newCover);
- 
 
 32 
      onClose();
39 
      onChange(data)
 33 
    } catch (error) {
40 
      onClose()
 34 
      dispatch(
- 
 
 35 
        addNotification({
- 
 
 36 
          style: "danger",
41 
    } catch (error) {
 37 
          msg: "Error al actualizar el portada",
42 
      console.log(error)
 38 
        })
Línea 43... Línea 39...
43 
      dispatch(addNotification({ style: 'danger', msg: error.message }))
 39 
      );
44 
    }
 40 
    }
45 
  })
 41 
  });
46 
 
 42 
 
47 
  return (
 43 
  return (
48 
    <Modal
 44 
    <Modal
49 
      title={labels.cover}
 45 
      title={labels.cover}
50 
      show={show}
 46 
      show={show}
51 
      onClose={onClose}
 47 
      onClose={onClose}
52 
      onAccept={onSubmit}
 48 
      onAccept={onSubmit}
53 
      loading={isSubmitting}
 49 
      loading={isSubmitting}
54 
    >
 50 
    >
55 
      <Controller
 51 
      <Controller
56 
        name='cover'
 52 
        name="cover"
57 
        control={control}
 53 
        control={control}
58 
        rules={{ required: 'Portada requerida' }}
 54 
        rules={{ required: "Portada requerida" }}
59 
        render={({ field: { onChange, value }, fieldState: { error } }) => (
 55 
        render={({ field: { onChange, value }, fieldState: { error } }) => (
60 
          <>
 56 
          <>
61 
            <DropzoneComponent
 57 
            <DropzoneComponent
62 
              type='IMAGE'
 58 
              type="IMAGE"
63 
              onUploaded={onChange}
 59 
              onUploaded={onChange}
64 
              settedFile={value}
 60 
              settedFile={value}
65 
              recomendationText={`Imágenes recomendadas de ${sizes}`}
 61 
              recomendationText={`Imágenes recomendadas de ${sizes}`}
66 
            />
 62 
            />
67 
            {error && <FormErrorFeedback>{error.message}</FormErrorFeedback>}
 63 
            {error && <FormErrorFeedback>{error.message}</FormErrorFeedback>}
68 
          </>
 64 
          </>
69 
        )}
 65 
        )}
Línea 70... Línea 66...
70 
      />
 66 
      />