Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6707 stevensc 1 
import React, { useRef } from 'react'
2 
import useOutsideClick from '../../hooks/useOutsideClick'
3 
 
4 
const ConfirmBox = ({ show, onClose, onAccept }) => {
5 
  const confirmationBoxRef = useRef()
6 
  useOutsideClick(confirmationBoxRef, () => {
7 
    console.log(confirmationBoxRef.current)
8 
    onClose()
9 
  })
10 
 
11 
  return (
12 
    <div
13 
      className="popover confirmation fade bs-popover-top show"
14 
      id="confirmation937427"
15 
      style={{
16 
        position: 'absolute',
17 
        top: '-2.5rem',
18 
        left: '50%',
19 
        transform: 'translate(-50%, -100%)',
20 
        width: '120px',
21 
        display: show ? 'block' : 'none',
22 
      }}
23 
      ref={confirmationBoxRef}
24 
    >
25 
      <div className="arrow" style={{ left: '46px' }}></div>
26 
      <p className="popover-header">¿Está seguro?</p>
27 
      <div className="popover-body">
28 
        <p className="confirmation-content" style={{ display: 'none' }}></p>
29 
        <div className="confirmation-buttons text-center">
30 
          <div className="btn-group">
31 
            <button
32 
              type="button"
33 
              className="h-100 d-flex align-items-center btn btn-sm btn-primary"
34 
              onClick={() => {
35 
                onAccept()
36 
                onClose()
37 
              }}
38 
            >
39 
              Si
40 
            </button>
41 
            <button
42 
              type="button"
43 
              className="h-100 d-flex align-items-center btn btn-sm btn-secondary"
44 
              onClick={() => {
45 
                onClose()
46 
              }}
47 
            >
48 
              No
49 
            </button>
50 
          </div>
51 
        </div>
52 
      </div>
53 
    </div>
54 
  )
55 
}
56 
 
57 
export default ConfirmBox