forked from AkkomaGang/akkoma-fe
streamlined WS flow, reduced spam amount related to WS reconnections
This commit is contained in:
parent
90afcd3420
commit
a8967d85bd
5 changed files with 56 additions and 49 deletions
|
@ -3,9 +3,10 @@ import { WSConnectionStatus } from '../services/api/api.service.js'
|
||||||
import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
|
import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
|
||||||
import { Socket } from 'phoenix'
|
import { Socket } from 'phoenix'
|
||||||
|
|
||||||
|
const retryTimeout = (multiplier) => 1000 * multiplier
|
||||||
|
|
||||||
const api = {
|
const api = {
|
||||||
state: {
|
state: {
|
||||||
connectionBroken: false,
|
|
||||||
retryMultiplier: 1,
|
retryMultiplier: 1,
|
||||||
backendInteractor: backendInteractorService(),
|
backendInteractor: backendInteractorService(),
|
||||||
fetchers: {},
|
fetchers: {},
|
||||||
|
@ -37,16 +38,20 @@ const api = {
|
||||||
setMastoUserSocketStatus (state, value) {
|
setMastoUserSocketStatus (state, value) {
|
||||||
state.mastoUserSocketStatus = value
|
state.mastoUserSocketStatus = value
|
||||||
},
|
},
|
||||||
recoverConnection (state) {
|
incrementRetryMultiplier (state) {
|
||||||
state.connectionBroken = false
|
state.retryMultiplier = Math.max(++state.retryMultiplier, 3)
|
||||||
},
|
},
|
||||||
breakConnection (state) {
|
resetRetryMultiplier (state) {
|
||||||
state.connectionBroken = true
|
state.retryMultiplier = 1
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
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
|
||||||
|
*
|
||||||
|
* @param {Boolean} [initial] - whether this enabling happened at boot time or not
|
||||||
|
*/
|
||||||
|
enableMastoSockets (store, initial) {
|
||||||
const { state, dispatch, commit } = store
|
const { state, dispatch, commit } = store
|
||||||
// Do not initialize unless nonexistent or closed
|
// Do not initialize unless nonexistent or closed
|
||||||
if (
|
if (
|
||||||
|
@ -58,13 +63,17 @@ const api = {
|
||||||
) {
|
) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
commit('recoverConnection')
|
if (initial) {
|
||||||
|
commit('setMastoUserSocketStatus', WSConnectionStatus.STARTING_INITIAL)
|
||||||
|
} else {
|
||||||
|
commit('setMastoUserSocketStatus', WSConnectionStatus.STARTING)
|
||||||
|
}
|
||||||
return dispatch('startMastoUserSocket')
|
return dispatch('startMastoUserSocket')
|
||||||
},
|
},
|
||||||
disableMastoSockets (store) {
|
disableMastoSockets (store) {
|
||||||
const { state, dispatch, commit } = store
|
const { state, dispatch, commit } = store
|
||||||
if (!state.mastoUserSocket) return
|
if (!state.mastoUserSocket) return
|
||||||
commit('recoverConnection')
|
commit('setMastoUserSocketStatus', WSConnectionStatus.DISABLED)
|
||||||
return dispatch('stopMastoUserSocket')
|
return dispatch('stopMastoUserSocket')
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -111,19 +120,28 @@ const api = {
|
||||||
)
|
)
|
||||||
state.mastoUserSocket.addEventListener('open', () => {
|
state.mastoUserSocket.addEventListener('open', () => {
|
||||||
// Do not show notification when we just opened up the page
|
// Do not show notification when we just opened up the page
|
||||||
if (state.mastoUserSocketStatus !== null) {
|
if (state.mastoUserSocketStatus !== WSConnectionStatus.STARTING_INITIAL) {
|
||||||
commit('recoverConnection')
|
|
||||||
dispatch('pushGlobalNotice', {
|
dispatch('pushGlobalNotice', {
|
||||||
level: 'success',
|
level: 'success',
|
||||||
messageKey: 'timeline.socket_reconnected',
|
messageKey: 'timeline.socket_reconnected',
|
||||||
timeout: 5000
|
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)
|
commit('setMastoUserSocketStatus', WSConnectionStatus.JOINED)
|
||||||
})
|
})
|
||||||
state.mastoUserSocket.addEventListener('error', ({ detail: error }) => {
|
state.mastoUserSocket.addEventListener('error', ({ detail: error }) => {
|
||||||
console.error('Error in MastoAPI websocket:', error)
|
console.error('Error in MastoAPI websocket:', error)
|
||||||
commit('setMastoUserSocketStatus', WSConnectionStatus.ERROR)
|
// TODO is this needed?
|
||||||
dispatch('clearOpenedChats')
|
dispatch('clearOpenedChats')
|
||||||
})
|
})
|
||||||
state.mastoUserSocket.addEventListener('close', ({ detail: closeEvent }) => {
|
state.mastoUserSocket.addEventListener('close', ({ detail: closeEvent }) => {
|
||||||
|
@ -134,16 +152,17 @@ const api = {
|
||||||
const { code } = closeEvent
|
const { code } = closeEvent
|
||||||
if (ignoreCodes.has(code)) {
|
if (ignoreCodes.has(code)) {
|
||||||
console.debug(`Not restarting socket becasue of closure code ${code} is in ignore list`)
|
console.debug(`Not restarting socket becasue of closure code ${code} is in ignore list`)
|
||||||
|
commit('setMastoUserSocketStatus', WSConnectionStatus.CLOSED)
|
||||||
} else {
|
} else {
|
||||||
console.warn(`MastoAPI websocket disconnected, restarting. CloseEvent code: ${code}`)
|
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('startFetchingTimeline', { timeline: 'friends' })
|
||||||
dispatch('startFetchingNotifications')
|
dispatch('startFetchingNotifications')
|
||||||
dispatch('startFetchingChats')
|
dispatch('startFetchingChats')
|
||||||
setTimeout(() => {
|
|
||||||
console.log('TEST')
|
|
||||||
dispatch('restartMastoUserSocket')
|
|
||||||
}, 1000)
|
|
||||||
if (!state.connectionBroken) {
|
|
||||||
dispatch('pushGlobalNotice', {
|
dispatch('pushGlobalNotice', {
|
||||||
level: 'error',
|
level: 'error',
|
||||||
messageKey: 'timeline.socket_broke',
|
messageKey: 'timeline.socket_broke',
|
||||||
|
@ -151,9 +170,8 @@ const api = {
|
||||||
timeout: 5000
|
timeout: 5000
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
commit('breakConnection')
|
commit('setMastoUserSocketStatus', WSConnectionStatus.ERROR)
|
||||||
}
|
}
|
||||||
commit('setMastoUserSocketStatus', WSConnectionStatus.CLOSED)
|
|
||||||
dispatch('clearOpenedChats')
|
dispatch('clearOpenedChats')
|
||||||
})
|
})
|
||||||
resolve()
|
resolve()
|
||||||
|
@ -162,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 }) {
|
stopMastoUserSocket ({ state, dispatch }) {
|
||||||
dispatch('startFetchingTimeline', { timeline: 'friends' })
|
dispatch('startFetchingTimeline', { timeline: 'friends' })
|
||||||
dispatch('startFetchingNotifications')
|
dispatch('startFetchingNotifications')
|
||||||
|
|
|
@ -549,9 +549,8 @@ const users = {
|
||||||
if (store.getters.mergedConfig.useStreamingApi) {
|
if (store.getters.mergedConfig.useStreamingApi) {
|
||||||
store.dispatch('fetchTimeline', 'friends', { since: null })
|
store.dispatch('fetchTimeline', 'friends', { since: null })
|
||||||
store.dispatch('fetchNotifications', { 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)
|
console.error('Failed initializing MastoAPI Streaming socket', error)
|
||||||
startPolling()
|
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
store.dispatch('fetchChats', { latest: true })
|
store.dispatch('fetchChats', { latest: true })
|
||||||
setTimeout(() => store.dispatch('setNotificationsSilence', false), 10000)
|
setTimeout(() => store.dispatch('setNotificationsSilence', false), 10000)
|
||||||
|
|
|
@ -1184,7 +1184,10 @@ export const handleMastoWS = (wsEvent) => {
|
||||||
export const WSConnectionStatus = Object.freeze({
|
export const WSConnectionStatus = Object.freeze({
|
||||||
'JOINED': 1,
|
'JOINED': 1,
|
||||||
'CLOSED': 2,
|
'CLOSED': 2,
|
||||||
'ERROR': 3
|
'ERROR': 3,
|
||||||
|
'DISABLED': 4,
|
||||||
|
'STARTING': 5,
|
||||||
|
'STARTING_INITIAL': 6
|
||||||
})
|
})
|
||||||
|
|
||||||
const chats = ({ credentials }) => {
|
const chats = ({ credentials }) => {
|
||||||
|
|
|
@ -57,14 +57,12 @@ const fetchNotifications = ({ store, args, older }) => {
|
||||||
return notifications
|
return notifications
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
if (!store.rootState.api.connectionBroken) {
|
|
||||||
store.dispatch('pushGlobalNotice', {
|
store.dispatch('pushGlobalNotice', {
|
||||||
level: 'error',
|
level: 'error',
|
||||||
messageKey: 'notifications.error',
|
messageKey: 'notifications.error',
|
||||||
messageArgs: [error.message],
|
messageArgs: [error.message],
|
||||||
timeout: 5000
|
timeout: 5000
|
||||||
})
|
})
|
||||||
}
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -66,14 +66,12 @@ const fetchAndUpdate = ({
|
||||||
return { statuses, pagination }
|
return { statuses, pagination }
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
if (!store.rootState.api.connectionBroken) {
|
|
||||||
store.dispatch('pushGlobalNotice', {
|
store.dispatch('pushGlobalNotice', {
|
||||||
level: 'error',
|
level: 'error',
|
||||||
messageKey: 'timeline.error',
|
messageKey: 'timeline.error',
|
||||||
messageArgs: [error.message],
|
messageArgs: [error.message],
|
||||||
timeout: 5000
|
timeout: 5000
|
||||||
})
|
})
|
||||||
}
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue