fix(@desktop/timeline): Fix timeline reaction

fixes #3251

- Being able to react in timeline chat
- Once there is a reaction, being able to remove them or add new
- Height of the message taking in consideration if there is reaction or
  not

ui/app/AppLayouts/Chat/ChatColumn/Message.qml

@@ -427,6 +427,10 @@ Item {
             statusAgeEpoch: root.statusAgeEpoch
             clickMessage: root.clickMessage
             container: root
+            messageContextMenu: root.messageContextMenu
+            onAddEmoji: {
+                root.clickMessage(isProfileClick, isSticker, isImage , image, emojiOnly, hideEmojiPicker);
+            }
         }
     }
 

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

@@ -11,14 +11,18 @@ MouseArea {
     property bool hovered: containsMouse
     property var container
     property int statusAgeEpoch: 0
+    property var messageContextMenu
 
     anchors.top: parent.top
     anchors.topMargin: 0
-    height: (isImage ? chatImageContent.height : chatText.height) + chatName.height + 2* Style.current.padding + (emojiReactions !== "" ? 20 : 0)
+    height: (isImage ? chatImageContent.height : chatText.height) + chatName.height + 2* Style.current.padding + (emojiReactionsModel.length ? 20 : 0)
     width: parent.width
     hoverEnabled: true
     cursorShape: Qt.PointingHandCursor
     propagateComposedEvents: true
+
+    signal addEmoji(bool isProfileClick, bool isSticker, bool isImage , var image, bool emojiOnly, bool hideEmojiPicker)
+
     onClicked: {
         mouse.accepted = false
     }
@@ -117,7 +121,7 @@ MouseArea {
 
         Loader {
             id: emojiReactionLoader
-            active: emojiReactions !== ""
+            active: emojiReactionsModel.length
             sourceComponent: emojiReactionsComponent
             anchors.left: chatImage.right
             anchors.leftMargin: Style.current.halfPadding
@@ -127,7 +131,13 @@ MouseArea {
 
         Component {
             id: emojiReactionsComponent
-            EmojiReactions {}
+            EmojiReactions {
+                onAddEmojiClicked: {
+                    root.addEmoji(false, false, false, null, true, false);
+                    messageContextMenu.x = (chatText.textField.leftPadding + 4);
+                    messageContextMenu.y -= (56 + Style.current.padding);
+                }
+            }
         }
 
         Separator {

ui/app/AppLayouts/Timeline/TimelineLayout.qml

@@ -35,11 +35,6 @@ ScrollView {
         popup.openPopup(profileModel.profile.pubKey !== fromAuthorParam, userNameParam, fromAuthorParam, identiconParam, textParam, nicknameParam);
     }
 
-
-    MessageContextMenu {
-        id: messageContextMenu
-    }
-
     StatusImageModal {
         id: imagePopup
         onClicked: {
@@ -47,10 +42,6 @@ ScrollView {
         }
     }
 
-    EmojiReactions {
-        id: reactionModel
-    }
-
     property Component profilePopupComponent: ProfilePopup {
         id: profilePopup
         height: 450
@@ -175,6 +166,9 @@ ScrollView {
                     return -1;
                 }
                 timeout: model.timeout
+                messageContextMenu: MessageContextMenu {
+                    reactionModel: EmojiReactions { }
+                }
             }
         }