Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 2721 Rev 2722
Línea 1... Línea 1...
1 
import React, { useCallback, useState, useEffect } from 'react'
 1 
import React from 'react'
2 
import { useSelector } from 'react-redux'
 2 
import { useSelector } from 'react-redux'
3 
 
 - 
 
- 
 
 3 
import { Box } from '@mui/material'
4 
import BootstrapModal from 'react-bootstrap/Modal'
 4 
import BootstrapModal from 'react-bootstrap/Modal'
Línea 5... Línea -...
5 
 
 - 
 
6 
import { isPromise } from '@app/utils'
 - 
 
7 
 
 5 
 
- 
 
 6 
import Button from '../buttons/Buttons'
Línea 8... Línea 7...
8 
import Button from '../buttons/Buttons'
 7 
import Spinner from '../Spinner'
Línea 9... Línea 8...
9 
 
 8 
 
10 
import styles from './Modal.module.scss'
 9 
import styles from './Modal.module.scss'
Línea 21... Línea 20...
21 
  size = 'md',
 20 
  size = 'md',
22 
  centered = true,
 21 
  centered = true,
23 
  animation = true,
 22 
  animation = true,
24 
  showFooter = true,
 23 
  showFooter = true,
25 
  dialogClassName,
 24 
  dialogClassName,
- 
 
 25 
  loading = false,
26 
  children
 26 
  children
27 
}) => {
 27 
}) => {
28 
  const [loading, setLoading] = useState(false)
 - 
 
29 
  const labels = useSelector(({ intl }) => intl.labels)
 28 
  const labels = useSelector(({ intl }) => intl.labels)
Línea 30... Línea -...
30 
 
 - 
 
31 
  const handleAccept = useCallback(() => {
 - 
 
32 
    const enableLoading = isPromise(onAccept)
 - 
 
33 
 
 - 
 
34 
    if (enableLoading) setLoading(true)
 - 
 
35 
    onAccept()
 - 
 
36 
  }, [onAccept])
 - 
 
37 
 
 - 
 
38 
  useEffect(() => {
 - 
 
39 
    if (!show && loading) setLoading(false)
 - 
 
40 
  }, [show, loading])
 - 
 
41 
 
 29 
 
42 
  return (
 30 
  return (
43 
    <BootstrapModal
 31 
    <BootstrapModal
44 
      animation={animation}
 32 
      animation={animation}
45 
      className={dialogClassName}
 33 
      className={dialogClassName}
Línea 55... Línea 43...
55 
        <BootstrapModal.Title>{title}</BootstrapModal.Title>
 43 
        <BootstrapModal.Title>{title}</BootstrapModal.Title>
56 
      </BootstrapModal.Header>
 44 
      </BootstrapModal.Header>
Línea 57... Línea 45...
57 
 
 45 
 
58 
      <BootstrapModal.Body className={styles['modal-content']}>
 46 
      <BootstrapModal.Body className={styles['modal-content']}>
- 
 
 47 
        {children}
- 
 
 48 
 
- 
 
 49 
        {loading ? (
- 
 
 50 
          <Box
- 
 
 51 
            sx={{
- 
 
 52 
              position: 'absolute',
- 
 
 53 
              zIndex: 1250,
- 
 
 54 
              width: '100%',
- 
 
 55 
              height: '100%',
- 
 
 56 
              top: 0,
- 
 
 57 
              left: 0,
- 
 
 58 
              display: 'grid',
- 
 
 59 
              placeItems: 'center'
- 
 
 60 
            }}
- 
 
 61 
          >
- 
 
 62 
            <Spinner />
- 
 
 63 
          </Box>
59 
        {children}
 64 
        ) : null}
Línea 60... Línea 65...
60 
      </BootstrapModal.Body>
 65 
      </BootstrapModal.Body>
61 
 
 66 
 
62 
      {showFooter ? (
 67 
      {showFooter ? (
63 
        <BootstrapModal.Footer className={styles['modal-footer']}>
 68 
        <BootstrapModal.Footer className={styles['modal-footer']}>
64 
          <Button variant='primary' onClick={handleAccept} disabled={loading}>
 69 
          <Button variant='primary' onClick={onAccept} disabled={loading}>
65 
            {labelAccept || labels.accept}
 70 
            {labelAccept || labels.accept}
66 
          </Button>
 71 
          </Button>
67 
          <Button variant='secondary' onClick={onReject || onClose}>
 72 
          <Button variant='secondary' onClick={onReject || onClose}>