From d97ff6820ef4f1ee1be100435783c663fdd2090c Mon Sep 17 00:00:00 2001
From: tsm-odoo <tsm@odoo.com>
Date: Fri, 7 Jul 2023 09:53:48 +0000
Subject: [PATCH] [FIX] mail: fix slow follower insertion
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Before this commit, follower insertion checked if a follower
was already in the thread's follower list by using
`Array.prototype.includes`. Since this method must run through
every item in the array to tell whether or not a follower is
present, it is extremly slow with large arrays (especially
since it is called for each follower).

This would slow down the tab for threads having lots of follower
(issue starts appering at 5k+ followers).

This PR solves the issue by replacing thread follower lists by
sets. With this change, inserting even 15k+ follower is almost
instantaneous since the membership test is done in O(1) instead
of O(n).

closes odoo/odoo#127833

X-original-commit: 406c91c8cba32e01eaa8df4b7fb9d0e3ad821e9c
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
---
 .../mail/static/src/core/common/suggestion_service.js |  5 +++--
 addons/mail/static/src/core/common/thread_model.js    | 11 ++++++++---
 addons/mail/static/src/core/web/chatter.js            |  4 ++--
 addons/mail/static/src/core/web/chatter.xml           | 10 +++++-----
 addons/mail/static/src/core/web/recipient_list.xml    |  2 +-
 .../mail/static/src/core/web/thread_service_patch.js  |  9 ++-------
 6 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/addons/mail/static/src/core/common/suggestion_service.js b/addons/mail/static/src/core/common/suggestion_service.js
index 2a4a8a3e5db..32d2dc2ff3c 100644
--- a/addons/mail/static/src/core/common/suggestion_service.js
+++ b/addons/mail/static/src/core/common/suggestion_service.js
@@ -208,8 +208,9 @@ export class SuggestionService {
                 }
             }
             if (thread) {
-                const isFollower1 = thread.followers.some((follower) => follower.partner === p1);
-                const isFollower2 = thread.followers.some((follower) => follower.partner === p2);
+                const followerList = [...thread.followers];
+                const isFollower1 = followerList.some((follower) => follower.partner === p1);
+                const isFollower2 = followerList.some((follower) => follower.partner === p2);
                 if (isFollower1 && !isFollower2) {
                     return -1;
                 }
diff --git a/addons/mail/static/src/core/common/thread_model.js b/addons/mail/static/src/core/common/thread_model.js
index b7e2732204a..a4697fcf301 100644
--- a/addons/mail/static/src/core/common/thread_model.js
+++ b/addons/mail/static/src/core/common/thread_model.js
@@ -51,8 +51,8 @@ export class Thread {
     customName;
     /** @type {string} */
     description;
-    /** @type {import("@mail/core/common/follower_model").Follower[]} */
-    followers = [];
+    /** @type {Set<import("@mail/core/common/follower_model").Follower>} */
+    followers = new Set();
     isAdmin = false;
     loadOlder = false;
     loadNewer = false;
@@ -256,7 +256,12 @@ export class Thread {
      * @returns {import("@mail/core/common/follower_model").Follower}
      */
     get followerOfSelf() {
-        return this.followers.find((f) => f.partner === this._store.self);
+        for (const follower of this.followers) {
+            if (follower.partner === this._store.self) {
+                return follower;
+            }
+        }
+        return undefined;
     }
 
     get imgUrl() {
diff --git a/addons/mail/static/src/core/web/chatter.js b/addons/mail/static/src/core/web/chatter.js
index 3b3427f4a2c..7418feddb4b 100644
--- a/addons/mail/static/src/core/web/chatter.js
+++ b/addons/mail/static/src/core/web/chatter.js
@@ -201,7 +201,7 @@ export class Chatter extends Component {
      * @returns {string}
      */
     get toRecipientsText() {
-        const followers = this.state.thread.followers.slice(0, 5).map(({ partner }) => {
+        const followers = [...this.state.thread.followers].slice(0, 5).map(({ partner }) => {
             if (partner === this.store.self) {
                 return `<span class="text-muted" title="${escape(partner.email)}">me</span>`;
             }
@@ -213,7 +213,7 @@ export class Chatter extends Component {
             this.store.env.services["user"].lang?.replace("_", "-"),
             { type: "unit" }
         );
-        if (this.state.thread.followers.length > 5) {
+        if (this.state.thread.followers.size > 5) {
             followers.push("…");
         }
         return markup(formatter.format(followers));
diff --git a/addons/mail/static/src/core/web/chatter.xml b/addons/mail/static/src/core/web/chatter.xml
index c9403fec8d4..34e2a9ebe30 100644
--- a/addons/mail/static/src/core/web/chatter.xml
+++ b/addons/mail/static/src/core/web/chatter.xml
@@ -35,17 +35,17 @@
                     <Dropdown t-if="props.hasFollowers" position="'bottom-end'" disabled="isDisabled" class="'o-mail-Followers d-flex me-1'" menuClass="'o-mail-Followers-dropdown flex-column p-0'" menuDisplay="'d-flex'" title="followerButtonLabel" togglerClass="'o-mail-Followers-button btn btn-link text-action px-1 ' + (props.compactHeight ? '' : 'my-2')">
                         <t t-set-slot="toggler">
                             <i class="fa fa-user-o" role="img"/>
-                            <span class="o-mail-Followers-counter ps-1" t-esc="state.thread.followers.length"/>
+                            <span class="o-mail-Followers-counter ps-1" t-esc="state.thread.followers.size"/>
                         </t>
                         <t t-set-slot="default">
                             <t t-if="state.thread.hasWriteAccess">
                                 <a class="dropdown-item" href="#" role="menuitem" t-on-click.prevent="onClickAddFollowers">
                                     Add Followers
                                 </a>
-                                <div t-if="state.thread.followers.length > 0" role="separator" class="dropdown-divider"/>
+                                <div t-if="state.thread.followers.size > 0" role="separator" class="dropdown-divider"/>
                             </t>
-                            <t t-if="state.thread.followers.length > 0">
-                                <div t-foreach="state.thread.followers" t-as="follower" t-key="follower.id" class="dropdown-item o-mail-Follower d-flex justify-content-between p-0">
+                            <t t-if="state.thread.followers.size > 0">
+                                <div t-foreach="[...state.thread.followers]" t-as="follower" t-key="follower.id" class="dropdown-item o-mail-Follower d-flex justify-content-between p-0">
                                     <a class="o-mail-Follower-details d-flex align-items-center flex-grow-1 px-3 text-700 o-min-width-0" t-att-class="{ 'o-inactive fst-italic opacity-25': !follower.isActive }" href="#" role="menuitem" t-on-click.prevent="(ev) => this.onClickDetails(ev, follower)">
                                         <img class="o-mail-Follower-avatar me-2 rounded" t-att-src="threadService.avatarUrl(follower.partner, state.thread)" alt=""/>
                                         <span class="flex-shrink text-truncate" t-esc="follower.partner.name"/>
@@ -92,7 +92,7 @@
                 </button>
             </div>
             <t t-if="state.thread.composer.type">
-                <t t-if="state.thread.composer.type === 'message' and state.thread.followers.length > 0">
+                <t t-if="state.thread.composer.type === 'message' and state.thread.followers.size > 0">
                     <div class="flex-shrink-0 px-3 pt-3 text-truncate small mb-2" style="margin-left:48px">
                         <span class="fw-bold">To:</span> <t t-out="toRecipientsText"/>
                         <button class="o-mail-Chatter-recipientListButton btn btn-link badge rounded-pill border-0 p-1 ms-1" title="Show all recipients" t-on-click="onClickRecipientList">
diff --git a/addons/mail/static/src/core/web/recipient_list.xml b/addons/mail/static/src/core/web/recipient_list.xml
index 6a5397e59e7..c9a6062096b 100644
--- a/addons/mail/static/src/core/web/recipient_list.xml
+++ b/addons/mail/static/src/core/web/recipient_list.xml
@@ -4,7 +4,7 @@
     <t t-name="mail.RecipientList" owl="1">
         <div class="o-mail-RecipientList p-2 overflow-auto">
             <ul class="list-unstyled mb-0">
-                <li t-foreach="props.thread.followers" t-as="follower" t-key="follower.id">
+                <li t-foreach="[...props.thread.followers]" t-as="follower" t-key="follower.id">
                     <t t-out="follower.partner.email"/>
                 </li>
             </ul>
diff --git a/addons/mail/static/src/core/web/thread_service_patch.js b/addons/mail/static/src/core/web/thread_service_patch.js
index 869c6ef5162..c9fcc9d6727 100644
--- a/addons/mail/static/src/core/web/thread_service_patch.js
+++ b/addons/mail/static/src/core/web/thread_service_patch.js
@@ -138,9 +138,7 @@ patch(ThreadService.prototype, "mail/core/web", {
             partner: this.personaService.insert({ ...data.partner, type: "partner" }),
             _store: this.store,
         });
-        if (!follower.followedThread.followers.includes(follower)) {
-            follower.followedThread.followers.push(follower);
-        }
+        follower.followedThread.followers.add(follower);
         return follower;
     },
     /**
@@ -190,10 +188,7 @@ patch(ThreadService.prototype, "mail/core/web", {
             [follower.followedThread.id],
             [follower.partner.id],
         ]);
-        const index = follower.followedThread.followers.indexOf(follower);
-        if (index !== -1) {
-            follower.followedThread.followers.splice(index, 1);
-        }
+        follower.followedThread.followers.delete(follower);
         delete this.store.followers[follower.id];
     },
     unpin(thread) {