From bfbc917634b59171353f2687cfe6c8103ccd627d Mon Sep 17 00:00:00 2001
From: EnyMan <mous.imp@gmail.com>
Date: Tue, 29 Apr 2025 13:59:58 +0200
Subject: [PATCH] Add `ESC` shortcut for closing SidePanel

Signed-off-by: EnyMan <mous.imp@gmail.com>
---
 frontend/src/components/SidePanel.tsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/frontend/src/components/SidePanel.tsx b/frontend/src/components/SidePanel.tsx
index d10893f2032..ffdc0b55b1a 100644
--- a/frontend/src/components/SidePanel.tsx
+++ b/frontend/src/components/SidePanel.tsx
@@ -57,6 +57,20 @@ interface SidePanelProps {
 }
 
 class SidePanel extends React.Component<SidePanelProps> {
+  public componentDidMount(): void {
+    document.addEventListener('keydown', this.handleKeyDown);
+  }
+
+  public componentWillUnmount(): void {
+    document.removeEventListener('keydown', this.handleKeyDown);
+  }
+
+  private handleKeyDown = (event: KeyboardEvent): void => {
+    if (event.key === 'Escape' && this.props.isOpen) {
+      this.props.onClose();
+    }
+  };
+
   public render(): JSX.Element {
     const { isBusy, isOpen, onClose, title, defaultWidth } = this.props;
     return (