Fix(ActivityCenter): Fix reply badge text eliding

Close #8526

ui/app/mainui/activitycenter/controls/ReplyBadge.qml

@@ -1,13 +1,13 @@
 import QtQuick 2.4
+import QtQuick.Layouts 1.4
 
 import StatusQ.Core 0.1
+import StatusQ.Core.Utils 0.1 as StatusQUtils
 
 import utils 1.0
 import shared.controls 1.0
 import shared.panels 1.0
 
-import StatusQ.Core.Utils 0.1 as StatusQUtils
-
 Badge {
     id: root
 
@@ -15,32 +15,43 @@ Badge {
 
     signal replyClicked()
 
-    SVGImage {
+    implicitWidth: layout.implicitWidth + layout.anchors.leftMargin + layout.anchors.rightMargin
-        id: replyIcon
+    implicitHeight: layout.implicitHeight + layout.anchors.topMargin + layout.anchors.bottomMargin
-        anchors.left: parent.left
-        anchors.leftMargin: Style.current.smallPadding
-        anchors.verticalCenter: parent.verticalCenter
-        width: 16
-        height: width
-        source: Style.svg("reply-small-arrow")
-    }
 
-    StatusBaseText {
+    RowLayout {
-        anchors.left: replyIcon.right
+        id: layout
-        anchors.leftMargin: 4
-        anchors.verticalCenter: parent.verticalCenter
-        width: Math.min(implicitWidth, 300)
-        text: repliedMessageContent
-        maximumLineCount: 1
-        elide: Text.ElideRight
-        font.pixelSize: 13
 
-        MouseArea {
+        anchors {
-            id: replyArea
+            fill: parent
-            hoverEnabled: true
+            leftMargin: 8
-            anchors.fill: parent
+            rightMargin: 8
-            cursorShape: Qt.PointingHandCursor
+            topMargin: 3
-            onClicked: root.replyClicked()
+            bottomMargin: 3
+        }
+
+        spacing: 4
+
+        StatusIcon {
+            source: Style.svg("reply-small-arrow")
+            Layout.preferredWidth: 16
+            Layout.preferredHeight: 16
+        }
+
+        StatusBaseText {
+            text: repliedMessageContent
+            maximumLineCount: 1
+            wrapMode: Text.Wrap
+            elide: Text.ElideRight
+            font.pixelSize: 13
+            Layout.maximumWidth: 300
+            Layout.alignment: Qt.AlignVCenter
         }
     }
+
+    MouseArea {
+        hoverEnabled: true
+        anchors.fill: layout
+        cursorShape: Qt.PointingHandCursor
+        onClicked: root.replyClicked()
+    }
 }