Switch member dialog to using ItemDelegate

1 files changed, 63 insertions, 46 deletions

diff --git a/resources/qml/dialogs/RoomMembers.qml b/resources/qml/dialogs/RoomMembers.qml
index 6c8d1383..dd0c1db6 100644
--- a/resources/qml/dialogs/RoomMembers.qml
+++ b/resources/qml/dialogs/RoomMembers.qml
@@ -85,67 +85,84 @@ ApplicationWindow {
                     enabled: !Settings.mobileMode
                 }
 
-                delegate: RowLayout {
+                delegate: ItemDelegate {
                     id: del
 
+                    onClicked: Rooms.currentRoom.openUserProfile(model.mxid)
+                    padding: Nheko.paddingMedium
                     width: ListView.view.width
-                    spacing: Nheko.paddingMedium
+                    height: memberLayout.implicitHeight
+                    background: Rectangle {
+                        color: roomMembersRoot.color
+                    }
 
-                    Avatar {
-                        id: avatar
+                    RowLayout {
+                        id: memberLayout
 
-                        width: Nheko.avatarSize
-                        height: Nheko.avatarSize
-                        userid: model.mxid
-                        url: model.avatarUrl.replace("mxc://", "image://MxcImage/")
-                        displayName: model.displayName
-                        onClicked: Rooms.currentRoom.openUserProfile(model.mxid)
-                    }
+                        spacing: Nheko.paddingMedium
 
-                    ColumnLayout {
-                        spacing: Nheko.paddingSmall
+                        Avatar {
+                            id: avatar
 
-                        ElidedLabel {
-                            fullText: model.displayName
-                            color: TimelineManager.userColor(model ? model.mxid : "", Nheko.colors.window)
-                            font.pixelSize: fontMetrics.font.pixelSize
-                            elideWidth: del.width - Nheko.paddingMedium * 2 - avatar.width - encryptInd.width
+                            width: Nheko.avatarSize
+                            height: Nheko.avatarSize
+                            userid: model.mxid
+                            url: model.avatarUrl.replace("mxc://", "image://MxcImage/")
+                            displayName: model.displayName
+                            enabled: false
                         }
 
-                        ElidedLabel {
-                            fullText: model.mxid
-                            color: Nheko.colors.buttonText
-                            font.pixelSize: Math.ceil(fontMetrics.font.pixelSize * 0.9)
-                            elideWidth: del.width - Nheko.paddingMedium * 2 - avatar.width - encryptInd.width
+                        ColumnLayout {
+                            spacing: Nheko.paddingSmall
+
+                            ElidedLabel {
+                                fullText: model.displayName
+                                color: TimelineManager.userColor(model ? model.mxid : "", Nheko.colors.window)
+                                font.pixelSize: fontMetrics.font.pixelSize
+                                elideWidth: del.width - Nheko.paddingMedium * 2 - avatar.width - encryptInd.width
+                            }
+
+                            ElidedLabel {
+                                fullText: model.mxid
+                                color: Nheko.colors.buttonText
+                                font.pixelSize: Math.ceil(fontMetrics.font.pixelSize * 0.9)
+                                elideWidth: del.width - Nheko.paddingMedium * 2 - avatar.width - encryptInd.width
+                            }
+
+                            Item {
+                                Layout.fillHeight: true
+                                Layout.fillWidth: true
+                            }
+
                         }
 
-                        Item {
-                            Layout.fillHeight: true
-                            Layout.fillWidth: true
+                        EncryptionIndicator {
+                            id: encryptInd
+
+                            Layout.alignment: Qt.AlignRight
+                            visible: room.isEncrypted
+                            encrypted: room.isEncrypted
+                            trust: encrypted ? model.trustlevel : Crypto.Unverified
+                            ToolTip.text: {
+                                if (!encrypted)
+                                    return qsTr("This room is not encrypted!");
+
+                                switch (trust) {
+                                case Crypto.Verified:
+                                    return qsTr("This user is verified.");
+                                case Crypto.TOFU:
+                                    return qsTr("This user isn't verified, but is still using the same master key from the first time you met.");
+                                default:
+                                    return qsTr("This user has unverified devices!");
+                                }
+                            }
                         }
 
                     }
 
-                    EncryptionIndicator {
-                        id: encryptInd
-
-                        Layout.alignment: Qt.AlignRight
-                        visible: room.isEncrypted
-                        encrypted: room.isEncrypted
-                        trust: encrypted ? model.trustlevel : Crypto.Unverified
-                        ToolTip.text: {
-                            if (!encrypted)
-                                return qsTr("This room is not encrypted!");
-
-                            switch (trust) {
-                            case Crypto.Verified:
-                                return qsTr("This user is verified.");
-                            case Crypto.TOFU:
-                                return qsTr("This user isn't verified, but is still using the same master key from the first time you met.");
-                            default:
-                                return qsTr("This user has unverified devices!");
-                            }
-                        }
+                    CursorShape {
+                        anchors.fill: parent
+                        cursorShape: Qt.PointingHandCursor
                     }
 
                 }