Add key escape shortcut to `Modal` component globally instead of single one

src/components/Modal/index.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import { ReactComponent } from "src/typings/global";
 import { Button } from "src/components/Button";
 import * as Styled from "./styles";
+import useKeyPress from "src/hooks/useKeyPress";
 
 type ControlProps = React.PropsWithChildren<{
   setVisible: (status: boolean) => void;
@@ -31,6 +32,12 @@ const Content: ReactComponent = ({ children }) => {
 };
 
 const Controls: React.FC<ControlProps> = ({ children, setVisible }) => {
+  const handleEspacePress = useKeyPress("Escape");
+
+  React.useEffect(() => {
+    if (handleEspacePress) setVisible(false);
+  }, [handleEspacePress]);
+
   return (
     <Styled.ControlsWrapper>
       <Button onClick={() => setVisible(false)}>Close</Button>

src/containers/ImportModal/index.tsx

@@ -7,7 +7,6 @@ import { ConfigActionType } from "src/reducer/reducer";
 import { Modal, ModalProps } from "src/components/Modal";
 import { Button } from "src/components/Button";
 import { AiOutlineUpload } from "react-icons/ai";
-import useKeyPress from "src/hooks/useKeyPress";
 
 const StyledInput = styled.input`
   background: ${({ theme }) => theme.BACKGROUND_TERTIARY};
@@ -98,14 +97,6 @@ export const ImportModal: React.FC<ModalProps> = ({ visible, setVisible }) => {
     }
   };
 
-  const handleEspacePress = useKeyPress("Escape");
-  const handleEnterKeyPress = useKeyPress("Enter");
-  React.useEffect(() => {
-    if (handleEspacePress) setVisible(false);
-
-    if (handleEnterKeyPress && (jsonFile || url)) handleImportFile();
-  }, [handleEspacePress, handleEnterKeyPress]);
-
   React.useEffect(() => {
     return () => {
       setJsonFile(null);