From ecc8d7737419c9c6f4789da3ada1988bce6eaa49 Mon Sep 17 00:00:00 2001
From: Taka <taka@vm-linux-dev>
Date: Mon, 2 Mar 2020 07:13:40 +0000
Subject: [PATCH] Added a keyboard shortcut to set focus to the query string.

---
 web/src/App.js        | 15 ++++++++++++++-
 web/src/SearchForm.js |  2 +-
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/web/src/App.js b/web/src/App.js
index 6049489..8281967 100644
--- a/web/src/App.js
+++ b/web/src/App.js
@@ -378,7 +378,7 @@ export class App extends React.Component
 
     onKeyDown( evt ) {
         // check if a modal dialog is open and Ctrl-Enter was pressed
-        if ( this._modalFormRef && evt.keyCode === 13 && evt.ctrlKey ) {
+        if ( this._modalFormRef.current && evt.keyCode === 13 && evt.ctrlKey ) {
             let dlg = ReactDOM.findDOMNode( this._modalFormRef.current ) ;
             if ( dlg ) {
                 // yup - accept the dialog
@@ -389,6 +389,19 @@ export class App extends React.Component
                     console.log( "ERROR: Can't find default button." ) ;
             }
         }
+        // check for other shortcuts
+        if ( ! this._modalFormRef.current ) {
+            // Alt-R: set focus to query string
+            if ( evt.key === "r" && evt.altKey ) {
+                if ( this._searchFormRef.current ) {
+                    let elem = this._searchFormRef.current.queryStringRef.current ;
+                    if ( elem ) {
+                        elem.focus() ;
+                        elem.select() ;
+                    }
+                }
+            }
+        }
     }
 
     logInternalError( msg, detail ) {
diff --git a/web/src/SearchForm.js b/web/src/SearchForm.js
index 4e71df1..6a60a2e 100644
--- a/web/src/SearchForm.js
+++ b/web/src/SearchForm.js
@@ -20,7 +20,7 @@ export default class SearchForm extends React.Component
     render() {
         return (
             <form id="search-form" onSubmit={this.onSearch.bind(this)}>
-            <label className="caption"> Search&nbsp;for: </label>
+            <label className="caption"> Sea<u>r</u>ch&nbsp;for: </label>
             <input type="text" className="query"
                 value = {this.state.queryString}
                 onChange = { e => this.setState( { queryString: e.target.value } ) }