fix: resolve review comments

canonical · Mar 25, 2024 · edcaf49 · edcaf49
1 parent 7ca6900
commit edcaf49
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 26 deletions.
diff --git 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<HTMLElement>) => void;
+    onConfirm: (event: MouseEvent<HTMLElement>) => void;
   },
   Omit<ModalProps, "buttonRow">
 >;
@@ -44,13 +44,13 @@ export const ConfirmationModal = ({
   ...props
 }: Props): ReactElement => {
   const handleClick =
-    (action: Function | null | undefined) =>
-    (e: MouseEvent<HTMLButtonElement>) => {
+    <A extends Function>(action: A | null | undefined) =>
+    (event: MouseEvent<HTMLButtonElement>) => {
       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
@@ -52,35 +52,35 @@ export const Modal = ({
 
   const modalRef: MutableRefObject<HTMLElement> = useRef(null);
   const focusableModalElements = useRef(null);
-  const handleTabKey = (e: React.KeyboardEvent<HTMLDivElement>) => {
+  const handleTabKey = (event: React.KeyboardEvent<HTMLDivElement>) => {
     if (focusableModalElements.current.length > 0) {
       const firstElement = focusableModalElements.current[0];
       const lastElement =
         focusableModalElements.current[
           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<HTMLDivElement>
+    event: KeyboardEvent | React.KeyboardEvent<HTMLDivElement>
   ) => {
-    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<HTMLDivElement>) => {
-    if (e.target === modalRef.current) {
+  const handleOverlayOnMouseDown = (
+    event: React.MouseEvent<HTMLDivElement>
+  ) => {
+    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<HTMLDivElement>) => {
+  const handleOverlayOnClick = (event: React.MouseEvent<HTMLDivElement>) => {
     if (shouldClose.current) {
-      handleClose(e);
+      handleClose(event);
     }
   };