fix(@desktop): Use colorId to find correct color of users&members

colorId is set in the model instead of using qml function.

Fix #6366

src/app/modules/main/chat_section/chat_content/users/module.nim

@@ -80,6 +80,7 @@ method onNewMessagesLoaded*(self: Module, messages: seq[MessageDto]) =
       localNickname = contactDetails.details.localNickname,
       alias = contactDetails.details.alias,
       icon = contactDetails.icon,
+      colorId = contactDetails.colorId,
       onlineStatus = status,
       isContact = contactDetails.details.isContact,
       isUntrustworthy = contactDetails.details.trustStatus == TrustStatus.Untrustworthy,
@@ -147,6 +148,7 @@ method addChatMember*(self: Module,  member: ChatMember) =
     localNickname = contactDetails.details.localNickname,
     alias = contactDetails.details.alias,
     icon = contactDetails.icon,
+    colorId = contactDetails.colorId,
     onlineStatus = status,
     isContact = contactDetails.details.isContact,
     isAdmin = member.admin,

src/app/modules/main/chat_section/module.nim

@@ -215,6 +215,7 @@ proc createItemFromPublicKey(self: Module, publicKey: string): UserItem =
     pubKey = contactDetails.details.id,
     displayName = contactDetails.displayName,
     icon = contactDetails.icon,
+    colorId = contactDetails.colorId,
     onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(publicKey).statusType),
     isContact = contactDetails.details.isContact(),
     isVerified = contactDetails.details.isContactVerified(),

src/app/modules/main/communities/module.nim

@@ -87,6 +87,7 @@ proc createMemberItem(self: Module, memberId, requestId: string): MemberItem =
     localNickname = contactDetails.details.localNickname,
     alias = contactDetails.details.alias,
     icon = contactDetails.icon,
+    colorId = contactDetails.colorId,
     onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(memberId).statusType),
     isContact = contactDetails.details.isContact,
     requestToJoinId = requestId)

src/app/modules/main/module.nim

@@ -237,6 +237,7 @@ proc createChannelGroupItem[T](self: Module[T], c: ChannelGroupDto): SectionItem
         localNickname = contactDetails.details.localNickname,
         alias = contactDetails.details.alias,
         icon = contactDetails.icon,
+        colorId = contactDetails.colorId,
         onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(member.id).statusType),
         isContact = contactDetails.details.isContact,
         isAdmin = member.admin
@@ -260,6 +261,7 @@ proc createChannelGroupItem[T](self: Module[T], c: ChannelGroupDto): SectionItem
         localNickname = contactDetails.details.localNickname,
         alias = contactDetails.details.alias,
         icon = contactDetails.icon,
+        colorId = contactDetails.colorId,
         onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(bannedMemberId).statusType),
         isContact = contactDetails.details.isContact
       )
@@ -273,6 +275,7 @@ proc createChannelGroupItem[T](self: Module[T], c: ChannelGroupDto): SectionItem
         localNickname = contactDetails.details.localNickname,
         alias = contactDetails.details.alias,
         icon = contactDetails.icon,
+        colorId = contactDetails.colorId,
         onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(requestDto.publicKey).statusType),
         isContact = contactDetails.details.isContact,
         requestToJoinId = requestDto.id
@@ -287,6 +290,7 @@ proc createChannelGroupItem[T](self: Module[T], c: ChannelGroupDto): SectionItem
         localNickname = contactDetails.details.localNickname,
         alias = contactDetails.details.alias,
         icon = contactDetails.icon,
+        colorId = contactDetails.colorId,
         onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(requestDto.publicKey).statusType),
         isContact = contactDetails.details.isContact,
         requestToJoinId = requestDto.id

src/app/modules/main/profile_section/contacts/controller.nim

@@ -91,6 +91,9 @@ proc getContactNameAndImage*(self: Controller, contactId: string):
     tuple[name: string, image: string, largeImage: string] =
   return self.contactsService.getContactNameAndImage(contactId)
 
+proc getContactDetails*(self: Controller, contactId: string): ContactDetails =
+  return self.contactsService.getContactDetails(contactId)
+
 proc unblockContact*(self: Controller, publicKey: string) =
   self.contactsService.unblockContact(publicKey)
 

src/app/modules/main/profile_section/contacts/module.nim

@@ -41,12 +41,13 @@ method delete*(self: Module) =
 
 proc createItemFromPublicKey(self: Module, publicKey: string): UserItem =
   let contact =  self.controller.getContact(publicKey)
-  let (name, image, _) = self.controller.getContactNameAndImage(contact.id)
+  let contactDetails = self.controller.getContactDetails(contact.id)
 
   return initUserItem(
     pubKey = contact.id,
-    displayName = name,
+    displayName = contactDetails.displayName,
-    icon = image,
+    icon = contactDetails.icon,
+    colorId = contactDetails.colorId,
     onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(publicKey).statusType),
     isContact = contact.isContact(),
     isBlocked = contact.isBlocked(),

src/app/modules/shared_models/member_item.nim

@@ -17,7 +17,7 @@ proc initMemberItem*(
   localNickname: string,
   alias: string,
   icon: string,
-  colorId: int = 0,
+  colorId: int,
   colorHash: string = "",
   onlineStatus: OnlineStatus = OnlineStatus.Inactive,
   isContact: bool = false,

src/app/modules/shared_models/user_item.nim

@@ -83,7 +83,7 @@ proc initUserItem*(
     localNickname: string = "",
     alias: string = "",
     icon: string,
-    colorId: int = 0,
+    colorId: int,
     colorHash: string = "",
     onlineStatus: OnlineStatus,
     isContact: bool,

src/app_service/service/contacts/dto/contact_details.nim

@@ -9,4 +9,5 @@ type
     displayName*: string
     icon*: string
     isCurrentUser*: bool
+    colorId*: int
     details*: ContactsDto

src/app_service/service/contacts/service.nim

@@ -8,6 +8,8 @@ import ../../common/types as common_types
 
 import ../settings/service as settings_service
 import ../network/service as network_service
+import ../visual_identity/service as procs_from_visual_identity_service
+
 import ./dto/contacts as contacts_dto
 import ./dto/status_update as status_update_dto
 import ./dto/contact_details
@@ -514,6 +516,7 @@ QtObject:
     let (name, icon, _) = self.getContactNameAndImage(pubKey)
     result.displayName = name
     result.icon = icon
+    result.colorId = procs_from_visual_identity_service.colorIdOf(pubKey)
     result.isCurrentUser = pubKey == singletonInstance.userProfile.getPubKey()
     result.details = self.getContactById(pubKey)
 

ui/app/AppLayouts/Chat/panels/ContactListPanel.qml

@@ -39,7 +39,7 @@ StatusListView {
         asset.width: asset.isImage ? 40 : 20
         asset.name: model.icon
         asset.isImage: model.icon !== ""
-        asset.color: Utils.colorForPubkey(model.pubKey)
+        asset.color: Utils.colorForColorId(model.colorId)
         asset.charactersLen: 2
         ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey)
 

ui/app/AppLayouts/Chat/panels/UserListPanel.qml

@@ -95,7 +95,7 @@ Item {
             }
             asset.isImage: (asset.name !== "")
             asset.isLetterIdenticon: (asset.name === "")
-            asset.color: Utils.colorForPubkey(model.pubKey) // FIXME: use model.colorId
+            asset.color:  Utils.colorForColorId(model.colorId)
             status: model.onlineStatus
             ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey) // FIXME: use model.colorHash
             onClicked: {

ui/app/AppLayouts/Chat/panels/communities/CommunityMembersTabPanel.qml

@@ -140,7 +140,7 @@ Item {
                 nickName: model.localNickname
                 userName: model.displayName
                 status: model.onlineStatus
-                asset.color: Utils.colorForPubkey(model.pubKey) // FIXME: use model.colorId
+                asset.color: Utils.colorForColorId(model.colorId)
                 asset.name: model.icon
                 asset.isImage: true
                 asset.imgIsIdenticon: false

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

@@ -216,7 +216,7 @@ StatusModal {
                 asset.name: model.icon
                 asset.isImage: !!model.icon
                 ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey)
-                asset.color: Utils.colorForPubkey(model.pubKey)
+                asset.color: Utils.colorForColorId(model.colorId)
                 asset.charactersLen: 2
                 asset.isLetterIdenticon: model.icon === ""
                 asset.height: asset.isLetterIdenticon ? 40 : 20

ui/imports/shared/views/ExistingContacts.qml

@@ -58,7 +58,7 @@ Item {
             asset.imgIsIdenticon: false
             asset.width: 40
             asset.height: 40
-            asset.color: Utils.colorForPubkey(model.pubKey)
+            asset.color: Utils.colorForColorId(model.colorId)
             ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey)
             statusListItemIcon.badge.border.color: Theme.palette.baseColor4
             statusListItemIcon.badge.implicitHeight: 14 // 10 px + 2 px * 2 borders

ui/imports/shared/views/PickedContacts.qml

@@ -58,7 +58,7 @@ Item {
             asset.width: 40
             asset.height: 40
             color: "transparent"
-            asset.color: Utils.colorForPubkey(model.pubKey)
+            asset.color: Utils.colorForColorId(model.colorId)
             ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey)
             statusListItemIcon.badge.border.color: Theme.palette.baseColor4
             statusListItemIcon.badge.implicitHeight: 14 // 10 px + 2 px * 2 borders

ui/imports/utils/Utils.qml

@@ -576,15 +576,17 @@ QtObject {
         return globalUtils.getColorId(publicKey)
     }
 
-    function colorForPubkey(publicKey) {
+    function colorForColorId(colorId)  {
-        const pubKeyColorId = colorIdForPubkey(publicKey)
+        if (colorId < 0 || colorId >=  Theme.palette.userCustomizationColors.length) {
-
+            console.warn("Utils.colorForColorId : colorId is out of bounds")
-        if (pubKeyColorId < 0 || pubKeyColorId >=  Theme.palette.userCustomizationColors.length) {
-            console.warn("Utils.colorForPubkey : colorId for publicKey is out of bounds")
             return StatusColors.colors['blue']
         }
+        return Theme.palette.userCustomizationColors[colorId]
+    }
 
-        return Theme.palette.userCustomizationColors[pubKeyColorId]
+    function colorForPubkey(publicKey) {
+        const pubKeyColorId = colorIdForPubkey(publicKey)
+        return colorForColorId(pubKeyColorId)
     }
 
     function getCompressedPk(publicKey) {