All files / frontend/src/components DangerButton.tsx

50% Statements 11/22
25% Branches 3/12
66.66% Functions 4/6
50% Lines 11/22

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53      1x 2x 2x   2x 2x         2x 2x 2x       2x                                 2x 2x                              
import * as React from 'react';
import { useState, useEffect, useRef, useCallback } from 'react';
 
const DangerButton = ({ onClick, loadedButton, button, loadedProps }) => {
  const [clicked, setClicked] = useState(false);
  const timeoutRef = useRef(null);
 
  const clearTimeoutRef = useCallback(() => {
    Iif (timeoutRef.current) {
      clearTimeout(timeoutRef.current);
    }
  }, []);
 
  useEffect(() => {
    return () => {
      clearTimeoutRef();
    };
  }, [clearTimeoutRef]);
 
  const onButtonClick = useCallback((e) => {
    if (onClick) {
      onClick(e, clicked);
    }
 
    if (clicked) {
      setClicked(false);
      clearTimeoutRef();
    } else {
      setClicked(true);
 
      timeoutRef.current = setTimeout(() => {
        setClicked(false);
      }, 3000);
    }
  }, [onClick, clicked, clearTimeoutRef]);
 
  if (loadedButton) {
    return React.cloneElement(
      (clicked ? loadedButton : button),
      { onClick: onButtonClick }
    );
  } else E{
    const _props = Object.assign(
      {},
      (clicked ? loadedProps : undefined),
      { onClick: onButtonClick }
    );
    return React.cloneElement(button, _props);
  }
};
 
export default DangerButton;