Proyectos de Subversion LeadersLinked - Backend

import axios from 'axios'

import React, { useState } from 'react'

import { Button, Modal } from 'react-bootstrap'

import { useForm } from 'react-hook-form'

const FooterModal = ({ isOpen, closeModal, footerUploadUrl, action }) => {

    const { handleSubmit, register } = useForm()

    const [error, setError] = useState();

    const onSubmit = ({ footer }) => {

        const data = new FormData()

        data.append("footer", footer[0])

        axios.post(footerUploadUrl, data)

            .then(resp => resp.json())

            .catch(err => console.log(err))

            .then(resp => console.log(resp))

    }

    return (

        <Modal

            size="md"

            show={isOpen}

            onHide={closeModal}

            autoFocus={false}

        >

            <Modal.Header closeButton>

                <Modal.Title>Cambiar</Modal.Title>

            </Modal.Header>

            <form onSubmit={handleSubmit(onSubmit)}>

                <Modal.Body>

                    <div className="mb-3">

                        <label for="formFileSm" className="form-label">Imagen recomendada de (2480 x 268px)</label>

                        <input

                            className="form-control form-control-sm"

                            id="formFileSm"

                            type="file"

                            name="footer"

                            accept='.jpg, .jpeg, .png, .gif'

                            ref={register}

                            style={{ padding: '1px' }}

                        />

                    </div>

                    {error && <p>{error}</p>}

                </Modal.Body>

                <Modal.Footer>

                    <Button

                        variant="primary"

                        type="submit"

                    >

                        Enviar

                    </Button>

                    <Button

                        variant="default"

                        onClick={closeModal}

                    >

                        Cancelar

                    </Button>

                </Modal.Footer>

            </form>

        </Modal >

    )

}

export default FooterModal