Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3175 | Rev 3584 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import React from 'react'
import { useSelector } from 'react-redux'
import { Button } from '@mui/material'
import BootstrapModal from 'react-bootstrap/Modal'

import Spinner from '../Spinner'

import styles from './Modal.module.scss'

const Modal = ({
  show = false,
  title = '',
  onAccept,
  onClose,
  onShow,
  onReject = null,
  labelAccept = '',
  labelReject = '',
  size = 'md',
  centered = true,
  animation = true,
  showFooter = true,
  dialogClassName,
  loading = false,
  children,
  formId = ''
}) => {
  const labels = useSelector(({ intl }) => intl.labels)

  return (
    <BootstrapModal
      animation={animation}
      className={dialogClassName}
      centered={centered}
      show={show}
      size={size}
      onHide={onClose}
      onShow={onShow}
      autoFocus={false}
      enforceFocus={false}
    >
      <BootstrapModal.Header className={styles['modal-header']} closeButton>
        <BootstrapModal.Title>{title}</BootstrapModal.Title>
      </BootstrapModal.Header>

      <BootstrapModal.Body className={styles['modal-content']}>
        {loading && <Spinner absolute />}
        {children}
      </BootstrapModal.Body>

      {showFooter ? (
        <BootstrapModal.Footer className={styles['modal-footer']}>
          <Button
            color='primary'
            onClick={onAccept}
            disabled={loading}
            form={formId}
            type={formId ? 'submit' : 'button'}
          >
            {labelAccept || labels.accept}
          </Button>
          <Button color='secondary' onClick={onReject || onClose}>
            {labelReject || labels.cancel}
          </Button>
        </BootstrapModal.Footer>
      ) : null}
    </BootstrapModal>
  )
}

export default Modal