From 36cd3ec68c97fab5cf4b34697399241944ea5094 Mon Sep 17 00:00:00 2001
From: "Victor Piryns (pivi)" <pivi@odoo.com>
Date: Wed, 15 Nov 2023 09:29:54 +0100
Subject: [PATCH] [PERF] project,*: download smaller avatars in portal view

Description:
Portal routes `/my/tickets` or `/my/tasks` were reported slow to
load with many items.

Analysis:
The avatars that are loaded are of too large sizes (encoded in base64)
compared to their rendering size. `img.o_avatar` limits the
dimensions to `1.7145em` (roughly `27px` on desktop), so it's
useless to load `avatar_1024` for those image sources. This has a
significant impact when the user has a slow connection, the server
is hosted far away from the user, or the images used are of badly
compressed (so each images takes a quite a few MiB).

Fix:
Scan for all instances of the usage of `avatar_1024` on an `<img>`
with the class `o_avatar` and reduce it to `avatar_128`.

Reference:
opw-3470171

closes odoo/odoo#142103

Related: odoo/enterprise#50678
Signed-off-by: Xavier Bol (xbo) <xbo@odoo.com>
---
 addons/account/views/account_portal_templates.xml              | 2 +-
 addons/portal/views/portal_templates.xml                       | 2 +-
 addons/project/views/project_portal_project_task_templates.xml | 2 +-
 addons/purchase/views/portal_templates.xml                     | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/addons/account/views/account_portal_templates.xml b/addons/account/views/account_portal_templates.xml
index 533fed71526..25c42521f8a 100644
--- a/addons/account/views/account_portal_templates.xml
+++ b/addons/account/views/account_portal_templates.xml
@@ -145,7 +145,7 @@
                                 </h6>
                                 <div class="o_portal_contact_details d-flex flex-column gap-2">
                                     <div class="d-flex justify-content-start align-items-center gap-2">
-                                        <img class="o_avatar o_portal_contact_img rounded" t-att-src="image_data_uri(invoice.invoice_user_id.avatar_1024)" alt="Contact"/>
+                                        <img class="o_avatar o_portal_contact_img rounded" t-att-src="image_data_uri(invoice.invoice_user_id.avatar_128)" alt="Contact"/>
                                         <div>
                                             <h6 class="mb-0" t-out="invoice.invoice_user_id.name"/>
                                             <a href="#discussion" class="d-flex align-items-center gap-2 small fw-bold">
diff --git a/addons/portal/views/portal_templates.xml b/addons/portal/views/portal_templates.xml
index e853774d99c..e8e9cfe72e9 100644
--- a/addons/portal/views/portal_templates.xml
+++ b/addons/portal/views/portal_templates.xml
@@ -805,7 +805,7 @@
         </div>
         <div t-attf-class="{{'offcanvas-body' if isOffcanvas else 'mt-3'}}">
             <div class="d-flex justify-content-start align-items-center gap-3 mb-4">
-                <img class="o_portal_contact_img rounded o_object_fit_cover" t-att-src="image_data_uri(user_id.partner_id.avatar_1024)" alt="Contact" width="50"/>
+                <img class="o_portal_contact_img rounded o_object_fit_cover" t-att-src="image_data_uri(user_id.partner_id.avatar_128)" alt="Contact" width="50"/>
                 <div class="d-flex flex-column justify-content-center">
                     <h5 class="mb-0" t-out="user_id.name"/>
                     <p class="mb-0 text-muted" t-out="user_id.company_name"/>
diff --git a/addons/project/views/project_portal_project_task_templates.xml b/addons/project/views/project_portal_project_task_templates.xml
index 302a0e90d1e..b9cd7d69238 100644
--- a/addons/project/views/project_portal_project_task_templates.xml
+++ b/addons/project/views/project_portal_project_task_templates.xml
@@ -188,7 +188,7 @@
                                     <t t-foreach="task.user_ids" t-as="user">
                                         <div t-attf-class="o_portal_contact_details d-flex flex-column gap-2 {{ 'mb-3' if len(task.user_ids) > 1 else '' }}">
                                             <div class="d-flex justify-content-start align-items-center gap-2">
-                                                <img class="o_avatar o_portal_contact_img rounded" t-att-src="image_data_uri(user.avatar_1024)"/>
+                                                <img class="o_avatar o_portal_contact_img rounded" t-att-src="image_data_uri(user.avatar_128)"/>
                                                 <h6 class="mb-0" t-field="user.name"></h6>
                                             </div>
                                             <div t-out="user" t-options='{"widget": "contact", "fields": ["email", "phone"]}'/>
diff --git a/addons/purchase/views/portal_templates.xml b/addons/purchase/views/portal_templates.xml
index 43cccc10cfc..dc73accbfe1 100644
--- a/addons/purchase/views/portal_templates.xml
+++ b/addons/purchase/views/portal_templates.xml
@@ -160,7 +160,7 @@
                               <h6><small class="text-muted">Purchase Representative</small></h6>
                               <div class="o_portal_contact_details d-flex flex-column gap-2">
                                 <div class="d-flex justify-content-start align-items-center gap-2">
-                                    <img class="o_avatar o_portal_contact_img rounded" t-att-src="image_data_uri(order.user_id.avatar_1024)" alt="Contact"/>
+                                    <img class="o_avatar o_portal_contact_img rounded" t-att-src="image_data_uri(order.user_id.avatar_128)" alt="Contact"/>
                                     <div>
                                         <h6 class="mb-0" t-out="order.user_id.name"/>
                                         <a href="#discussion" class="small fw-bold">Send message</a>