[stable28] fix(mixins): migrate sessionIssueHandler mixin to composable

src/App.vue

@@ -56,8 +56,8 @@ import SettingsDialog from './components/SettingsDialog/SettingsDialog.vue'
 
 import { useActiveSession } from './composables/useActiveSession.js'
 import { useIsInCall } from './composables/useIsInCall.js'
+import { useSessionIssueHandler } from './composables/useSessionIssueHandler.js'
 import { CONVERSATION, PARTICIPANT } from './constants.js'
-import sessionIssueHandler from './mixins/sessionIssueHandler.js'
 import talkHashCheck from './mixins/talkHashCheck.js'
 import Router from './router/router.js'
 import BrowserStorage from './services/BrowserStorage.js'
@@ -81,15 +81,15 @@ export default {
 
 	mixins: [
 		talkHashCheck,
-		sessionIssueHandler,
 		isMobile,
 	],
 
 	setup() {
-		const isInCall = useIsInCall()
-		const supportSessionState = useActiveSession()
-
-		return { isInCall, supportSessionState }
+		return {
+			isInCall: useIsInCall(),
+			isLeavingAfterSessionIssue: useSessionIssueHandler(),
+			supportSessionState: useActiveSession(),
+		}
 	},
 
 	data() {

src/FilesSidebarCallViewApp.vue

@@ -38,7 +38,7 @@ import PreventUnload from 'vue-prevent-unload'
 import LoadingComponent from './components/LoadingComponent.vue'
 
 import { useIsInCall } from './composables/useIsInCall.js'
-import sessionIssueHandler from './mixins/sessionIssueHandler.js'
+import { useSessionIssueHandler } from './composables/useSessionIssueHandler.js'
 import talkHashCheck from './mixins/talkHashCheck.js'
 
 export default {
@@ -57,12 +57,14 @@ export default {
 	},
 
 	mixins: [
-		sessionIssueHandler,
 		talkHashCheck,
 	],
 
 	setup() {
-		return { isInCall: useIsInCall() }
+		return {
+			isInCall: useIsInCall(),
+			isLeavingAfterSessionIssue: useSessionIssueHandler(),
+		}
 	},
 
 	data() {

src/FilesSidebarTabApp.vue

@@ -52,7 +52,7 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
 import LoadingComponent from './components/LoadingComponent.vue'
 
-import sessionIssueHandler from './mixins/sessionIssueHandler.js'
+import { useSessionIssueHandler } from './composables/useSessionIssueHandler.js'
 import { EventBus } from './services/EventBus.js'
 import { getFileConversation } from './services/filesIntegrationServices.js'
 import {
@@ -76,9 +76,11 @@ export default {
 		NcButton,
 	},
 
-	mixins: [
-		sessionIssueHandler,
-	],
+	setup() {
+		return {
+			isLeavingAfterSessionIssue: useSessionIssueHandler(),
+		}
+	},
 
 	data() {
 		return {

src/PublicShareAuthSidebar.vue

@@ -49,7 +49,7 @@ import MediaSettings from './components/MediaSettings/MediaSettings.vue'
 import TopBar from './components/TopBar/TopBar.vue'
 import TransitionWrapper from './components/TransitionWrapper.vue'
 
-import sessionIssueHandler from './mixins/sessionIssueHandler.js'
+import { useSessionIssueHandler } from './composables/useSessionIssueHandler.js'
 import talkHashCheck from './mixins/talkHashCheck.js'
 import { EventBus } from './services/EventBus.js'
 import {
@@ -71,10 +71,15 @@ export default {
 	},
 
 	mixins: [
-		sessionIssueHandler,
 		talkHashCheck,
 	],
 
+	setup() {
+		return {
+			isLeavingAfterSessionIssue: useSessionIssueHandler(),
+		}
+	},
+
 	data() {
 		return {
 			fetchCurrentConversationIntervalId: null,

src/PublicShareSidebar.vue

@@ -68,7 +68,7 @@ import TopBar from './components/TopBar/TopBar.vue'
 import TransitionWrapper from './components/TransitionWrapper.vue'
 
 import { useIsInCall } from './composables/useIsInCall.js'
-import sessionIssueHandler from './mixins/sessionIssueHandler.js'
+import { useSessionIssueHandler } from './composables/useSessionIssueHandler.js'
 import talkHashCheck from './mixins/talkHashCheck.js'
 import { EventBus } from './services/EventBus.js'
 import { getPublicShareConversationData } from './services/filesIntegrationServices.js'
@@ -94,7 +94,6 @@ export default {
 	},
 
 	mixins: [
-		sessionIssueHandler,
 		talkHashCheck,
 	],
 
@@ -111,8 +110,10 @@ export default {
 	},
 
 	setup() {
-		const isInCall = useIsInCall()
-		return { isInCall }
+		return {
+			isInCall: useIsInCall(),
+			isLeavingAfterSessionIssue: useSessionIssueHandler(),
+		}
 	},
 
 	data() {

src/composables/useSessionIssueHandler.js

@@ -0,0 +1,78 @@
+/**
+ * @copyright Copyright (c) 2023 Maksim Sukharev <[email protected]>
+ *
+ * @author Maksim Sukharev <[email protected]>
+ * @author Marco Ambrosini <[email protected]>
+ *
+ * @license AGPL-3.0-or-later
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+import { nextTick, onBeforeMount, onBeforeUnmount, ref } from 'vue'
+
+import { generateUrl } from '@nextcloud/router'
+
+import { EventBus } from '../services/EventBus.js'
+import SessionStorage from '../services/SessionStorage.js'
+
+/**
+ * Check whether the conflicting session detected or not, and navigate to another page
+ *
+ * @return {import('vue').Ref<boolean>}
+ */
+export function useSessionIssueHandler() {
+	const isLeavingAfterSessionIssue = ref(false)
+
+	onBeforeMount(() => {
+		EventBus.$on('duplicate-session-detected', duplicateSessionTriggered)
+		EventBus.$on('deleted-session-detected', deletedSessionTriggered)
+	})
+
+	onBeforeUnmount(() => {
+		EventBus.$off('duplicate-session-detected', duplicateSessionTriggered)
+		EventBus.$off('deleted-session-detected', deletedSessionTriggered)
+	})
+
+	const redirectTo = (url) => {
+		isLeavingAfterSessionIssue.value = true
+		SessionStorage.removeItem('joined_conversation')
+		// Need to delay until next tick, otherwise the PreventUnload is still being triggered,
+		// placing the warning window in the foreground and annoying the user
+		if (!IS_DESKTOP) {
+			nextTick(() => {
+				// FIXME: can't use router push as it somehow doesn't clean up
+				// fully and leads the other instance where "Join here" was clicked
+				// to redirect to "not found"
+				window.location = generateUrl(url)
+			})
+		} else {
+			window.location.hash = `#${url}`
+			window.location.reload()
+		}
+	}
+
+	const duplicateSessionTriggered = () => {
+		// TODO: DESKTOP: should close the duplicated window instead of redirect
+		redirectTo('/apps/spreed/duplicate-session')
+	}
+
+	const deletedSessionTriggered = () => {
+		// workaround: force page refresh to kill stray WebRTC connections
+		redirectTo('/apps/spreed/not-found')
+	}
+
+	return isLeavingAfterSessionIssue
+}