From 899cb7b2f5c4686a88d21cec16bfaa9b604de157 Mon Sep 17 00:00:00 2001
From: Anthony Laibe <anthony@laibe.cc>
Date: Fri, 20 Aug 2021 11:42:15 +0200
Subject: [PATCH] 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    |  4 ++++
 .../MessageComponents/StatusUpdate.qml           | 16 +++++++++++++---
 ui/app/AppLayouts/Timeline/TimelineLayout.qml    | 12 +++---------
 3 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/ui/app/AppLayouts/Chat/ChatColumn/Message.qml b/ui/app/AppLayouts/Chat/ChatColumn/Message.qml
index 9a40103fc0..622c537f3c 100644
--- a/ui/app/AppLayouts/Chat/ChatColumn/Message.qml
+++ b/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);
+            }
         }
     }
 
diff --git a/ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/StatusUpdate.qml b/ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/StatusUpdate.qml
index 504194931b..69e7e54364 100644
--- a/ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/StatusUpdate.qml
+++ b/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 {
diff --git a/ui/app/AppLayouts/Timeline/TimelineLayout.qml b/ui/app/AppLayouts/Timeline/TimelineLayout.qml
index be27b5f039..8460f55f28 100644
--- a/ui/app/AppLayouts/Timeline/TimelineLayout.qml
+++ b/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 { }
+                }
             }
         }