[IMP] mail: add a different layout for inactive followers

When displaying the followers of a document, followers who are set as inactive will be displayed in a different layout than the active ones. The purpose is to mark a clear difference between active and inactive followers.

Task #1957849

closes odoo/odoo#32084

Signed-off-by: Xavier Dollé (xdo) <xdo@odoo.com>

5 files changed, 80 insertions, 2 deletions

diff --git a/addons/mail/controllers/main.py b/addons/mail/controllers/main.py
index 38965dcf79b..6b8cf59ccdc 100644
--- a/addons/mail/controllers/main.py
+++ b/addons/mail/controllers/main.py
@@ -136,6 +136,7 @@ class MailController(http.Controller):
                 'res_id': follower.partner_id.id or follower.channel_id.id,
                 'is_editable': is_editable,
                 'is_uid': is_uid,
+                'active': follower.partner_id.active or bool(follower.channel_id),
             })
         return {
             'followers': followers,
diff --git a/addons/mail/static/src/js/followers.js b/addons/mail/static/src/js/followers.js
index a8475f43219..9fe3d9f00bc 100644
--- a/addons/mail/static/src/js/followers.js
+++ b/addons/mail/static/src/js/followers.js
@@ -113,6 +113,12 @@ var Followers = AbstractField.extend({
         $(QWeb.render('mail.Followers.add_more', {widget: this})).appendTo($followers_list);
         var $follower_li;
         _.each(this.followers, function (record) {
+            if(!record.active) {
+                record.title = _.str.sprintf(_t('%s \n(inactive)'), record.name);
+            } else {
+                record.title = record.name;
+            }
+
             $follower_li = $(QWeb.render('mail.Followers.partner', {
                 'record': _.extend(record, {'avatar_url': '/web/image/' + record.res_model + '/' + record.res_id + '/image_small'}),
                 'widget': self})
diff --git a/addons/mail/static/src/scss/followers.scss b/addons/mail/static/src/scss/followers.scss
index 934df9b7acc..ddf5c945994 100644
--- a/addons/mail/static/src/scss/followers.scss
+++ b/addons/mail/static/src/scss/followers.scss
@@ -110,6 +110,16 @@
                     @include o-position-absolute(6px, 18px);
                     cursor: pointer;
                 }
+
+                &.o_inactive {
+                    > a {
+                        color: $gray-500;
+                        font-style: italic;
+                    }
+                    > img {
+                        opacity: 0.25;
+                    }
+                }
             }
 
         }
diff --git a/addons/mail/static/src/xml/followers.xml b/addons/mail/static/src/xml/followers.xml
index 85da9465cd3..4cca8897638 100644
--- a/addons/mail/static/src/xml/followers.xml
+++ b/addons/mail/static/src/xml/followers.xml
@@ -35,10 +35,10 @@
         Partner or channel following the record
     -->
     <t t-name="mail.Followers.partner">
-        <div role="menuitem" class="o_partner">
+        <div role="menuitem" t-attf-class="o_partner {{ !record.active ? 'o_inactive': '' }}">
             <a class="dropdown-item o_mail_redirect"
                href="#"
-               t-att-title="record.name"
+               t-att-title="record.title"
                t-att-data-oe-model="record.res_model"
                t-att-data-oe-id="record.res_id"><t t-esc="record.name"/></a>
             <img t-att-src="record.avatar_url" alt="Avatar"/>
diff --git a/addons/mail/static/tests/chatter_tests.js b/addons/mail/static/tests/chatter_tests.js
index 08f5c01fc34..582448f1bc7 100644
--- a/addons/mail/static/tests/chatter_tests.js
+++ b/addons/mail/static/tests/chatter_tests.js
@@ -2264,6 +2264,67 @@ QUnit.test('followers widget: do not display follower duplications', async funct
     form.destroy();
 });
 
+QUnit.test('followers widget: display inactive followers with a different style', async function (assert) {
+    assert.expect(6);
+
+    this.data.partner.records[0].message_follower_ids = [1,2,3];
+
+    var followers = [{
+        id: 1,
+        name: "Admin",
+        email: "admin@example.com",
+        res_id: 101,
+        res_model: 'partner',
+        active: true,
+    },{
+        id: 2,
+        name: "Active_partner",
+        email: "active_partner@example.com",
+        res_id: 102,
+        res_model: 'partner',
+        active: true,
+    },{
+        id: 3,
+        name: "Inactive_partner",
+        email: "inactive_partner@example.com",
+        res_id: 103,
+        res_model: 'partner',
+        active: false,
+    }];
+
+    var form = await createView({
+        View: FormView,
+        model: 'partner',
+        data: this.data,
+        services: this.services,
+        arch: '<form>' +
+                '<div class="oe_chatter">' +
+                    '<field name="message_follower_ids" widget="mail_followers"/>' +
+                '</div>' +
+            '</form>',
+        mockRPC: function (route, args) {
+            if (route === '/mail/read_followers') {
+                return Promise.resolve({
+                    followers: _.filter(followers, function (follower) {
+                        return _.contains(args.follower_ids, follower.id);
+                    }),
+                });
+            }
+            return this._super.apply(this, arguments);
+        },
+        res_id: 2,
+    });
+
+    assert.doesNotHaveClass(form.$(".o_partner:has(a[data-oe-id='101'])"), 'o_inactive', 'Partner should be active');
+    assert.hasAttrValue(form.$(".o_partner:has(a[data-oe-id='101']) > a"),'title','Admin');
+    assert.doesNotHaveClass(form.$(".o_partner:has(a[data-oe-id='102'])"), 'o_inactive', 'Partner should be active');
+    assert.hasAttrValue(form.$(".o_partner:has(a[data-oe-id='102']) > a"),'title','Active_partner');
+    assert.hasClass(form.$(".o_partner:has(a[data-oe-id='103'])"), 'o_inactive', 'Partner should be inactive');
+    assert.hasAttrValue(form.$(".o_partner:has(a[data-oe-id='103']) > a"),'title','Inactive_partner \n(inactive)');
+
+    form.destroy();
+});
+
 QUnit.test('does not render and crash when destroyed before chat system is ready', async function (assert) {
     assert.expect(0);