fix(useActiveSession): block UI if session expired

- experimental: try to join conversation if session is missing

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>

docs/settings.md

@@ -138,3 +138,4 @@ Features that can be toggled on-off with the `experiments_users` and `experiment
 | Bit | Status | Introduced                       | Ended | Description                                                                                                                 |
 |-----|--------|----------------------------------|-------|-----------------------------------------------------------------------------------------------------------------------------|
 | 1   | Active | Web 21.1.0<br>Desktop 1.2.2-beta | -     | Instead of refreshing the participant list repeatingly during calls, the data is generated from received signaling messages |
+| 2   | Active | Web 21.1.0<br>Desktop 1.2.2      | -     | Make automatic attempts to recover suspended / expired signaling session to allow join the call without page reload         |

src/composables/useActiveSession.js

@@ -4,14 +4,17 @@
  */
 
 import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'
-import { SESSION } from '../constants.ts'
-import { hasTalkFeature } from '../services/CapabilitiesManager.ts'
+import { CONFIG, SESSION } from '../constants.ts'
+import { getTalkConfig, hasTalkFeature } from '../services/CapabilitiesManager.ts'
 import { setSessionState } from '../services/participantsService.js'
 import { useDocumentVisibility } from './useDocumentVisibility.ts'
 import { useIsInCall } from './useIsInCall.js'
 import { useStore } from './useStore.js'
 
 const INACTIVE_TIME_MS = 3 * 60 * 1000
+
+const experimentalRecoverSession = (getTalkConfig('local', 'experiments', 'enabled') ?? 0) & CONFIG.EXPERIMENTAL.RECOVER_SESSION
+
 /**
  * Check whether the current session is active or not:
  * - tab or browser window was moved to background or minimized
@@ -74,6 +77,12 @@ export function useActiveSession() {
 			console.info('Session has been marked as active')
 		} catch (error) {
 			console.error(error)
+			if (experimentalRecoverSession && error?.response?.status === 404) {
+				// In case of 404 - participant did not have a session, block UI to join call
+				store.dispatch('updateLastJoinedConversationToken', '')
+				// Automatically try to join the conversation again
+				store.dispatch('joinConversation', { token: token.value })
+			}
 		}
 	}
 
@@ -94,6 +103,12 @@ export function useActiveSession() {
 			console.info('Session has been marked as inactive')
 		} catch (error) {
 			console.error(error)
+			if (experimentalRecoverSession && error?.response?.status === 404) {
+				// In case of 404 - participant did not have a session, block UI to join call
+				store.dispatch('updateLastJoinedConversationToken', '')
+				// Automatically try to join the conversation again
+				store.dispatch('joinConversation', { token: token.value })
+			}
 		}
 	}
 

src/constants.ts

@@ -16,6 +16,12 @@ export const CONFIG = {
 		 * the data is generated from received signaling messages
 		 */
 		UPDATE_PARTICIPANTS: 1,
+		/**
+		 * Since 21.1.0
+		 * Make automatic attempts to recover suspended / expired signaling session
+		 * to allow join the call without page reload
+		 */
+		RECOVER_SESSION: 2,
 	},
 } as const