Merge branch 'websocket-fixes' into shigusegubu

* websocket-fixes:
  streamlined WS flow, reduced spam amount related to WS reconnections
  WIP some work on making errors less spammy

src/i18n/en.json

@@ -664,8 +664,7 @@
     "no_more_statuses": "No more statuses",
     "no_statuses": "No statuses",
     "socket_reconnected": "Realtime connection established",
-    "socket_broke": "Realtime connection lost: CloseEvent code {0}",
+    "socket_broke": "Realtime connection lost: CloseEvent code {0}"
-    "socket_closed": "No realtime connection, updates can arrive with a delaye until connection is re-established"
   },
   "status": {
     "favorites": "Favorites",

src/modules/api.js

@@ -3,8 +3,11 @@ import { WSConnectionStatus } from '../services/api/api.service.js'
 import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
 import { Socket } from 'phoenix'
 
+const retryTimeout = (multiplier) => 1000 * multiplier
+
 const api = {
   state: {
+    retryMultiplier: 1,
     backendInteractor: backendInteractorService(),
     fetchers: {},
     socket: null,
@@ -34,12 +37,22 @@ const api = {
     },
     setMastoUserSocketStatus (state, value) {
       state.mastoUserSocketStatus = value
+    },
+    incrementRetryMultiplier (state) {
+      state.retryMultiplier = Math.max(++state.retryMultiplier, 3)
+    },
+    resetRetryMultiplier (state) {
+      state.retryMultiplier = 1
     }
   },
   actions: {
-    // Global MastoAPI socket control, in future should disable ALL sockets/(re)start relevant sockets
+    /**
-    enableMastoSockets (store) {
+     * Global MastoAPI socket control, in future should disable ALL sockets/(re)start relevant sockets
-      const { state, dispatch } = store
+     *
+     * @param {Boolean} [initial] - whether this enabling happened at boot time or not
+     */
+    enableMastoSockets (store, initial) {
+      const { state, dispatch, commit } = store
       // Do not initialize unless nonexistent or closed
       if (
         state.mastoUserSocket &&
@@ -50,11 +63,17 @@ const api = {
       ) {
         return
       }
+      if (initial) {
+        commit('setMastoUserSocketStatus', WSConnectionStatus.STARTING_INITIAL)
+      } else {
+        commit('setMastoUserSocketStatus', WSConnectionStatus.STARTING)
+      }
       return dispatch('startMastoUserSocket')
     },
     disableMastoSockets (store) {
-      const { state, dispatch } = store
+      const { state, dispatch, commit } = store
       if (!state.mastoUserSocket) return
+      commit('setMastoUserSocketStatus', WSConnectionStatus.DISABLED)
       return dispatch('stopMastoUserSocket')
     },
 
@@ -101,28 +120,29 @@ const api = {
           )
           state.mastoUserSocket.addEventListener('open', () => {
             // Do not show notification when we just opened up the page
-            if (state.mastoUserSocketStatus !== null) {
+            if (state.mastoUserSocketStatus !== WSConnectionStatus.STARTING_INITIAL) {
               dispatch('pushGlobalNotice', {
                 level: 'success',
                 messageKey: 'timeline.socket_reconnected',
                 timeout: 5000
               })
             }
+            // Stop polling if we were errored or disabled
+            if (new Set([
+              WSConnectionStatus.ERROR,
+              WSConnectionStatus.DISABLED
+            ]).has(state.mastoUserSocketStatus)) {
+              dispatch('stopFetchingTimeline', { timeline: 'friends' })
+              dispatch('stopFetchingNotifications')
+              dispatch('stopFetchingChats')
+            }
+            commit('resetRetryMultiplier')
             commit('setMastoUserSocketStatus', WSConnectionStatus.JOINED)
           })
           state.mastoUserSocket.addEventListener('error', ({ detail: error }) => {
             console.error('Error in MastoAPI websocket:', error)
-            commit('setMastoUserSocketStatus', WSConnectionStatus.ERROR)
+            // TODO is this needed?
             dispatch('clearOpenedChats')
-            /* Since data in WS event for error is useless it's better to show
-             * generic warning instead of in "close" which actually has some
-             * useful data
-             */
-            dispatch('pushGlobalNotice', {
-              level: 'error',
-              messageKey: 'timeline.socket_closed',
-              timeout: 5000
-            })
           })
           state.mastoUserSocket.addEventListener('close', ({ detail: closeEvent }) => {
             const ignoreCodes = new Set([
@@ -132,12 +152,17 @@ const api = {
             const { code } = closeEvent
             if (ignoreCodes.has(code)) {
               console.debug(`Not restarting socket becasue of closure code ${code} is in ignore list`)
+              commit('setMastoUserSocketStatus', WSConnectionStatus.CLOSED)
             } else {
               console.warn(`MastoAPI websocket disconnected, restarting. CloseEvent code: ${code}`)
+              setTimeout(() => {
+                dispatch('startMastoUserSocket')
+              }, retryTimeout(state.retryMultiplier))
+              commit('incrementRetryMultiplier')
+              if (state.mastoUserSocketStatus !== WSConnectionStatus.ERROR) {
                 dispatch('startFetchingTimeline', { timeline: 'friends' })
                 dispatch('startFetchingNotifications')
                 dispatch('startFetchingChats')
-              dispatch('restartMastoUserSocket')
                 dispatch('pushGlobalNotice', {
                   level: 'error',
                   messageKey: 'timeline.socket_broke',
@@ -145,7 +170,8 @@ const api = {
                   timeout: 5000
                 })
               }
-            commit('setMastoUserSocketStatus', WSConnectionStatus.CLOSED)
+              commit('setMastoUserSocketStatus', WSConnectionStatus.ERROR)
+            }
             dispatch('clearOpenedChats')
           })
           resolve()
@@ -154,15 +180,6 @@ const api = {
         }
       })
     },
-    restartMastoUserSocket ({ dispatch }) {
-      // This basically starts MastoAPI user socket and stops conventional
-      // fetchers when connection reestablished
-      return dispatch('startMastoUserSocket').then(() => {
-        dispatch('stopFetchingTimeline', { timeline: 'friends' })
-        dispatch('stopFetchingNotifications')
-        dispatch('stopFetchingChats')
-      })
-    },
     stopMastoUserSocket ({ state, dispatch }) {
       dispatch('startFetchingTimeline', { timeline: 'friends' })
       dispatch('startFetchingNotifications')

src/modules/users.js

@@ -549,9 +549,8 @@ const users = {
               if (store.getters.mergedConfig.useStreamingApi) {
                 store.dispatch('fetchTimeline', 'friends', { since: null })
                 store.dispatch('fetchNotifications', { since: null })
-                store.dispatch('enableMastoSockets').catch((error) => {
+                store.dispatch('enableMastoSockets', true).catch((error) => {
                   console.error('Failed initializing MastoAPI Streaming socket', error)
-                  startPolling()
                 }).then(() => {
                   store.dispatch('fetchChats', { latest: true })
                   setTimeout(() => store.dispatch('setNotificationsSilence', false), 10000)

src/services/api/api.service.js

@@ -1184,7 +1184,10 @@ export const handleMastoWS = (wsEvent) => {
 export const WSConnectionStatus = Object.freeze({
   'JOINED': 1,
   'CLOSED': 2,
-  'ERROR': 3
+  'ERROR': 3,
+  'DISABLED': 4,
+  'STARTING': 5,
+  'STARTING_INITIAL': 6
 })
 
 const chats = ({ credentials }) => {