diff --git a/src/components/ConfirmationModal/ConfirmationModal.tsx b/src/components/ConfirmationModal/ConfirmationModal.tsx index 051ae8f10..41edfe55e 100644 --- a/src/components/ConfirmationModal/ConfirmationModal.tsx +++ b/src/components/ConfirmationModal/ConfirmationModal.tsx @@ -29,7 +29,7 @@ export type Props = PropsWithSpread< /** * Function to perform the action prompted by the modal. */ - onConfirm: (e: MouseEvent) => void; + onConfirm: (event: MouseEvent) => void; }, Omit >; @@ -44,13 +44,13 @@ export const ConfirmationModal = ({ ...props }: Props): ReactElement => { const handleClick = - (action: Function | null | undefined) => - (e: MouseEvent) => { + (action: A | null | undefined) => + (event: MouseEvent) => { if (!props.shouldPropagateClickEvent) { - e.stopPropagation(); + event.stopPropagation(); } if (action) { - action(e); + action(event); } }; diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx index c7306303a..a33792241 100644 --- a/src/components/Modal/Modal.tsx +++ b/src/components/Modal/Modal.tsx @@ -52,7 +52,7 @@ export const Modal = ({ const modalRef: MutableRefObject = useRef(null); const focusableModalElements = useRef(null); - const handleTabKey = (e: React.KeyboardEvent) => { + const handleTabKey = (event: React.KeyboardEvent) => { if (focusableModalElements.current.length > 0) { const firstElement = focusableModalElements.current[0]; const lastElement = @@ -60,27 +60,27 @@ export const Modal = ({ focusableModalElements.current.length - 1 ]; - if (!e.shiftKey && document.activeElement === lastElement) { + if (!event.shiftKey && document.activeElement === lastElement) { (firstElement as HTMLElement).focus(); - e.preventDefault(); + event.preventDefault(); } - if (e.shiftKey && document.activeElement === firstElement) { + if (event.shiftKey && document.activeElement === firstElement) { (lastElement as HTMLElement).focus(); - return e.preventDefault(); + return event.preventDefault(); } } }; const handleEscKey = ( - e: KeyboardEvent | React.KeyboardEvent + event: KeyboardEvent | React.KeyboardEvent ) => { - if ("nativeEvent" in e && e.nativeEvent.stopImmediatePropagation) { - e.nativeEvent.stopImmediatePropagation(); - } else if ("stopImmediatePropagation" in e) { - e.stopImmediatePropagation(); - } else if (e.stopPropagation) { - e.stopPropagation(); + if ("nativeEvent" in event && event.nativeEvent.stopImmediatePropagation) { + event.nativeEvent.stopImmediatePropagation(); + } else if ("stopImmediatePropagation" in event) { + event.stopImmediatePropagation(); + } else if (event.stopPropagation) { + event.stopPropagation(); } if (close) { close(); @@ -109,9 +109,9 @@ export const Modal = ({ }, [close]); useEffect(() => { - const keyDown = (e: KeyboardEvent) => { - const listener = keyListenersMap.get(e.code); - return listener && listener(e); + const keyDown = (event: KeyboardEvent) => { + const listener = keyListenersMap.get(event.code); + return listener && listener(event); }; document.addEventListener("keydown", keyDown); @@ -128,24 +128,26 @@ export const Modal = ({ shouldClose.current = false; }; - const handleOverlayOnMouseDown = (e: React.MouseEvent) => { - if (e.target === modalRef.current) { + const handleOverlayOnMouseDown = ( + event: React.MouseEvent + ) => { + if (event.target === modalRef.current) { shouldClose.current = true; } }; - const handleClose = (e: React.MouseEvent) => { + const handleClose = (event: React.MouseEvent) => { if (!shouldPropagateClickEvent) { - e.stopPropagation(); + event.stopPropagation(); } if (close) { close(); } }; - const handleOverlayOnClick = (e: React.MouseEvent) => { + const handleOverlayOnClick = (event: React.MouseEvent) => { if (shouldClose.current) { - handleClose(e); + handleClose(event); } };