Fix anchors in layout error and eventId is not defined

imports/Spectral/Component/Timeline/MessageDelegate.qml

@@ -5,7 +5,7 @@
  * SPDX-LicenseIdentifier: GPL-3.0-or-later
  */
 import QtQuick 2.12
-import QtQuick.Controls 2.12 as Controls
+import QtQuick.Controls 2.12 as QQC2
 import QtQuick.Layouts 1.12
 import QtGraphicalEffects 1.12
 
@@ -25,6 +25,8 @@ RowLayout {
     readonly property color authorColor: eventType == "notice" ? MPalette.primary : author.color
     readonly property color replyAuthorColor: replyVisible ? reply.author.color : MPalette.accent
 
+    property alias mouseArea: controlContainer.children
+
     signal saveFileAs()
     signal openExternally()
 
@@ -55,63 +57,67 @@ RowLayout {
         visible: !showAuthor
     }
 
-    ColumnLayout {
+
-        id: column
+    QQC2.Control {
+        id: controlContainer
         Layout.fillWidth: true
-        spacing: Kirigami.Units.smallSpacing
+        contentItem: ColumnLayout {
+            id: column
+            spacing: Kirigami.Units.smallSpacing
 
-        Controls.Label {
+            QQC2.Label {
-            Layout.fillWidth: true
-
-            visible: showAuthor
-
-            text: author.displayName
-            font.bold: true
-            color: author.color
-            wrapMode: Text.Wrap
-        }
-
-        RowLayout {
-            Layout.fillWidth: true
-
-            visible: replyVisible
-
-            Rectangle {
-                Layout.preferredWidth: Kirigami.Units.smallSpacing
-                Layout.fillHeight: true
-
-                color: Kirigami.Theme.highlightColor
-            }
-
-            Kirigami.Avatar {
-                Layout.preferredWidth: Kirigami.Units.iconSizes.smallMedium
-                Layout.preferredHeight: Kirigami.Units.iconSizes.smallMedium
-                Layout.alignment: Qt.AlignTop
-
-                source: replyVisible && reply.author.avatarMediaId ? "image://mxc/" + reply.author.avatarMediaId : ""
-                name: replyVisible ? reply.author.displayName : "H"
-                color: replyVisible ? reply.author.color : Kirigami.Theme.highlightColor
-            }
-
-            ColumnLayout {
                 Layout.fillWidth: true
 
-                Controls.Label {
+                visible: showAuthor
-                    Layout.fillWidth: true
 
-                    text: replyVisible ? reply.author.displayName : ""
+                text: author.displayName
-                    color: reply.author.color
+                font.bold: true
-                    wrapMode: Text.Wrap
+                color: author.color
+                wrapMode: Text.Wrap
+            }
+
+            RowLayout {
+                Layout.fillWidth: true
+
+                visible: replyVisible
+
+                Rectangle {
+                    Layout.preferredWidth: Kirigami.Units.smallSpacing
+                    Layout.fillHeight: true
+
+                    color: Kirigami.Theme.highlightColor
                 }
 
-                Text {
+                Kirigami.Avatar {
+                    Layout.preferredWidth: Kirigami.Units.iconSizes.smallMedium
+                    Layout.preferredHeight: Kirigami.Units.iconSizes.smallMedium
+                    Layout.alignment: Qt.AlignTop
+
+                    source: replyVisible && reply.author.avatarMediaId ? "image://mxc/" + reply.author.avatarMediaId : ""
+                    name: replyVisible ? reply.author.displayName : "H"
+                    color: replyVisible ? reply.author.color : Kirigami.Theme.highlightColor
+                }
+
+                ColumnLayout {
                     Layout.fillWidth: true
 
-                    text: replyVisible ? reply.display : ""
+                    QQC2.Label {
+                        Layout.fillWidth: true
 
-                    color: Kirigami.Theme.textColor
+                        text: replyVisible ? reply.author.displayName : ""
-                    wrapMode: Text.WrapAtWordBoundaryOrAnywhere
+                        color: replyVisible ? reply.author.color: null
-                    textFormat: Text.RichText
+                        wrapMode: Text.Wrap
+                    }
+
+                    Text {
+                        Layout.fillWidth: true
+
+                        text: replyVisible ? reply.display : ""
+
+                        color: Kirigami.Theme.textColor
+                        wrapMode: Text.WrapAtWordBoundaryOrAnywhere
+                        textFormat: Text.RichText
+                    }
                 }
             }
         }

imports/Spectral/Menu/Timeline/MessageDelegateContextMenu.qml

@@ -16,6 +16,7 @@ Kirigami.OverlaySheet {
 
     required property var author;
     required property string message;
+    required property string eventId;
 
     signal viewSource()
     signal reply(var author, string message)
@@ -72,9 +73,13 @@ Kirigami.OverlaySheet {
                         font.pixelSize: 16
                         font.family: "emoji"
                         text: modelData
+
                     }
 
-                    onClicked: currentRoom.toggleReaction(eventId, modelData)
+                    onClicked: {
+                        currentRoom.toggleReaction(eventId, modelData)
+                        root.close();
+                    }
                 }
             }
         }

qml/RoomPage.qml

@@ -184,16 +184,14 @@ Kirigami.ScrollablePage {
                 roleValue: "message"
                 delegate: TimelineContainer {
                     width: messageListView.width
-                    MouseArea {
-                        acceptedButtons: Qt.RightButton
-                        anchors.fill: parent
-                        onClicked: openMessageContext(author, display, eventId, toolTip);
-                    }
                     innerObject: MessageDelegate {
                         Layout.fillWidth: true
                         Layout.maximumWidth: messageListView.width
-
+                        mouseArea: MouseArea {
-
+                            acceptedButtons: Qt.RightButton
+                            anchors.fill: parent
+                            onClicked: openMessageContext(author, display, eventId, toolTip);
+                        }
                         innerObject: TextDelegate {
                             Layout.fillWidth: true
                         }
@@ -304,7 +302,8 @@ Kirigami.ScrollablePage {
     function openMessageContext(author, message, eventId, toolTip, model) {
         const contextMenu = messageDelegateContextMenu.createObject(root, {
             'author': author,
-            'message': message
+            'message': message,
+            'eventId': eventId,
         });
         contextMenu.viewSource.connect(function() {
             messageSourceDialog.createObject(root, {