Remove Escape from hotkeys

src-web/components/RecentRequestsDropdown.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import { useMemo, useRef } from 'react';
 import { useKey, useKeyPressEvent } from 'react-use';
-import { useActiveEnvironmentId } from '../hooks/useActiveEnvironmentId';
+import { useActiveEnvironment } from '../hooks/useActiveEnvironment';
 import { useActiveRequest } from '../hooks/useActiveRequest';
 import { useActiveWorkspaceId } from '../hooks/useActiveWorkspaceId';
 import { useAppRoutes } from '../hooks/useAppRoutes';
@@ -20,7 +20,7 @@ export function RecentRequestsDropdown({ className }: Pick<ButtonProps, 'classNa
   const dropdownRef = useRef<DropdownRef>(null);
   const activeRequest = useActiveRequest();
   const activeWorkspaceId = useActiveWorkspaceId();
-  const activeEnvironmentId = useActiveEnvironmentId();
+  const activeEnvironment = useActiveEnvironment();
   const httpRequests = useHttpRequests();
   const grpcRequests = useGrpcRequests();
   const routes = useAppRoutes();
@@ -68,7 +68,7 @@ export function RecentRequestsDropdown({ className }: Pick<ButtonProps, 'classNa
         onSelect: () => {
           routes.navigate('request', {
             requestId: request.id,
-            environmentId: activeEnvironmentId ?? undefined,
+            environmentId: activeEnvironment?.id,
             workspaceId: activeWorkspaceId,
           });
         },
@@ -87,7 +87,7 @@ export function RecentRequestsDropdown({ className }: Pick<ButtonProps, 'classNa
     }
 
     return recentRequestItems.slice(0, 20);
-  }, [activeWorkspaceId, activeEnvironmentId, recentRequestIds, requests, routes]);
+  }, [activeWorkspaceId, activeEnvironment?.id, recentRequestIds, requests, routes]);
 
   return (
     <Dropdown ref={dropdownRef} items={items}>

src-web/components/core/Dialog.tsx

@@ -2,7 +2,7 @@ import classNames from 'classnames';
 import { motion } from 'framer-motion';
 import type { ReactNode } from 'react';
 import { useMemo } from 'react';
-import { useHotKey } from '../../hooks/useHotKey';
+import { useKey } from 'react-use';
 import { Overlay } from '../Overlay';
 import { Heading } from './Heading';
 import { IconButton } from './IconButton';
@@ -36,7 +36,15 @@ export function Dialog({
     [description],
   );
 
-  useHotKey('popup.close', onClose, { enable: open });
+  useKey(
+    'Escape',
+    () => {
+      if (!open) return;
+      onClose();
+    },
+    {},
+    [open],
+  );
 
   return (
     <Overlay open={open} onClose={onClose} portalName="dialog">

src-web/components/core/Dropdown.tsx

@@ -244,13 +244,15 @@ const Menu = forwardRef<Omit<DropdownRef, 'open' | 'isOpen' | 'toggle'>, MenuPro
     }
   };
 
-  useHotKey(
-    'popup.close',
+  useKey(
+    'Escape',
     () => {
+      if (!isOpen) return;
       if (filter !== '') setFilter('');
       else handleClose();
     },
-    { enable: isOpen },
+    {},
+    [isOpen, filter, setFilter, handleClose],
   );
 
   const handlePrev = useCallback(() => {
@@ -288,11 +290,13 @@ const Menu = forwardRef<Omit<DropdownRef, 'open' | 'isOpen' | 'toggle'>, MenuPro
   }, [items]);
 
   useKey('ArrowUp', (e) => {
+    if (!isOpen) return;
     e.preventDefault();
     handlePrev();
   });
 
   useKey('ArrowDown', (e) => {
+    if (!isOpen) return;
     e.preventDefault();
     handleNext();
   });