Fix focusing on firefox

app/javascript/dashboard/routes/dashboard/search/components/SearchFocus.vue

@@ -1,23 +0,0 @@
-<template>
-  <div />
-</template>
-
-<script>
-export default {
-  mounted() {
-    this.handler = event => {
-      event.preventDefault();
-      this.$emit('keyup', event);
-    };
-    window.addEventListener('keyup', this.handler);
-  },
-  beforeDestroy() {
-    window.removeEventListener('keyup', this.handler);
-  },
-};
-</script>
-<style scoped>
-div {
-  display: none;
-}
-</style>

app/javascript/dashboard/routes/dashboard/search/components/SearchHeader.vue

@@ -1,31 +1,23 @@
 <template>
-  <div>
+  <div class="input-container">
-    <search-focus @keyup="focusSearch" />
+    <div class="icon-container">
-    <div class="input-container">
+      <fluent-icon icon="search" class="icon" aria-hidden="true" />
-      <div class="icon-container">
+    </div>
-        <fluent-icon icon="search" class="icon" aria-hidden="true" />
+    <input
-      </div>
+      ref="searchInput"
-      <input
+      type="search"
-        ref="searchInput"
+      :placeholder="$t('SEARCH.INPUT_PLACEHOLDER')"
-        type="search"
+      :value="searchQuery"
-        :placeholder="$t('SEARCH.INPUT_PLACEHOLDER')"
+      @input="debounceSearch"
-        :value="searchQuery"
+    />
-        @input="debounceSearch"
+    <div class="key-binding">
-      />
+      <span>{{ $t('SEARCH.PLACEHOLDER_KEYBINDING') }}</span>
-      <div class="key-binding">
-        <span>{{ $t('SEARCH.PLACEHOLDER_KEYBINDING') }}</span>
-      </div>
     </div>
   </div>
 </template>
 
 <script>
-import SearchFocus from './SearchFocus.vue';
-
 export default {
-  components: {
-    SearchFocus,
-  },
   data() {
     return {
       searchQuery: '',
@@ -33,6 +25,16 @@ export default {
   },
   mounted() {
     this.$refs.searchInput.focus();
+    this.handler = e => {
+      if (e.key === '/') {
+        e.preventDefault();
+        this.$refs.searchInput.focus();
+      }
+    };
+    document.addEventListener('keydown', this.handler);
+  },
+  beforeDestroy() {
+    window.removeEventListener('keydown', this.handler);
   },
   methods: {
     debounceSearch(e) {
@@ -44,12 +46,6 @@ export default {
         }
       }, 500);
     },
-    focusSearch(e) {
-      if (e.key === '/') {
-        e.preventDefault();
-        this.$refs.searchInput.focus();
-      }
-    },
   },
 };
 </script>