Commit 2c913837 authored by Omar Luna Hernández's avatar Omar Luna Hernández
Browse files

Se modifica para utilizar un actualizador de estado

parent 4f89ad17

web/src/components/image_dropzone/image_dropzone.tsx

+5 −7
Original line number Diff line number Diff line 
import { ToastContainer, toast } from 'react-toastify';

import './assets/css/styles.css'

import { useDropzone } from "react-dropzone";

import { Dispatch, SetStateAction, useState } from 'react';

import './assets/css/styles.css';

import { Dispatch, SetStateAction } from 'react';

import "react-toastify/dist/ReactToastify.css";

import { UseFormSetValue } from 'react-hook-form';

import { Town } from '../../infraestructure/entities/town';



interface props {

  setValue : UseFormSetValue<Town>;

  setImage: Dispatch<SetStateAction<File | null>>;

  preview : string | ArrayBuffer | null;

  setPreview: Dispatch<SetStateAction<string | ArrayBuffer | null>>;

}



export const ImageDropzone = ({setValue, preview, setPreview}: props) => {

export const ImageDropzone = ({setImage, preview, setPreview}: props) => {

  const MAX_SIZE = 10485760;  

  const {getRootProps, getInputProps} = useDropzone(

    {
@@ -37,7 +35,7 @@ export const ImageDropzone = ({setValue, preview, setPreview}: props) => { 
        

        acceptedFiles.forEach((file)=>{

          const preview = URL.createObjectURL(file);

          setValue('imageURL',file,{shouldValidate: true});

          setImage(file);

          setPreview(preview);

        });

      }

web/src/components/sa_panel_town/sa_panel_town_register/sa_panel_town_register.tsx

+8 −1
Original line number Diff line number Diff line
@@ -31,6 +31,7 @@ export const SuperadminPanelTownRegister = ({setWindowActive, statesList, forceR 
  const [spanishDescription, setSpanishDescription] = useState("");

  const [englishDescription, setEnglishDescription] = useState("");

  const [preview, setPreview] = useState<string | ArrayBuffer | null>(null);

  const [image, setImage] = useState<File | null>(null);



  useEffect(()=> {

    if(!isRegister && form){
@@ -53,6 +54,12 @@ export const SuperadminPanelTownRegister = ({setWindowActive, statesList, forceR 
    }

  },[])



  useEffect(() => {

    if(image){

      setValue('imageURL', image, {shouldValidate: true});

    }

  },[image]);



  return (

    <div className="town_register_wrap">

      <div className="town_register_header">
@@ -137,7 +144,7 @@ export const SuperadminPanelTownRegister = ({setWindowActive, statesList, forceR 
            </div>

            <div className="image_container">

              <div>Fotografía representativa del pueblo</div>

              <ImageDropzone setValue={setValue} setPreview={setPreview} preview={preview}/>

              <ImageDropzone setImage={setImage} setPreview={setPreview} preview={preview}/>

              <p className="error">{errors.imageURL?.message}</p>

              <input type="submit"/>

            </div>