fix(@desktop/profile): show ENS username in profile page if available

Closes #3424

src/app/profile/views/ens_manager.nim

@@ -93,6 +93,17 @@ QtObject:
     result.pendingUsernames = initHashSet[string]()
     result.setup
 
+  proc getFirstEnsUsername(self: EnsManager): string {.slot.} =
+    if self.usernames.len > 0:
+      return self.usernames[0]
+    return ""
+
+  proc firstEnsUsernameChanged(self: EnsManager) {.signal.}
+
+  QtProperty[string] firstEnsUsername:
+    read = getFirstEnsUsername
+    notify = firstEnsUsernameChanged
+  
   proc init*(self: EnsManager) =
     self.usernames = getSetting[seq[string]](self.status.settings, Setting.Usernames, @[])
     
@@ -106,6 +117,8 @@ QtObject:
         self.usernames.add trx["additionalData"].getStr
         self.pendingUsernames.incl trx["additionalData"].getStr
 
+    self.firstEnsUsernameChanged()
+
 
   proc ensWasResolved*(self: EnsManager, ensResult: string) {.signal.}
 

ui/app/AppLayouts/Profile/Sections/MyProfileContainer.qml

@@ -5,8 +5,12 @@ import "../../../../imports"
 import "../../../../shared"
 import "../../../../shared/status"
 
+import StatusQ.Core.Theme 0.1
+import StatusQ.Components 0.1
+
 Item {
-    property string ensName: profileModel.ens.preferredUsername || ""
+    property string ensName: profileModel.ens.preferredUsername ||
+        profileModel.ens.firstEnsUsername || ""
     property string username: profileModel.profile.username
     property string pubkey: profileModel.profile.pubKey
 
@@ -132,22 +136,47 @@ Item {
     Column {
         anchors.right: profileImgNameContainer.right
         anchors.left: profileImgNameContainer.left
-        spacing: Style.current.bigPadding
         anchors.top: profileImgNameContainer.bottom
-        anchors.topMargin: Style.current.smallPadding
+        anchors.topMargin: 16
 
-        TextWithLabel {
+        StatusDescriptionListItem {
-            //% "Chat key"
+            title: qsTr("ENS username")
-            label: qsTrId("chat-key")
+            subTitle: ensName
-            text: pubkey.substring(0, 13) + "..." + pubkey.substring(pubkey.length - 13)
+            tooltip.text: qsTr("Copy to clipboard")
-            textToCopy: pubkey
+            icon.name: "copy"
+            visible: !!ensName
+            iconButton.onClicked: {
+                chatsModel.copyToClipboard(ensName)
+                tooltip.visible = !tooltip.visible
+            }
+            width: parent.width
         }
 
-        TextWithLabel {
+        StatusDescriptionListItem {
-            //% "Share Profile URL"
+            title: qsTr("Chat key")
-            label: qsTrId("share-profile-url")
+            subTitle: pubkey
-            text: `${Constants.userLinkPrefix}${ensName !== "" ? ensName : (pubkey.substring(0, 5) + "..." + pubkey.substring(pubkey.length - 5))}`
+            subTitleComponent.elide: Text.ElideMiddle
-            textToCopy: Constants.userLinkPrefix + (ensName !== "" ? ensName : pubkey)
+            subTitleComponent.width: 320
+            subTitleComponent.font.family: Theme.palette.monoFont.name
+            tooltip.text: qsTr("Copy to clipboard")
+            icon.name: "copy"
+            iconButton.onClicked: {
+                chatsModel.copyToClipboard(pubkey)
+                tooltip.visible = !tooltip.visible
+            }
+            width: parent.width
+        }
+
+        StatusDescriptionListItem {
+            title: qsTr("Share Profile URL")
+            subTitle: `${Constants.userLinkPrefix}${ensName !== "" ? ensName : (pubkey.substring(0, 5) + "..." + pubkey.substring(pubkey.length - 5))}`
+            tooltip.text: qsTr("Copy to clipboard")
+            icon.name: "copy"
+            iconButton.onClicked: {
+                chatsModel.copyToClipboard(Constants.userLinkPrefix + (ensName !== "" ? ensName : pubkey))
+                tooltip.visible = !tooltip.visible
+            }
+            width: parent.width
         }
     }
 }