feat: enable adding reactions to chat messages from the menu

src/app/chat/view.nim

@@ -253,6 +253,9 @@ QtObject:
         else:
           self.newMessagePushed()
 
+  proc addEmojiReaction*(self: ChatsView, messageId: string, emojiId: int) {.slot.} =
+    self.status.chat.addEmojiReaction(self.activeChannel.id, messageId, emojiId)
+
   proc pushReactions*(self:ChatsView, reactions: var seq[Reaction]) =
     let t = reactions.len
     for reaction in reactions.mitems:

src/status/chat.nim

@@ -277,6 +277,9 @@ proc chatReactions*(self: ChatModel, chatId: string, initialLoad:bool = true) =
   except Exception as e:
     error "Error reactions", msg = e.msg
   
+proc addEmojiReaction*(self: ChatModel, chatId: string, messageId: string, emojiId: int) =
+  let reactions = status_chat.addEmojiReaction(chatId, messageId, emojiId)
+  self.events.emit("reactionsLoaded", ReactionsLoadedArgs(reactions: reactions))
 
 proc markAllChannelMessagesRead*(self: ChatModel, chatId: string): JsonNode =
   var response = status_chat.markAllRead(chatId)

src/status/libstatus/chat.nim

@@ -83,6 +83,15 @@ proc getEmojiReactionsByChatId*(chatId: string, cursor: string = ""): (string, s
 
   return (rpcResult{"cursor"}.getStr, reactions)
 
+proc addEmojiReaction*(chatId: string, messageId: string, emojiId: int): seq[Reaction] =
+  let rpcResult = parseJson(callPrivateRPC("sendEmojiReaction".prefix, %* [chatId, messageId, emojiId]))["result"]
+  
+  var reactions: seq[Reaction] = @[]
+  if rpcResult != nil and rpcResult["emojiReactions"] != nil and rpcResult["emojiReactions"].len != 0:
+    for jsonMsg in rpcResult["emojiReactions"]:
+      reactions.add(jsonMsg.toReaction)
+  
+  result = reactions
 # TODO this probably belongs in another file
 proc generateSymKeyFromPassword*(): string =
   result = ($parseJson(callPrivateRPC("waku_generateSymKeyFromPassword", %* [

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/EmojiReactions.qml

@@ -28,7 +28,7 @@ Item {
                         }
                     }
                     byEmoji[reaction.emojiId].count++;
-                    if (!byEmoji[reaction.emojiId].currentUserReacted && reaction.fromAuthor === profileModel.profile.pubKey) {
+                    if (!byEmoji[reaction.emojiId].currentUserReacted && reaction.from === profileModel.profile.pubKey) {
                         byEmoji[reaction.emojiId].currentUserReacted = true
                     }
 

ui/app/AppLayouts/Chat/components/EmojiReaction.qml

@@ -3,7 +3,9 @@ import "../../../../imports"
 import "../../../../shared"
 
 SVGImage {
+    property var closeModal: function () {}
     property int emojiId
+    id: reactionImage
     width: 32
     fillMode: Image.PreserveAspectFit
 
@@ -11,8 +13,8 @@ SVGImage {
         anchors.fill: parent
         cursorShape: Qt.PointingHandCursor
         onClicked: {
-            console.log('Clicked on Emoji', emojiId)
-            console.log('This feature will be implmented at a later date')
+            chatsModel.addEmojiReaction(SelectedMessage.messageId, emojiId)
+            reactionImage.closeModal()
 
         }
     }

ui/app/AppLayouts/Chat/components/MessageContextMenu.qml

@@ -30,6 +30,9 @@ PopupMenu {
                 delegate: EmojiReaction {
                     source: "../../../img/" + filename
                     emojiId: model.emojiId
+                    closeModal: function () {
+                        messageContextMenu.close()
+                    }
                 }
             }
         }