getting ready for real

src/components/big_picture.tsx

@@ -11,6 +11,14 @@ export interface Props {
 export class BigPicture extends React.PureComponent<Props, {}> {
   static displayName = "BigPicture";
 
+  componentDidMount() {
+    window.addEventListener("keyup", this._onEscape as any);
+  }
+
+  componentWillUnmount() {
+    window.removeEventListener("keyup", this._onEscape as any);
+  }
+
   render() {
     const src = `img/1600/${this.props.image.src}`;
     return (
@@ -47,4 +55,10 @@ export class BigPicture extends React.PureComponent<Props, {}> {
       this.props.onClose();
     }
   };
+
+  private _onEscape = (e: React.KeyboardEvent) => {
+    if (e.key === "Escape") {
+      this.props.onClose();
+    }
+  };
 }

src/components/picture.tsx

@@ -39,6 +39,10 @@ export class Picture extends React.PureComponent<Props, {}> {
       }
     });
 
+    if (srcs.length === 0) {
+      return `img/1600/${this.props.image.src} 1x`;
+    }
+
     return srcs.join(",");
   };
 }