Introduce debounce to reduce duplicated backend API calls

frontend/src/plugins/store/basic.js

@@ -1,5 +1,6 @@
 /* eslint-disable no-prototype-builtins */
 import { i18n } from '@/lang'
+import { debounce } from 'lodash';
 import { WsConnectionFactory } from '@/utils/backend/websocket'
 import { MessageHubApi } from '@/utils/backend/messageHub'
 
@@ -22,7 +23,7 @@ const checkUnreadRulesBy = (message, rules = []) => {
   return false
 }
 
-const updateConversations = (state, { token, cb }, data) => {
+const updateConversations = debounce((state, { token, cb }, data) => {
   MessageHubApi.fetchConversations(GWT, token)
     .then((response) => {
       const conversations = response.data.conversations || []
@@ -60,8 +61,8 @@ const updateConversations = (state, { token, cb }, data) => {
       if (cb && cb instanceof Function) {
         cb(err)
       }
-    })
-}
+    });
+}, 300);
 
 const basicStore = {
   namespaced: true,
@@ -126,6 +127,7 @@ const basicStore = {
           console.log('downstream_web_socket error')
         },
         () => {
+          console.log('downstream_web_socket closed')
           if (timer) {
             clearInterval(timer)
           }

frontend/src/utils/backend/websocket.js

@@ -3,12 +3,12 @@
 class WsConnectionFactory {
   static CreateWebSocket(jwt, onOpen, onMessage, onError, onClose) {
     // let jwt = userUtils.getJwtToken()
-    this.socket = new WebSocket(`/ws/downstream/online_platform_notification?token=${jwt}`)
-    this.socket.onopen = onOpen
-    this.socket.onmessage = onMessage
-    this.socket.onerror = onError
-    this.socket.onclose = onClose
-    return this.socket
+    const socket = new WebSocket(`/ws/downstream/online_platform_notification?token=${jwt}`)
+    socket.onopen = onOpen
+    socket.onmessage = onMessage
+    socket.onerror = onError
+    socket.onclose = onClose
+    return socket
   }
 }