From f8d95bfc640cfbc56acc2cccab68615345a0a551 Mon Sep 17 00:00:00 2001
From: nickolasbenakis <N.benakis@afse.eu>
Date: Mon, 9 Dec 2019 09:58:32 +0200
Subject: [PATCH] Typing should focus on searchbar #2

---
 src/components/searchbar.jsx | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/components/searchbar.jsx b/src/components/searchbar.jsx
index f786a32..567e058 100644
--- a/src/components/searchbar.jsx
+++ b/src/components/searchbar.jsx
@@ -8,6 +8,13 @@ class Searchbar extends React.Component {
   constructor(props) {
     super(props);
     this.handleChange = this.handleChange.bind(this);
+    this.searchBarRef = React.createRef();
+    this.handleFocus = this.handleFocus.bind(this);
+    document.addEventListener('keypress', this.handleFocus);
+  }
+
+  handleFocus() {
+    this.searchBarRef.current.focus();
   }
 
   handleChange(event) {
@@ -16,11 +23,19 @@ class Searchbar extends React.Component {
   }
 
   render() {
+    /* eslint-disable jsx-a11y/no-autofocus */
+    /* eslint-disable no-trailing-spaces */
     const { search, searchbarFixed } = this.props;
     return (
       <div className={`search ${searchbarFixed ? 'search-fixed' : ''}`}>
         <div className="searchbar-container">
-          <input defaultValue={search || ''} onChange={this.handleChange} placeholder="Search" />
+          <input
+            ref={this.searchBarRef}
+            defaultValue={search || ''} 
+            onChange={this.handleChange} 
+            placeholder="Search" 
+            autoFocus
+          />
         </div>
         <div className="checkboxes">
           <div>