Trigger a vue event when SessionStorage "joined_conversation" changes

Otherwise there is no update of the computed and the call screen will not show up.

Signed-off-by: Joas Schilling <coding@schilljs.com>

1 files changed, 16 insertions, 16 deletions

diff --git a/src/FilesSidebarCallViewApp.vue b/src/FilesSidebarCallViewApp.vue
index 24e2e9fff..7ad620281 100644
--- a/src/FilesSidebarCallViewApp.vue
+++ b/src/FilesSidebarCallViewApp.vue
@@ -23,7 +23,7 @@
 <template>
 	<div v-if="isInFile">
 		<CallView
-			v-show="isInCall"
+			v-show="showCallView"
 			:token="token"
 			:is-sidebar="true" />
 		<PreventUnload :when="warnLeaving" />
@@ -36,8 +36,8 @@ import CallView from './components/CallView/CallView'
 import PreventUnload from 'vue-prevent-unload'
 import browserCheck from './mixins/browserCheck'
 import duplicateSessionHandler from './mixins/duplicateSessionHandler'
+import isInCall from './mixins/isInCall'
 import talkHashCheck from './mixins/talkHashCheck'
-import SessionStorage from './services/SessionStorage'
 
 export default {
 
@@ -51,6 +51,7 @@ export default {
 	mixins: [
 		browserCheck,
 		duplicateSessionHandler,
+		isInCall,
 		talkHashCheck,
 	],
 
@@ -93,39 +94,38 @@ export default {
 		 *          otherwise.
 		 */
 		isInFile() {
-			if (this.fileId !== this.fileIdForToken) {
-				return false
-			}
-
-			return true
+			return this.fileId === this.fileIdForToken
 		},
 
-		isInCall() {
+		showCallView() {
 			// FIXME Remove participants as soon as the file changes so this
 			// condition is not needed.
 			if (!this.isInFile) {
 				return false
 			}
 
+			return this.isInCall
+		},
+
+		participant() {
 			const participantIndex = this.$store.getters.getParticipantIndex(this.token, this.$store.getters.getParticipantIdentifier())
 			if (participantIndex === -1) {
-				return false
+				return {
+					inCall: PARTICIPANT.CALL_FLAG.DISCONNECTED,
+				}
 			}
 
-			const participant = this.$store.getters.getParticipant(this.token, participantIndex)
-
-			return SessionStorage.getItem('joined_conversation') === this.token
-				&& participant.inCall !== PARTICIPANT.CALL_FLAG.DISCONNECTED
+			return this.$store.getters.getParticipant(this.token, participantIndex)
 		},
 
 		warnLeaving() {
-			return !this.isLeavingAfterSessionConflict && this.isInCall
+			return !this.isLeavingAfterSessionConflict && this.showCallView
 		},
 	},
 
 	watch: {
-		isInCall: function(isInCall) {
-			if (isInCall) {
+		showCallView: function(showCallView) {
+			if (showCallView) {
 				this.replaceSidebarHeaderContentsWithCallView()
 			} else {
 				this.restoreSidebarHeaderContents()