From d797ede791f8f9e2d48efd225af3f6de791a033a Mon Sep 17 00:00:00 2001
From: Daniel Gasienica <daniel@signal.org>
Date: Sun, 15 Apr 2018 00:50:18 -0400
Subject: [PATCH] Close lightbox on escape key press

---
 ts/components/Lightbox.tsx | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx
index e58b1bb09..6e54707af 100644
--- a/ts/components/Lightbox.tsx
+++ b/ts/components/Lightbox.tsx
@@ -55,6 +55,16 @@ const IconButton = ({ onClick, type }: IconButtonProps) => (
 );
 
 export class Lightbox extends React.Component<Props, {}> {
+  public componentDidMount() {
+    const useCapture = true;
+    document.addEventListener('keyup', this.onKeyUp, useCapture);
+  }
+
+  public componentWillMount() {
+    const useCapture = true;
+    document.removeEventListener('keyup', this.onKeyUp, useCapture);
+  }
+
   public render() {
     const { imageURL } = this.props;
     return (
@@ -69,4 +79,12 @@ export class Lightbox extends React.Component<Props, {}> {
       </div>
     );
   }
+
+  private onKeyUp = (event: KeyboardEvent) => {
+    if (event.key !== 'Escape') {
+      return;
+    }
+
+    this.props.close();
+  }
 }