From bb8a527ff60f3360fc38cfd4da067fb944e82dc7 Mon Sep 17 00:00:00 2001
From: Yuri Kuznetsov <yurikuzn@users.noreply.github.com>
Date: Sun, 27 Oct 2024 09:28:22 +0200
Subject: [PATCH] email address avatar

---
 .../email/fields/email-address-varchar.js     | 26 +++++++++++++++++--
 .../email/fields/from-address-varchar.js      | 14 +++++++++-
 frontend/less/espo/custom.less                |  6 +++++
 3 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/client/src/views/email/fields/email-address-varchar.js b/client/src/views/email/fields/email-address-varchar.js
index 234941a77e..aaee422088 100644
--- a/client/src/views/email/fields/email-address-varchar.js
+++ b/client/src/views/email/fields/email-address-varchar.js
@@ -456,12 +456,26 @@ class EmailAddressVarcharFieldView extends BaseFieldView {
         }
     }
 
+    /**
+     * @private
+     * @param {string} address
+     * @param {string} name
+     */
     addAddressHtml(address, name) {
         const $container = this.$el.find('.link-container');
 
+        const type = this.typeHash[address];
+        const id = this.idHash[address];
+
+        let avatarHtml = '';
+
         const $text = $('<span>');
 
         if (name) {
+            if (type === 'User' && id) {
+                avatarHtml = this.getHelper().getAvatarHtml(id, 'small', 18, 'avatar-link');
+            }
+
             $text.append(
                 $('<span>').text(name),
                 ' ',
@@ -478,6 +492,7 @@ class EmailAddressVarcharFieldView extends BaseFieldView {
             .attr('data-address', address)
             .addClass('list-group-item')
             .append(
+                avatarHtml,
                 $('<a>')
                     .attr('data-address', address)
                     .attr('role', 'button')
@@ -554,10 +569,17 @@ class EmailAddressVarcharFieldView extends BaseFieldView {
         const id = this.idHash[address] || null;
 
         if (id) {
-            return $('<div>')
+            let avatarHtml = '';
+
+            if (entityType === 'User') {
+                avatarHtml = this.getHelper().getAvatarHtml(id, 'small', 18, 'avatar-link');
+            }
+
+            return $('<div class="email-address-detail-item">')
                 .append(
+                    avatarHtml,
                     $('<a>')
-                        .attr('href', '#' + entityType + '/view/' + id)
+                        .attr('href', `#${entityType}/view/${id}`)
                         .attr('data-scope', entityType)
                         .attr('data-id', id)
                         .text(name),
diff --git a/client/src/views/email/fields/from-address-varchar.js b/client/src/views/email/fields/from-address-varchar.js
index d3c63dbfe5..0e2bf3d9da 100644
--- a/client/src/views/email/fields/from-address-varchar.js
+++ b/client/src/views/email/fields/from-address-varchar.js
@@ -173,6 +173,11 @@ class EmailFromAddressVarchar extends BaseFieldView {
         return super.getValueForDisplay();
     }
 
+    /**
+     * @protected
+     * @param {string} address
+     * @return {string}
+     */
     getDetailAddressHtml(address) {
         if (!address) {
             return '';
@@ -186,8 +191,15 @@ class EmailFromAddressVarchar extends BaseFieldView {
         const id = this.idHash[address] || null;
 
         if (id) {
-            return $('<div>')
+            let avatarHtml = '';
+
+            if (entityType === 'User') {
+                avatarHtml = this.getHelper().getAvatarHtml(id, 'small', 18, 'avatar-link');
+            }
+
+            return $('<div class="email-address-detail-item">')
                 .append(
+                    avatarHtml,
                     $('<a>')
                         .attr('href', `#${entityType}/view/${id}`)
                         .attr('data-scope', entityType)
diff --git a/frontend/less/espo/custom.less b/frontend/less/espo/custom.less
index e1e1be2e32..46e6c037c0 100644
--- a/frontend/less/espo/custom.less
+++ b/frontend/less/espo/custom.less
@@ -2346,6 +2346,12 @@ div:has(.avatar-in-input) {
     }
 }
 
+.email-address-detail-item {
+    > img.avatar {
+        margin-right: 5px;
+    }
+}
+
 div[data-scope="User"],
 div[data-scope="PortalUser"],
 div[data-scope="ApiUser"] {