Add ability to add reactions to messages

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

3 files changed, 31 insertions, 2 deletions

diff --git a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
index b733739c3..b3cbd66bd 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
@@ -100,13 +100,13 @@
 				</template>
 			</Button>
 			<Button type="tertiary"
-				@click="page = 0">
+				@click="addReactionToMessage('👍')">
 				<template #icon>
 					<span>👍</span>
 				</template>
 			</Button>
 			<Button type="tertiary"
-				@click="page = 0">
+				@click="addReactionToMessage('❤️')">
 				<template #icon>
 					<span>❤️</span>
 				</template>
@@ -422,6 +422,15 @@ export default {
 			// reload conversation to update additional attributes that have computed values
 			await this.$store.dispatch('fetchConversation', { token: this.token })
 		},
+
+		addReactionToMessage(selectedEmoji) {
+			this.$store.dispatch('addReactionToMessage', {
+				token: this.token,
+				messageId: this.messageObject.id,
+				selectedEmoji,
+			})
+		},
+
 	},
 }
 </script>
diff --git a/src/services/messagesService.js b/src/services/messagesService.js
index 938a35130..0b591c088 100644
--- a/src/services/messagesService.js
+++ b/src/services/messagesService.js
@@ -132,6 +132,12 @@ const updateLastReadMessage = async function(token, lastReadMessage) {
 	})
 }
 
+const addReactionToMessage = async function(token, messageId, selectedEmoji) {
+	return axios.post(generateOcsUrl('apps/spreed/api/v1/reaction/{token}/{messageId}', { token, messageId }), {
+		reaction: selectedEmoji,
+	})
+}
+
 export {
 	fetchMessages,
 	lookForNewMessages,
@@ -139,4 +145,5 @@ export {
 	deleteMessage,
 	postRichObjectToConversation,
 	updateLastReadMessage,
+	addReactionToMessage,
 }
diff --git a/src/store/messagesStore.js b/src/store/messagesStore.js
index 3c08544e3..3592bc42e 100644
--- a/src/store/messagesStore.js
+++ b/src/store/messagesStore.js
@@ -27,6 +27,7 @@ import {
 	lookForNewMessages,
 	postNewMessage,
 	postRichObjectToConversation,
+	addReactionToMessage,
 } from '../services/messagesService'
 
 import SHA256 from 'crypto-js/sha256'
@@ -931,6 +932,18 @@ const actions = {
 		const response = await postRichObjectToConversation(token, richObject)
 		return response
 	},
+
+	async addReactionToMessage(context, { token, messageId, selectedEmoji }) {
+		try {
+			const response = await addReactionToMessage(token, messageId, selectedEmoji)
+
+			context.commit('addReactionToMessage', { token, messageId, selectedEmoji })
+
+			return response
+		} catch (error) {
+			console.debug(error)
+		}
+	},
 }
 
 export default { state, mutations, getters, actions }