fix: display ens names with correct format in all screens

src/app/chat/views/chat_item.nim

@@ -1,11 +1,12 @@
-import NimQml, std/wrapnils
+import NimQml, Tables, std/wrapnils
-import ../../../status/[chat/chat, status]
+import ../../../status/[chat/chat, status, ens, accounts]
 import chat_members
 
 QtObject:
   type ChatItemView* = ref object of QObject
     chatItem*: Chat
     chatMembers*: ChatMembersView
+    status*: Status
 
   proc setup(self: ChatItemView) =
     self.QObject.setup
@@ -18,6 +19,7 @@ QtObject:
     new(result, delete)
     result = ChatItemView()
     result.chatItem = nil
+    result.status = status
     result.chatMembers = newChatMembersView(status)
     result.setup
 
@@ -30,7 +32,16 @@ QtObject:
   QtProperty[string] id:
     read = id
 
-  proc name*(self: ChatItemView): string {.slot.} = result = ?.self.chatItem.name
+  proc userNameOrAlias(self: ChatItemView, pubKey: string): string {.slot.} =
+    if self.status.chat.contacts.hasKey(pubKey):
+      return ens.userNameOrAlias(self.status.chat.contacts[pubKey])
+    generateAlias(pubKey)
+
+  proc name*(self: ChatItemView): string {.slot.} = 
+    if self.chatItem != nil:
+      result = self.userNameOrAlias(self.chatItem.id)
+    else:
+      result = self.chatItem.name
 
   QtProperty[string] name:
     read = name

src/app/chat/views/message_format.nim

@@ -9,7 +9,7 @@ proc sectionIdentifier(message: Message): string =
 
 proc mention(self: ChatMessageList, pubKey: string): string =
   if self.status.chat.contacts.hasKey(pubKey):
-    return ens.userNameOrAlias(self.status.chat.contacts[pubKey])
+    return ens.userNameOrAlias(self.status.chat.contacts[pubKey], true)
   generateAlias(pubKey)
 
 

src/status/ens.nim

@@ -25,9 +25,9 @@ proc addDomain*(username: string): string =
   else:
     return username & domain
 
-proc userNameOrAlias*(contact: Profile): string =
+proc userNameOrAlias*(contact: Profile, removeSuffix: bool = false): string =
   if(contact.ensName != "" and contact.ensVerified):
-    result = "@" & userName(contact.ensName, true)
+    result = "@" & userName(contact.ensName, removeSuffix)
   else:
     result = contact.alias
 

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/ChannelIdentifier.qml

@@ -43,7 +43,7 @@ Item {
 
         StyledText {
             visible: chatsModel.activeChannel.chatType !== Constants.chatTypeOneToOne
-            text: (chatsModel.activeChannel.name.charAt(0) === "#" ? chatsModel.activeChannel.name.charAt(1) : chatsModel.activeChannel.name.charAt(0)).toUpperCase()
+            text: Utils.removeStatusEns((chatsModel.activeChannel.name.charAt(0) === "#" ? chatsModel.activeChannel.name.charAt(1) : chatsModel.activeChannel.name.charAt(0)).toUpperCase())
             opacity: 0.7
             font.weight: Font.Bold
             font.pixelSize: 51
@@ -57,10 +57,10 @@ Item {
         id: channelName
         wrapMode: Text.Wrap
         text: {
-                if (chatsModel.activeChannel.chatType !== Constants.chatTypePublic) {
+            switch(chatsModel.activeChannel.chatType) {
-                    return chatsModel.activeChannel.name;
+                case Constants.chatTypePublic: return "#" + chatsModel.activeChannel.name;
-                } else {
+                case Constants.chatTypeOneToOne: return Utils.removeStatusEns(chatsModel.activeChannel.name)
-                    return "#" + chatsModel.activeChannel.name;
+                default: return chatsModel.activeChannel.name
             }
         }
         font.weight: Font.Bold

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/NormalMessage.qml

@@ -28,7 +28,6 @@ Item {
     UsernameLabel {
         id: chatName
         visible: chatsModel.activeChannel.chatType !== Constants.chatTypeOneToOne && isMessage && authorCurrentMsg != authorPrevMsg && !isCurrentUser
-        text: userName
         anchors.leftMargin: 20
         anchors.top: dateGroupLbl.visible ? dateGroupLbl.bottom : parent.top
         anchors.topMargin: 0

ui/app/AppLayouts/Chat/ChatColumn/MessageComponents/UsernameLabel.qml

@@ -7,7 +7,8 @@ StyledTextEdit {
     visible: isMessage && authorCurrentMsg != authorPrevMsg
     height: this.visible ? 18 : 0
     //% "You"
-    text: !isCurrentUser ? userName : qsTrId("You")
+    text: !isCurrentUser ? Utils.removeStatusEns(userName) : qsTrId("You")
+    color: (userName.startsWith("@") || isCurrentUser) ? Style.current.blue : Style.current.textColor
     font.bold: true
     font.pixelSize: 14
     readOnly: true

ui/app/AppLayouts/Chat/ChatColumn/TopBar.qml

@@ -31,7 +31,13 @@ Rectangle {
         id: channelName
         width: 80
         height: 20
-        text: chatsModel.activeChannel.chatType != Constants.chatTypePublic ? chatsModel.activeChannel.name : channelNameStr
+        text: {
+            switch(chatsModel.activeChannel.chatType) {
+                case Constants.chatTypePublic: return channelNameStr;
+                case Constants.chatTypeOneToOne: return Utils.removeStatusEns(chatsModel.activeChannel.name)
+                default: return chatsModel.activeChannel.name
+            }
+        }
         anchors.left: channelIcon.right
         anchors.leftMargin: Style.current.smallPadding
         anchors.top: parent.top

ui/app/AppLayouts/Chat/ContactsColumn/Channel.qml

@@ -70,7 +70,7 @@ Rectangle {
 
     StyledText {
         id: contactInfo
-        text: wrapper.chatType !== Constants.chatTypePublic ? Emoji.parse(wrapper.name, "26x26") : "#" + wrapper.name
+        text: wrapper.chatType !== Constants.chatTypePublic ? Emoji.parse(Utils.removeStatusEns(wrapper.name), "26x26") : "#" + wrapper.name
         anchors.right: contactTime.left
         anchors.rightMargin: Style.current.smallPadding
         elide: Text.ElideRight

ui/app/AppLayouts/Chat/components/GroupInfoPopup.qml

@@ -123,6 +123,8 @@ ModalPopup {
             SVGImage {
                 id: editGroupImg
                 source: "../../../img/edit-group.svg"
+                height: 16
+                width: 16
                 anchors.horizontalCenter: parent.horizontalCenter
                 anchors.verticalCenter: parent.verticalCenter
             }
@@ -184,7 +186,7 @@ ModalPopup {
                     showCheckbox: memberCount < maxMembers
                     pubKey: model.pubKey
                     isUser: model.isUser
-                    name: model.name
+                    name: Utils.removeStatusEns(model.name)
                     address: model.address
                     identicon: model.identicon
                     onItemChecked: function(pubKey, itemChecked){
@@ -272,7 +274,7 @@ ModalPopup {
                 }
                 Column {
                     StyledText {
-                        text: model.userName
+                        text: Utils.removeStatusEns(model.userName)
                         width: 300
                         elide: Text.ElideRight
                         Layout.fillWidth: true

ui/app/AppLayouts/Chat/components/MessageContextMenu.qml

@@ -54,7 +54,7 @@ PopupMenu {
 
         StyledText {
             id: username
-            text: profilePopup.userName
+            text: Utils.removeStatusEns(profilePopup.userName)
             horizontalAlignment: Text.AlignHCenter
             wrapMode: Text.WordWrap
             anchors.top: profileImage.bottom

ui/app/AppLayouts/Chat/components/ProfilePopup.qml

@@ -53,7 +53,7 @@ ModalPopup {
 
         StyledTextEdit {
             id: profileName
-            text: userName
+            text:  Utils.removeStatusEns(userName)
             anchors.top: parent.top
             anchors.topMargin: 18
             anchors.left: profilePic.right
@@ -150,7 +150,7 @@ ModalPopup {
             id: valueEnsName
             visible: isEnsVerified
             height: isEnsVerified ? 20 : 0
-            text: userName
+            text: userName.substr(1)
             font.pixelSize: 14
             anchors.left: parent.left
             anchors.leftMargin: Style.current.smallPadding

ui/app/AppLayouts/Profile/Sections/Contacts/ContactList.qml

@@ -20,7 +20,7 @@ ListView {
 
     model: contacts
     delegate: Contact {
-        name: model.name
+        name: Utils.removeStatusEns(model.name)
         address: model.address
         identicon: model.identicon
         isContact: model.isContact

ui/app/AppLayouts/Profile/Sections/Ens/List.qml

@@ -244,7 +244,8 @@ Item {
 
         UsernameLabel {
             id: chatName
-            text: profileModel.ens.preferredUsername
+            text: "@" + (profileModel.ens.preferredUsername.replace(".stateofus.eth", ""))
+            color: Style.current.blue
             anchors.leftMargin: 20
             anchors.top: parent.top
             anchors.topMargin: 0

ui/imports/Utils.qml

@@ -60,6 +60,9 @@ QtObject {
     function isOnlyEmoji(inputText) {
         var emoji_regex = /^(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff]|[\u0023-\u0039]\ufe0f?\u20e3|\u3299|\u3297|\u303d|\u3030|\u24c2|\ud83c[\udd70-\udd71]|\ud83c[\udd7e-\udd7f]|\ud83c\udd8e|\ud83c[\udd91-\udd9a]|\ud83c[\udde6-\uddff]|[\ud83c[\ude01-\ude02]|\ud83c\ude1a|\ud83c\ude2f|[\ud83c[\ude32-\ude3a]|[\ud83c[\ude50-\ude51]|\u203c|\u2049|[\u25aa-\u25ab]|\u25b6|\u25c0|[\u25fb-\u25fe]|\u00a9|\u00ae|\u2122|\u2139|\ud83c\udc04|[\u2600-\u26FF]|\u2b05|\u2b06|\u2b07|\u2b1b|\u2b1c|\u2b50|\u2b55|\u231a|\u231b|\u2328|\u23cf|[\u23e9-\u23f3]|[\u23f8-\u23fa]|\ud83c\udccf|\u2934|\u2935|[\u2190-\u21ff]|\s)+$/;
         return emoji_regex.test(inputText);
+    }
 
+    function removeStatusEns(userName){
+        return userName.endsWith(".stateofus.eth") ? userName.substr(0, userName.length - 14) : userName
     }
 }