From ebb10bd954abf4f5f919dd00ace5b7902b61eb70 Mon Sep 17 00:00:00 2001
From: Aziz Hasanain <sgtaziz013@gmail.com>
Date: Sun, 27 Dec 2020 20:46:14 +0300
Subject: [PATCH] Simple search bar functionality

---
 src/App.vue                | 16 ++++++++++++----
 src/background.js          |  2 +-
 src/components/Message.vue |  5 ++++-
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 43d6ecd..9bc18e7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -25,10 +25,10 @@
         </div>
       </div>
       <div class="searchContainer">
-        <input type="search" placeholder="Search" class="textinput" />
+        <input type="search" placeholder="Search" class="textinput" v-model="search" />
       </div>
       <simplebar class="chats" ref="chats" data-simplebar-auto-hide="false">
-        <chat v-for="chat in chats" :key="chat.id" :chatid="chat.id"
+        <chat v-for="chat in filteredChats" :key="chat.id" :chatid="chat.id"
           :author="chat.author"
           :text="chat.text"
           :date="chat.date"
@@ -60,11 +60,19 @@ export default {
   data: function () {
     return {
       chats: [],
-      limit: 25,
+      limit: 50,
       offset: 0,
       loading: false,
       notifSound: null,
-      updateAvailable: false
+      updateAvailable: false,
+      search: ''
+    }
+  },
+  computed: {
+    filteredChats() {
+      return this.chats.filter((chat) => {
+        return chat.author.toLowerCase().includes(this.search.toLowerCase()) || chat.text.toLowerCase().includes(this.search.toLowerCase())
+      })
     }
   },
   methods: {
diff --git a/src/background.js b/src/background.js
index 40ad5b3..9b93a62 100644
--- a/src/background.js
+++ b/src/background.js
@@ -52,7 +52,7 @@ async function createWindow() {
   if (process.env.WEBPACK_DEV_SERVER_URL) {
     // Load the url of the dev server if in development mode
     await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
-    //if (!process.env.IS_TEST) win.webContents.openDevTools({mode:'undocked'})
+    if (!process.env.IS_TEST) win.webContents.openDevTools({mode:'undocked'})
 
     //Log autoUpdater in development
     autoUpdater.logger = require("electron-log")
diff --git a/src/components/Message.vue b/src/components/Message.vue
index 0521c21..c83f40d 100644
--- a/src/components/Message.vue
+++ b/src/components/Message.vue
@@ -187,6 +187,8 @@ export default {
           this.autoCompleteInput(input.value)
         }
       }
+
+      this.$nextTick(this.autoCompleteHooks)
     },
     isEmojis(msgText) {
       const regex = /<% RGI_Emoji %>|\p{Emoji_Presentation}|\p{Emoji}\uFE0F|\p{Emoji_Modifier_Base}/gu
@@ -295,7 +297,7 @@ export default {
     }
   },
   mounted () {
-    this.autoCompleteHooks()
+    this.$nextTick(this.autoCompleteHooks)
     this.fetchMessages()
   },
   socket: {
@@ -343,6 +345,7 @@ export default {
         }
         return
       }
+
       if (Object.keys(message).length == 0) {
         console.log("Received a message, but content was empty.")
       } else {