From 67c706fcf2a3b6f735f7c1bf39bcf4d4dd35ea0c Mon Sep 17 00:00:00 2001
From: tsm-odoo <tsm@odoo.com>
Date: Thu, 31 Aug 2023 11:24:07 +0200
Subject: [PATCH] [FIX] im_livechat: icons not loaded on embed livechat
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

task-3487807

closes odoo/odoo#133814

X-original-commit: d8c35b9cda7ca2e7539efc368e35aeddbd1b2e6f
Signed-off-by: Matthieu Stockbauer (tsm) <tsm@odoo.com>
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
---
 addons/im_livechat/__manifest__.py            |  1 +
 addons/im_livechat/controllers/main.py        |  4 ++++
 .../static/src/embed/boot_helpers.js          | 20 +++++++++++--------
 3 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/addons/im_livechat/__manifest__.py b/addons/im_livechat/__manifest__.py
index aaa3b0e1251..26fc7955c68 100644
--- a/addons/im_livechat/__manifest__.py
+++ b/addons/im_livechat/__manifest__.py
@@ -95,6 +95,7 @@ Help your customers with this chat, and analyse their feedback.
             'im_livechat/static/tests/tours/**/*',
         ],
         'im_livechat.assets_core': [
+            'web/static/lib/odoo_ui_icons/style.css',
             'mail/static/src/core/common/**/*',
             'mail/static/src/discuss/core/common/*',
             'mail/static/src/discuss/typing/**/*',
diff --git a/addons/im_livechat/controllers/main.py b/addons/im_livechat/controllers/main.py
index efc047b838f..817f246cc9a 100644
--- a/addons/im_livechat/controllers/main.py
+++ b/addons/im_livechat/controllers/main.py
@@ -40,6 +40,10 @@ class LivechatController(http.Controller):
     def fontawesome(self, **kwargs):
         return http.Stream.from_path('web/static/src/libs/fontawesome/fonts/fontawesome-webfont.woff2').get_response()
 
+    @http.route('/im_livechat/odoo_ui_icons', type='http', auth='none', cors="*")
+    def odoo_ui_icons(self, **kwargs):
+        return http.Stream.from_path('web/static/lib/odoo_ui_icons/fonts/odoo_ui_icons.woff2').get_response()
+
     @http.route('/im_livechat/emoji_bundle', type='http', auth='public', cors='*')
     def get_emoji_bundle(self):
         bundle = 'web.assets_emoji'
diff --git a/addons/im_livechat/static/src/embed/boot_helpers.js b/addons/im_livechat/static/src/embed/boot_helpers.js
index 1cd793706b5..c153e6ffdd3 100644
--- a/addons/im_livechat/static/src/embed/boot_helpers.js
+++ b/addons/im_livechat/static/src/embed/boot_helpers.js
@@ -2,23 +2,23 @@
 
 import { serverUrl } from "@im_livechat/embed/livechat_data";
 
-async function loadFontAwesome() {
+async function loadFont(name, url) {
     await document.fonts.ready;
-    if ([...document.fonts].some(({ family }) => family === "FontAwesome")) {
-        // FontAwesome already loaded.
+    if ([...document.fonts].some(({ family }) => family === name)) {
+        // Font already loaded.
         return;
     }
     const link = document.createElement("link");
     link.rel = "preload";
     link.as = "font";
-    link.href = `${serverUrl}/im_livechat/font-awesome`;
+    link.href = url;
     link.crossOrigin = "";
     const style = document.createElement("style");
     style.appendChild(
         document.createTextNode(`
             @font-face {
-                font-family: 'FontAwesome';
-                src: url('${serverUrl}/im_livechat/font-awesome') format('woff2');
+                font-family: ${name};
+                src: url('${url}') format('woff2');
                 font-weight: normal;
                 font-style: normal;
                 font-display: block;
@@ -47,7 +47,7 @@ export function makeRoot(target) {
 
 /**
  * Initialize the livechat container by loading the styles and
- * FontAwesome.
+ * the fonts.
  *
  * @param {HTMLElement} root
  * @returns {ShadowRoot}
@@ -62,6 +62,10 @@ export async function makeShadow(root) {
     });
     const shadow = root.attachShadow({ mode: "open" });
     shadow.appendChild(link);
-    await Promise.all([stylesLoadedPromise, loadFontAwesome()]);
+    await Promise.all([
+        stylesLoadedPromise,
+        loadFont("FontAwesome", `${serverUrl}/im_livechat/font-awesome`),
+        loadFont("odoo_ui_icons", `${serverUrl}/im_livechat/odoo_ui_icons`),
+    ]);
     return shadow;
 }