UserDetailDialog: Improve consistency

Use same spacing and sizing as GroupChatDrawerHeader and add a QR code
to share the contact.

Signed-off-by: Carl Schwan <carlschwan@kde.org>

src/app/qml/UserDetailDialog.qml

@@ -39,6 +39,7 @@ Kirigami.Dialog {
     readonly property bool hasMutualRooms: root.model.count > 0
     readonly property bool isRoomProfile: root.room
     readonly property string shareUrl: "https://matrix.to/#/" + root.user.id
+    readonly property string displayName: root.room ? root.room.member(root.user.id).displayName : root.user.displayName
 
     leftPadding: Kirigami.Units.largeSpacing * 2
     rightPadding: Kirigami.Units.largeSpacing * 2
@@ -64,10 +65,11 @@ Kirigami.Dialog {
 
             KirigamiComponents.Avatar {
                 id: avatar
-                Layout.preferredWidth: Kirigami.Units.iconSizes.huge
-                Layout.preferredHeight: Kirigami.Units.iconSizes.huge
 
-                name: root.room ? root.room.member(root.user.id).displayName : root.user.displayName
+                Layout.preferredWidth: Kirigami.Units.iconSizes.large
+                Layout.preferredHeight: Kirigami.Units.iconSizes.large
+
+                name: root.displayName
                 source: {
                     if (root.room) {
                         return root.room.member(root.user.id).avatarUrl;
@@ -80,27 +82,29 @@ Kirigami.Dialog {
             }
 
             ColumnLayout {
-                Layout.fillWidth: true
-
                 spacing: 0
 
-                Kirigami.Heading {
-                    level: 1
                 Layout.fillWidth: true
-                    font.bold: true
+                Layout.alignment: Qt.AlignVCenter
+
+                Kirigami.Heading {
                     clip: true // Intentional to limit insane Unicode in display names
 
                     elide: Text.ElideRight
                     wrapMode: Text.NoWrap
-                    text: root.room ? root.room.member(root.user.id).displayName : root.user.displayName
+                    text: root.displayName
                     textFormat: Text.PlainText
+
+                    Layout.fillWidth: true
                 }
 
                 Kirigami.SelectableLabel {
-                    id: idLabel
                     textFormat: TextEdit.PlainText
                     text: idLabelTextMetrics.elidedText
                     color: Kirigami.Theme.disabledTextColor
+                    font: Kirigami.Theme.smallFont
+
+                    Layout.fillWidth: true
 
                     TextMetrics {
                         id: idLabelTextMetrics
@@ -109,9 +113,38 @@ Kirigami.Dialog {
                         elideWidth: root.availableWidth - avatar.width - detailRow.spacing * 2 - detailRow.Layout.leftMargin - detailRow.Layout.rightMargin
                     }
                 }
+            }
+
+            QQC2.AbstractButton {
+                contentItem: Barcode {
+                    id: barcode
+                    barcodeType: Barcode.QRCode
+                    content: "https://matrix.to/#/" + root.user.id
+                }
+
+                onClicked: {
+                    root.close();
+                    const map = Qt.createComponent('org.kde.neochat', 'QrCodeMaximizeComponent').createObject(QQC2.Overlay.overlay, {
+                        text: barcode.content,
+                        title: root.displayName,
+                        subtitle: root.user.id,
+                        avatarSource: avatar.source,
+                    });
+                    map.open();
+                }
+
+                Layout.preferredWidth: Kirigami.Units.iconSizes.large
+                Layout.preferredHeight: Kirigami.Units.iconSizes.large
+                Layout.rightMargin: Kirigami.Units.largeSpacing
+
+                QQC2.ToolTip.visible: hovered
+                QQC2.ToolTip.text: barcode.content
+                QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
+            }
+        }
 
         Kirigami.ActionToolBar {
-                    Layout.topMargin: Kirigami.Units.smallSpacing
+            Layout.topMargin: Kirigami.Units.largeSpacing
 
             actions: [
                 Kirigami.Action {
@@ -212,8 +245,6 @@ Kirigami.Dialog {
                 }
             ]
         }
-            }
-        }
 
         Kirigami.Heading {
             text: i18nc("@title Moderation actions for this user", "Moderation")

src/libneochat/qml/GroupChatDrawerHeader.qml

@@ -70,6 +70,7 @@ ColumnLayout {
             Kirigami.Heading {
                 Layout.fillWidth: true
                 text: root.room ? root.room.displayName : i18n("No name")
+                clip: true // Intentional to limit insane Unicode in display names
                 textFormat: Text.PlainText
                 wrapMode: Text.Wrap
             }
@@ -94,7 +95,7 @@ ColumnLayout {
             }
 
             onClicked: {
-                let map = Qt.createComponent('org.kde.neochat', 'QrCodeMaximizeComponent').createObject(QQC2.Overlay.overlay, {
+                const map = Qt.createComponent('org.kde.neochat', 'QrCodeMaximizeComponent').createObject(QQC2.Overlay.overlay, {
                     text: barcode.content,
                     title: root.room ? root.room.displayName : "",
                     subtitle: root.room ? root.room.id : "",