Allow hotkeys even when non-text input in focus

src/js/components/Hotkeys.js

@@ -5,7 +5,7 @@ import { bindActionCreators } from 'redux';
 import * as uiActions from '../services/ui/actions';
 import * as mopidyActions from '../services/mopidy/actions';
 
-class Hotkeys extends React.Component {
+class Hotkeys extends React.Component {
   constructor(props) {
     super(props);
     this.handleKeyDown = this.handleKeyDown.bind(this);
@@ -19,11 +19,14 @@ class Hotkeys extends React.Component {
     window.removeEventListener('keydown', this.handleKeyDown, false);
   }
 
-  handleKeyDown(e) {
-    // When we're focussed on certian elements, don't fire any shortcuts
-    // Typically form inputs
-    const ignoreNodes = ['INPUT', 'TEXTAREA', 'BUTTON'];
-    if (ignoreNodes.indexOf(e.target.nodeName) > -1) {
+  handleKeyDown(e) {
+    const key = e.key.toLowerCase();
+
+    // Ignore text input fields
+    if (
+      (e.target.nodeName === 'INPUT' && (e.target.type === 'text' || e.target.type === 'number')) ||
+      e.target.nodeName === 'TEXTAREA' ||
+      (e.target.nodeName === 'BUTTON' && key === ' ')) {
       return;
     }
 
@@ -34,7 +37,7 @@ class Hotkeys extends React.Component {
     }
 
     let prevent = false;
-    switch (e.key.toLowerCase()) {
+    switch (key) {
       case ' ':
       case 'p': // Super-useful once you get used to it. This negates the issue where interactive elements
         // are in focus (ie slider) and <space> is reserved for that field's interactivity.

src/js/views/Search.js

@@ -146,7 +146,7 @@ class Search extends React.Component {
       <div>
         <h4>
           <URILink uri={`iris:search:all:${encodedTerm}`}>
-						Search
+						{`Search `}
           </URILink>
           <Icon type="fontawesome" name="angle-right" />
           {` Artists`}