Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react'

import { useSelector } from 'react-redux'

import { shareModalTypes } from '../../redux/share-modal/shareModal.types'

import Modal from 'components/UI/modal/Modal'

import Spinner from 'components/UI/Spinner'

import FormErrorFeedback from 'components/UI/form/FormErrorFeedback'

import DropzoneComponent from 'components/dropzone/DropzoneComponent'

const FileModal = ({ isShow, onHide, onComplete, loading }) => {

  const [selectedFile, setSelectedFile] = useState(null)

  const [error, setError] = useState(false)

  const labels = useSelector(({ intl }) => intl.labels)

  const onUpload = (file) => {

    setSelectedFile(file)

  }

  const onClose = () => {

    setSelectedFile(null)

    onHide()

  }

  const handleSubmit = () => {

    if (!selectedFile) {

      setError(true)

      return

    }

    onComplete(selectedFile)

  }

  return (

    <Modal

      show={isShow}

      onClose={onClose}

      onReject={onClose}

      onAccept={handleSubmit}

    >

      {loading ? (

        <Spinner />

      ) : (

        <DropzoneComponent

          modalType={shareModalTypes.CHAT}

          onUploaded={onUpload}

          settedFile={selectedFile}

          recomendationText={

            <p className='text-center'>

              {labels.extensions_allowed}: png, jpg, jpeg, mp4, mpeg, webm, pdf.

            </p>

          }

        />

      )}

      {error && <FormErrorFeedback>{labels.select_file}</FormErrorFeedback>}

    </Modal>

  )

}

export default FileModal