Enter listener on Search

components/Search.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  input.search(v-model="searchInput" type="text" placeholder="Search")
+  input.search(v-model="searchInput" @keydown.enter="onEnter" type="text" placeholder="Search")
 </template>
 
 <script>
@@ -22,6 +22,10 @@ export default {
       R.join(''),
       R.adjust(0, () => '')
     ),
+    onEnter() {
+      const searchParams = new URLSearchParams({ ...this.$route.query, enter: true })
+      this.$router.push(this.searchPath + '?' + searchParams.toString())
+    },
   },
   watch: {
     searchInput(input) {

pages/search.vue

@@ -41,14 +41,19 @@ export default {
   watch: {
     $route(updatedChanges) {
       clearTimeout(this.debounceID)
-      this.debounceID = setTimeout(() => {
+      const updateSearch = () => {
         const keywords = updatedChanges.query.keywords
         const tags = updatedChanges.query.tags
         this.searchInput = {
           keywords: keywords && R.split(',', keywords),
           tags: tags && R.split(',', tags),
         }
-      }, 300)
+      }
+
+      if (updatedChanges.query.enter !== 'true')
+        this.debounceID = setTimeout(updateSearch, 300)
+      else
+        updateSearch()
     },
     searchInput(searchInput) {
       this.resources = this.$store.getters['data/findBySearchInputs'](searchInput.keywords, searchInput.tags)