close modals on ESC keydown

react/src/components/dashboard/walletsBasiliskConnection.js

@@ -13,11 +13,17 @@ class WalletsBasiliskConnection extends React.Component {
     Store.dispatch(basiliskConnection(false));
   }
 
+  handleKeydown(e) {
+    if (e.key === 'Escape') {
+      this.basiliskConnectionAction();
+    }
+  }
+
   render() {
     if (this.props &&
         this.props.Dashboard.basiliskConnection) {
       return (
-        <div>
+        <div onKeyDown={ (event) => this.handleKeydown(event) }>
           <div className="modal show" id="RefreshBasiliskConnectionsMdl" aria-hidden="false" role="dialog">
             <div className="modal-dialog modal-center modal-md">
               <div className="modal-content">

react/src/components/dashboard/walletsNotariesList.js

@@ -15,6 +15,12 @@ class WalletsNotariesList extends React.Component {
     Store.dispatch(displayNotariesModal(false));
   }
 
+  handleKeydown(e) {
+    if (e.key === 'Escape') {
+      this.closeNotariesModal();
+    }
+  }
+
   renderNotariesFetching() {
     if (!this.props.ActiveCoin.notaries) {
       return (
@@ -50,7 +56,7 @@ class WalletsNotariesList extends React.Component {
       const notariesData = this.props.ActiveCoin.notaries ? this.props.ActiveCoin.notaries.notaries : null;
 
       return (
-        <div>
+        <div onKeyDown={ (event) => this.handleKeydown(event) }>
           <div className="modal show" id="kmd_txid_info_mdl" aria-hidden="false" role="dialog">
             <div className="modal-dialog modal-center modal-lg">
               <div className="modal-content">

react/src/components/dashboard/walletsTxInfo.js

@@ -23,6 +23,12 @@ class WalletsTxInfo extends React.Component {
     }));
   }
 
+  handleKeydown(e) {
+    if (e.key === 'Escape') {
+      this.toggleTxInfoModal();
+    }
+  }
+
   render() {
     if (this.props &&
         this.props.ActiveCoin.showTransactionInfo &&
@@ -30,7 +36,7 @@ class WalletsTxInfo extends React.Component {
       const txInfo = this.props.ActiveCoin.txhistory[this.props.ActiveCoin.showTransactionInfoTxIndex];
 
       return (
-        <div>
+        <div onKeyDown={ (event) => this.handleKeydown(event) }>
           <div className="modal show" id="kmd_txid_info_mdl" aria-hidden="false" role="dialog">
             <div className="modal-dialog modal-center modal-lg">
               <div className="modal-content">