Fix conversation switch lag

Signed-off-by: Marco Ambrosini <marcoambrosini@pm.me>

src/components/ChatView.vue

@@ -70,13 +70,6 @@ export default {
 		NewMessageForm,
 	},
 
-	props: {
-		token: {
-			type: String,
-			required: true,
-		},
-	},
-
 	data: function() {
 		return {
 			isDraggingOver: false,
@@ -109,6 +102,10 @@ export default {
 				return undefined
 			}
 		},
+
+		token() {
+			return this.$store.getters.getToken()
+		},
 	},
 
 	methods: {

src/components/LeftSidebar/ConversationsList/Conversation.vue

@@ -113,6 +113,7 @@ import {
 } from '../../../services/conversationsService'
 import { generateUrl } from '@nextcloud/router'
 import { CONVERSATION, PARTICIPANT } from '../../../constants'
+import { EventBus } from '../../../services/EventBus'
 
 export default {
 	name: 'Conversation',
@@ -370,6 +371,9 @@ export default {
 
 		// forward click event
 		onClick(event) {
+			EventBus.$emit('conversationClicked', {
+				token: this.item.token,
+			})
 			this.$emit('click', event)
 		},
 	},

src/components/NewMessageForm/NewMessageForm.vue

@@ -40,6 +40,7 @@
 				<div
 					v-if="canUploadFiles || canShareFiles">
 					<Actions
+						ref="uploadMenu"
 						default-icon="icon-clip-add-file"
 						:aria-label="t('spreed', 'Share files to the conversation')"
 						:aria-haspopup="true">
@@ -59,11 +60,11 @@
 						</ActionButton>
 					</Actions>
 				</div>
-				<div
-					v-if="!isReadOnly">
+				<div>
 					<EmojiPicker @select="addEmoji">
 						<button
 							type="button"
+							disabled="disabled"
 							class="nc-button nc-button__main"
 							:aria-label="t('spreed', 'Add emoji')"
 							:aria-haspopup="true">
@@ -86,15 +87,15 @@
 						ref="advancedInput"
 						v-model="text"
 						:token="token"
-						:active-input="!isReadOnly"
+						:active-input="!disabled"
 						:placeholder-text="placeholderText"
 						:aria-label="placeholderText"
 						@update:contentEditable="contentEditableToParsed"
 						@submit="handleSubmit"
 						@files-pasted="handlePastedFiles" />
 				</div>
 				<button
-					:disabled="isReadOnly"
+					:disabled="disabled"
 					type="submit"
 					:aria-label="t('spreed', 'Send message')"
 					class="nc-button nc-button__main"
@@ -175,12 +176,13 @@ export default {
 			}
 		},
 
-		isReadOnly() {
+		disabled() {
 			return this.conversation.readOnly === CONVERSATION.STATE.READ_ONLY
+			|| !this.currentConversationIsJoined
 		},
 
 		placeholderText() {
-			return this.isReadOnly
+			return this.disabled
 				? t('spreed', 'This conversation has been locked')
 				: t('spreed', 'Write message, @ to mention someone …')
 		},
@@ -194,7 +196,7 @@ export default {
 		},
 
 		canShareFiles() {
-			return !this.currentUserIsGuest && !this.isReadOnly
+			return !this.currentUserIsGuest
 		},
 
 		canUploadFiles() {
@@ -207,6 +209,16 @@ export default {
 		attachmentFolderFreeSpace() {
 			return this.$store.getters.getAttachmentFolderFreeSpace()
 		},
+
+		currentConversationIsJoined() {
+			return this.$store.getters.currentConversationIsJoined
+		},
+	},
+
+	watch: {
+		disabled(newValue) {
+			this.$refs.uploadMenu.$refs.menuButton.disabled = newValue
+		},
 	},
 
 	mounted() {

src/components/TopBar/CallButton.vue

@@ -98,6 +98,7 @@ export default {
 				|| this.isBlockedByLobby
 				|| this.conversation.readOnly
 				|| this.isNextcloudTalkHashDirty
+				|| !this.currentConversationIsJoined
 		},
 
 		leaveCallLabel() {
@@ -164,6 +165,10 @@ export default {
 			return this.conversation.readOnly === CONVERSATION.STATE.READ_WRITE
 				&& this.isInCall
 		},
+
+		currentConversationIsJoined() {
+			return this.$store.getters.currentConversationIsJoined
+		},
 	},
 
 	methods: {

src/init.js

@@ -24,6 +24,7 @@
 // entry points
 
 import store from './store'
+import { EventBus } from './services/EventBus'
 
 if (!window.OCA.Talk) {
 	window.OCA.Talk = {}
@@ -46,3 +47,8 @@ window.OCA.Talk.registerMessageAction = ({ label, callback, icon }) => {
 	}
 	store.dispatch('addMessageAction', messageAction)
 }
+
+EventBus.$on('Signaling::joinRoom', (payload) => {
+	const token = payload[0]
+	store.dispatch('handleRoomJoined', token)
+})

src/store/tokenStore.js

@@ -23,6 +23,14 @@
 const state = {
 	token: '',
 	fileIdForToken: null,
+	/**
+	 * The joining of a room with the signaling server always lags
+	 * behind the "joining" of it in talk's UI. For this reason we
+	 * might have a  window of time in which we might be in
+	 * conversation B in talk's UI while still leaving conversation
+	 * A in the signaling server.
+	 **/
+	lastJoinedConversationToken: '',
 }
 
 const getters = {
@@ -32,6 +40,9 @@ const getters = {
 	getFileIdForToken: (state) => () => {
 		return state.fileIdForToken
 	},
+	currentConversationIsJoined() {
+		return state.lastJoinedConversationToken === state.token
+	},
 }
 
 const mutations = {
@@ -56,6 +67,10 @@ const mutations = {
 		state.token = newToken
 		state.fileIdForToken = newFileId
 	},
+
+	updateLastJoinedConversationToken(state, { token }) {
+		state.lastJoinedConversationToken = token
+	},
 }
 
 const actions = {
@@ -80,6 +95,11 @@ const actions = {
 	updateTokenAndFileIdForToken(context, { newToken, newFileId }) {
 		context.commit('updateTokenAndFileIdForToken', { newToken, newFileId })
 	},
+
+	handleRoomJoined({ commit }, token) {
+		console.debug('i run', token)
+		commit('updateLastJoinedConversationToken', { token })
+	},
 }
 
 export default { state, mutations, getters, actions }

src/utils/signaling.js

@@ -3,11 +3,13 @@
  * @copyright Copyright (c) 2019 Ivan Sein <ivan@nextcloud.com>
  * @copyright Copyright (c) 2019 Joachim Bauch <bauch@struktur.de>
  * @copyright Copyright (c) 2019 Joas Schilling <coding@schilljs.com>
+ * @copyright Copyright (c) 2020 Marco Ambrosini <marcoambrosini@pm.me>
  *
  * @author Daniel Calviño Sánchez <danxuliu@gmail.com>
  * @author Ivan Sein <ivan@nextcloud.com>
  * @author Joachim Bauch <bauch@struktur.de>
  * @author Joas Schilling <coding@schilljs.com>
+ * @author Marco Ambrosini <marcoambrosini@pm.me>
  *
  * @license GNU AGPL version 3 or any later version
  *