fix(messages): use direct token in components and other stores

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

src/components/MessagesList/MessagesGroup/Message/Message.spec.js

@@ -641,10 +641,8 @@ describe('Message.vue', () => {
 			wrapper.findComponent(MessageButtonsBar).vm.$emit('delete')
 
 			expect(deleteMessage).toHaveBeenCalledWith(expect.anything(), {
-				message: {
-					token: TOKEN,
-					id: 123,
-				},
+				token: TOKEN,
+				id: 123,
 				placeholder: expect.anything(),
 			})
 

src/components/MessagesList/MessagesGroup/Message/Message.vue

@@ -772,10 +772,8 @@ export default {
 			this.isDeleting = true
 			try {
 				const statusCode = await this.$store.dispatch('deleteMessage', {
-					message: {
-						token: this.token,
-						id: this.id,
-					},
+					token: this.token,
+					id: this.id,
 					placeholder: t('spreed', 'Deleting message'),
 				})
 

src/components/MessagesList/MessagesGroup/Message/MessagePart/Reactions.spec.js

@@ -200,7 +200,7 @@ describe('Reactions.vue', () => {
 		test('dispatches store actions upon picking an emoji from the emojipicker', async () => {
 			// Arrange
 			jest.spyOn(reactionsStore, 'addReactionToMessage')
-			vuexStore.dispatch('processMessage', message)
+			vuexStore.dispatch('processMessage', { token, message })
 
 			const wrapper = shallowMount(Reactions, {
 				propsData: reactionsProps,
@@ -231,7 +231,7 @@ describe('Reactions.vue', () => {
 			jest.spyOn(reactionsStore, 'addReactionToMessage')
 			jest.spyOn(reactionsStore, 'removeReactionFromMessage')
 
-			vuexStore.dispatch('processMessage', message)
+			vuexStore.dispatch('processMessage', { token, message })
 
 			const wrapper = shallowMount(Reactions, {
 				propsData: reactionsProps,

src/components/MessagesList/MessagesGroup/MessagesGroup.vue

@@ -37,6 +37,7 @@
 				:key="message.id"
 				ref="message"
 				v-bind="message"
+				:token="token"
 				:is-temporary="message.timestamp === 0"
 				:next-message-id="(messages[index + 1] && messages[index + 1].id) || nextMessageId"
 				:previous-message-id="(index > 0 && messages[index - 1].id) || previousMessageId"

src/components/MessagesList/MessagesGroup/MessagesSystemGroup.vue

@@ -27,6 +27,7 @@
 			<ul v-if="messagesCollapsed.messages?.length > 1"
 				class="messages messages--header">
 				<Message v-bind="createCombinedSystemMessage(messagesCollapsed)"
+					:token="token"
 					is-combined-system-message
 					:is-combined-system-message-collapsed="messagesCollapsed.collapsed"
 					:next-message-id="getNextMessageId(messagesCollapsed.messages.at(-1))"
@@ -39,6 +40,7 @@
 				<Message v-for="message in messagesCollapsed.messages"
 					:key="message.id"
 					v-bind="message"
+					:token="token"
 					:next-message-id="getNextMessageId(message)"
 					:previous-message-id="getPrevMessageId(message)" />
 			</ul>

src/components/NewMessage/NewMessage.vue

@@ -557,25 +557,25 @@ export default {
 				this.chatExtrasStore.removeParentIdToReply(this.token)
 
 				this.broadcast
-					? await this.broadcastMessage(temporaryMessage, options)
-					: await this.postMessage(temporaryMessage, options)
+					? await this.broadcastMessage(this.token, temporaryMessage.message)
+					: await this.postMessage(this.token, temporaryMessage, options)
 			}
 		},
 
 		// Post message to conversation
-		async postMessage(temporaryMessage, options) {
+		async postMessage(token, temporaryMessage, options) {
 			try {
-				await this.$store.dispatch('postNewMessage', { temporaryMessage, options })
+				await this.$store.dispatch('postNewMessage', { token, temporaryMessage, options })
 				this.$emit('sent')
 			} catch {
 				this.$emit('failure')
 			}
 		},
 
 		// Broadcast message to all breakout rooms
-		async broadcastMessage(temporaryMessage, options) {
+		async broadcastMessage(token, message) {
 			try {
-				await this.$store.dispatch('broadcastMessageToBreakoutRoomsAction', { temporaryMessage, options })
+				await this.$store.dispatch('broadcastMessageToBreakoutRoomsAction', { token, message })
 				this.$emit('sent')
 			} catch {
 				this.$emit('failure')
@@ -599,9 +599,9 @@ export default {
 			return new Promise(resolve => setTimeout(resolve, ms))
 		},
 
-		handleRetryMessage(temporaryMessageId) {
+		handleRetryMessage(id) {
 			if (this.text === '') {
-				const temporaryMessage = this.$store.getters.message(this.token, temporaryMessageId)
+				const temporaryMessage = this.$store.getters.message(this.token, id)
 				if (temporaryMessage) {
 					this.text = temporaryMessage.message || this.text
 
@@ -613,7 +613,7 @@ export default {
 						})
 					}
 
-					this.$store.dispatch('removeTemporaryMessageFromStore', temporaryMessage)
+					this.$store.dispatch('removeTemporaryMessageFromStore', { token: this.token, id })
 				}
 			}
 		},

src/services/breakoutRoomsService.js

@@ -96,12 +96,11 @@ const stopBreakoutRooms = async function(token) {
 }
 
 /**
- *
- * @param {string} message The message to be posted
  * @param {string} token the conversation token
+ * @param {string} message The message to be posted
  * @return {Promise<import('axios').AxiosResponse<any>>} The array of conversations
  */
-const broadcastMessageToBreakoutRooms = async function(message, token) {
+const broadcastMessageToBreakoutRooms = async function(token, message) {
 	return await axios.post(generateOcsUrl('/apps/spreed/api/v1/breakout-rooms/{token}/broadcast', {
 		token,
 	}), {

src/services/messagesService.js

@@ -117,11 +117,10 @@ const postNewMessage = async function({ token, message, actorDisplayName, refere
 /**
  * Deletes a message from the server.
  *
- * @param {object} param0 The message object that is destructured
- * @param {string} param0.token The conversation token
- * @param {string} param0.id The id of the message to be deleted
+ * @param {string} token The conversation token
+ * @param {string} id The id of the message to be deleted
  */
-const deleteMessage = async function({ token, id }) {
+const deleteMessage = async function(token, id) {
 	return axios.delete(generateOcsUrl('apps/spreed/api/v1/chat/{token}/{id}', { token, id }))
 }
 

src/services/messagesService.spec.js

@@ -141,10 +141,7 @@ describe('messagesService', () => {
 	})
 
 	test('deleteMessage calls the chat API endpoint', () => {
-		deleteMessage({
-			token: 'XXTOKENXX',
-			id: 1234,
-		})
+		deleteMessage('XXTOKENXX', 1234)
 
 		expect(axios.delete).toHaveBeenCalledWith(
 			generateOcsUrl('apps/spreed/api/v1/chat/XXTOKENXX/1234'),

src/store/breakoutRoomsStore.js

@@ -188,9 +188,9 @@ const actions = {
 		}
 	},
 
-	async broadcastMessageToBreakoutRoomsAction(context, { temporaryMessage }) {
+	async broadcastMessageToBreakoutRoomsAction(context, { token, message }) {
 		try {
-			await broadcastMessageToBreakoutRooms(temporaryMessage.message, temporaryMessage.token)
+			await broadcastMessageToBreakoutRooms(token, message)
 		} catch (error) {
 			console.error(error)
 			showError(t('spreed', 'An error occurred while sending a message to the breakout rooms'))

src/store/fileUploadStore.js

@@ -321,7 +321,7 @@ const actions = {
 				message: index === lastIndex && caption ? caption : '{file}',
 			}
 			// Add temporary messages (files) to the messages list
-			dispatch('addTemporaryMessage', temporaryMessage)
+			dispatch('addTemporaryMessage', { token: temporaryMessage.token, message: temporaryMessage })
 			// Scroll the message list
 			EventBus.$emit('scroll-chat-to-bottom', { force: true })
 		}
@@ -375,7 +375,8 @@ const actions = {
 
 				// Mark the upload as failed in the store
 				commit('markFileAsFailedUpload', { uploadId, index })
-				dispatch('markTemporaryMessageAsFailed', { message: uploadedFile.temporaryMessage, uploadId, reason })
+				const { token, id } = uploadedFile.temporaryMessage
+				dispatch('markTemporaryMessageAsFailed', { token, id, uploadId, reason })
 			}
 		}
 
@@ -395,18 +396,18 @@ const actions = {
 			}
 			const metadata = JSON.stringify(rawMetadata)
 
+			const { token, id, referenceId } = temporaryMessage
 			try {
-				const token = temporaryMessage.token
 				dispatch('markFileAsSharing', { uploadId, index })
-				await shareFile(path, token, temporaryMessage.referenceId, metadata)
+				await shareFile(path, token, referenceId, metadata)
 				dispatch('markFileAsShared', { uploadId, index })
 			} catch (error) {
 				if (error?.response?.status === 403) {
 					showError(t('spreed', 'You are not allowed to share files'))
 				} else {
 					showError(t('spreed', 'An error happened when trying to share your file'))
 				}
-				dispatch('markTemporaryMessageAsFailed', { message: temporaryMessage, uploadId, reason: 'failed-share' })
+				dispatch('markTemporaryMessageAsFailed', { token, id, uploadId, reason: 'failed-share' })
 				console.error('An error happened when trying to share your file: ', error)
 			}
 		}
@@ -457,14 +458,15 @@ const actions = {
 	 * @param {string} [data.caption] the message caption;
 	 */
 	retryUploadFiles(context, { uploadId, caption }) {
+		const token = context.getters.getToken()
 		context.getters.getFailedUploads(uploadId).forEach(([index, file]) => {
-			context.dispatch('removeTemporaryMessageFromStore', file.temporaryMessage)
+			context.dispatch('removeTemporaryMessageFromStore', { token, id: file.temporaryMessage.id })
 			context.commit('markFileAsInitializedUpload', { uploadId, index })
 		})
 
 		if (caption) {
 			const chatExtrasStore = useChatExtrasStore()
-			chatExtrasStore.setChatInput({ token: context.getters.getToken(), text: caption })
+			chatExtrasStore.setChatInput({ token, text: caption })
 		}
 
 		context.commit('setCurrentUploadId', uploadId)

src/store/fileUploadStore.spec.js

@@ -263,8 +263,12 @@ describe('fileUploadStore', () => {
 
 			expect(mockedActions.addTemporaryMessage).toHaveBeenCalledTimes(1)
 			expect(mockedActions.markTemporaryMessageAsFailed).toHaveBeenCalledTimes(1)
-			expect(mockedActions.markTemporaryMessageAsFailed.mock.calls[0][1].message.referenceId).toBe('reference-id-1')
-			expect(mockedActions.markTemporaryMessageAsFailed.mock.calls[0][1].reason).toBe('failed-upload')
+			expect(mockedActions.markTemporaryMessageAsFailed).toHaveBeenCalledWith(expect.anything(), {
+				token: 'XXTOKENXX',
+				id: 1,
+				uploadId: 'upload-id1',
+				reason: 'failed-upload'
+			})
 			expect(showError).toHaveBeenCalled()
 			expect(console.error).toHaveBeenCalled()
 		})
@@ -300,8 +304,12 @@ describe('fileUploadStore', () => {
 
 			expect(mockedActions.addTemporaryMessage).toHaveBeenCalledTimes(1)
 			expect(mockedActions.markTemporaryMessageAsFailed).toHaveBeenCalledTimes(1)
-			expect(mockedActions.markTemporaryMessageAsFailed.mock.calls[0][1].message.referenceId).toBe('reference-id-1')
-			expect(mockedActions.markTemporaryMessageAsFailed.mock.calls[0][1].reason).toBe('failed-share')
+			expect(mockedActions.markTemporaryMessageAsFailed).toHaveBeenCalledWith(expect.anything(), {
+				token: 'XXTOKENXX',
+				id: 1,
+				uploadId: 'upload-id1',
+				reason: 'failed-share'
+			})
 			expect(showError).toHaveBeenCalled()
 			expect(console.error).toHaveBeenCalled()
 		})