Fix binding loop in roomlist

2 files changed, 43 insertions, 35 deletions

diff --git a/resources/qml/RoomList.qml b/resources/qml/RoomList.qml

index ac4f8c3a..615c67fa 100644
--- a/resources/qml/RoomList.qml
+++ b/resources/qml/RoomList.qml
@@ -546,66 +546,73 @@ Page {
                     visible: !collapsed
                     width: roomItem.width - avatar.width
 
-                    NotificationBubble {
-                        id: notificationBubble
-
-                        Layout.alignment: Qt.AlignRight
-                        Layout.leftMargin: Nheko.paddingSmall
-                        Layout.preferredHeight: implicitHeight
-                        Layout.preferredWidth: implicitWidth
-                        bubbleBackgroundColor: roomItem.bubbleBackground
-                        bubbleTextColor: roomItem.bubbleText
-                        hasLoudNotification: roomItem.hasLoudNotification
-                        mayBeVisible: !collapsed && (isSpace ? Settings.spaceNotifications : true)
-                        notificationCount: roomItem.notificationCount
-                        parent: isSpace ? titleRow : subtextRow
-                    }
-                    RowLayout {
+                    Item {
                         id: titleRow
 
                         Layout.alignment: Qt.AlignTop
-                        Layout.preferredWidth: roomItem.width - avatar.width
-                        spacing: Nheko.paddingSmall
-
-                        Item {
-                            Layout.alignment: Qt.AlignBottom
-                            Layout.fillWidth: true
-
-                            ElidedLabel {
-                                anchors.bottom: parent.bottom
-                                color: roomItem.importantText
-                                elideWidth: parent.width
-                                fullText: TimelineManager.htmlEscape(roomName)
-                                textFormat: Text.RichText
-                            }
+                        Layout.fillWidth: true
+                        Layout.preferredHeight: subtitleText.implicitHeight
+
+                        ElidedLabel {
+                            id: titleText
+
+                            anchors.left: parent.left
+                            color: roomItem.importantText
+                            elideWidth: parent.width - (timestamp.visible ? timestamp.implicitWidth : 0) - (spaceNotificationBubble.visible ? spaceNotificationBubble.implicitWidth : 0)
+                            fullText: TimelineManager.htmlEscape(roomName)
+                            textFormat: Text.RichText
                         }
                         Label {
                             id: timestamp
 
-                            Layout.alignment: Qt.AlignRight | Qt.AlignBottom
+                            anchors.baseline: titleText.baseline
+                            anchors.right: parent.right
                             color: roomItem.unimportantText
                             font.pixelSize: fontMetrics.font.pixelSize * 0.9
                             text: time
                             visible: !isInvite && !isSpace
                         }
+                        NotificationBubble {
+                            id: spaceNotificationBubble
+
+                            anchors.right: parent.right
+                            bubbleBackgroundColor: roomItem.bubbleBackground
+                            bubbleTextColor: roomItem.bubbleText
+                            hasLoudNotification: roomItem.hasLoudNotification
+                            mayBeVisible: !collapsed && (isSpace ? Settings.spaceNotifications : false)
+                            notificationCount: roomItem.notificationCount
+                            parent: isSpace ? titleRow : subtextRow
+                        }
                     }
-                    RowLayout {
+                    Item {
                         id: subtextRow
 
                         Layout.alignment: Qt.AlignBottom
                         Layout.fillWidth: true
-                        height: visible ? 0 : undefined
-                        spacing: 0
+                        Layout.preferredHeight: subtitleText.implicitHeight
                         visible: !isSpace
 
                         ElidedLabel {
-                            Layout.fillWidth: true
+                            id: subtitleText
+
+                            anchors.left: parent.left
                             color: roomItem.unimportantText
-                            elideWidth: width
+                            elideWidth: subtextRow.width - (subtextNotificationBubble.visible ? subtextNotificationBubble.implicitWidth : 0)
                             font.pixelSize: fontMetrics.font.pixelSize * 0.9
                             fullText: TimelineManager.htmlEscape(lastMessage)
                             textFormat: Text.RichText
                         }
+                        NotificationBubble {
+                            id: subtextNotificationBubble
+
+                            anchors.baseline: subtitleText.baseline
+                            anchors.right: parent.right
+                            bubbleBackgroundColor: roomItem.bubbleBackground
+                            bubbleTextColor: roomItem.bubbleText
+                            hasLoudNotification: roomItem.hasLoudNotification
+                            mayBeVisible: !collapsed
+                            notificationCount: roomItem.notificationCount
+                        }
                     }
                 }
             }
diff --git a/resources/qml/components/NotificationBubble.qml b/resources/qml/components/NotificationBubble.qml

index f0a526d0..d4838e92 100644
--- a/resources/qml/components/NotificationBubble.qml
+++ b/resources/qml/components/NotificationBubble.qml
@@ -15,6 +15,7 @@ Rectangle {
     required property color bubbleTextColor
     property bool mayBeVisible: true
     property alias font: notificationBubbleText.font
+    baselineOffset: notificationBubbleText.baseline - bubbleRoot.top
 
     visible: mayBeVisible && notificationCount > 0
     implicitHeight: notificationBubbleText.height + Nheko.paddingMedium