Merge pull request #217 from Saghen/search-changes

Search changes

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) {
@@ -32,12 +36,21 @@ export default {
       const searchParams = new URLSearchParams()
       if (isNotEmpty(titles))
         searchParams.append('keywords', titles)
-      if (isNotEmpty(tags))  
+      if (isNotEmpty(tags))
         searchParams.append('tags', R.map(this.removeFirstChar, tags))
-      
+
       this.$router.push(this.searchPath + '?' + searchParams.toString())
     },
   },
+  mounted() {
+    let keywords = this.$route.query.keywords || ''
+    keywords = keywords.split(',').join(' ')
+
+    let tags = this.$route.query.tags || ''
+    tags = R.filter(this.isTag, tags.split(',')).map(tag => `#${tag}`).join(' ')
+
+    this.searchInput = `${tags} ${keywords}`.trim()
+  },
 }
 </script>
 

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),
         }
-      }, 500)
+      }
+
+      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)
@@ -56,6 +61,13 @@ export default {
   },
   mounted() {
     this.showTitle = true
+
+    const keywords = this.$route.query.keywords
+    const tags = this.$route.query.tags
+    this.searchInput = {
+      keywords: keywords && R.split(',', keywords),
+      tags: tags && R.split(',', tags),
+    }
   },
   methods: {
     async createCopyUrl(resource) {