diff --git a/__manifest__.py b/__manifest__.py
index e0abd403395d087ed02b1a946c17126877024aa2..7d33905cdef0bfba262ae1ef7301474a510430f0 100644
--- a/__manifest__.py
+++ b/__manifest__.py
@@ -20,10 +20,7 @@
     "assets": {
         "web.assets_frontend": [
             "oacc_portal_overview_cdc/static/src/css/style.css",
-            "web/static/lib/Chart/Chart.js",
-            "oacc_portal_overview_cdc/static/lib/daterangepicker/daterangepicker.js",
-            "oacc_portal_overview_cdc/static/src/js/lib/chartjs-plugin-datalabels.min.js",
-            "oacc_portal_overview_cdc/static/src/js/canvas.js",
+            "oacc_portal_overview_cdc/static/src/js/operation_chart.js",
             "oacc_portal_overview_cdc/static/src/js/select2_fr.js",
         ],
     },
diff --git a/static/src/js/canvas.js b/static/src/js/operation_chart.js
similarity index 97%
rename from static/src/js/canvas.js
rename to static/src/js/operation_chart.js
index 44712b66f2d62813ddd045c98f297eb452817811..950e164abb0d32f296ffaccc3f0783a8279fa0d5 100644
--- a/static/src/js/canvas.js
+++ b/static/src/js/operation_chart.js
@@ -2,17 +2,14 @@
  * @copyright: 2023- Le Filament (<https://le-filament.com>)
  * @license: AGPL-3.0 or later (http://www.gnu.org/licenses/agpl.html).
  */
-odoo.define("oacc_portal_overview_cdc.canvas", function (require) {
+odoo.define("oacc_portal_overview_cdc.operation_chart", function (require) {
     "use strict";
 
+    const { loadJS } = require("@web/core/assets");
     var publicWidget = require("web.public.widget");
 
-    publicWidget.registry.oaccPortalOverviewCdc = publicWidget.Widget.extend({
-        jsLibs: [
-            "/web/static/lib/Chart/Chart.js",
-            "/oacc_portal_overview_cdc/static/src/js/lib/chartjs-plugin-datalabels.min.js",
-        ],
-        selector: ".oe_website_canvas",
+    publicWidget.registry.OaccOperationChart = publicWidget.Widget.extend({
+        selector: ".operation_chart",
         events: {
             "click .btn-period": "_onBtnPeriodClick",
             "click #previous-period": "_onPreviousPeriod",
@@ -26,7 +23,7 @@ odoo.define("oacc_portal_overview_cdc.canvas", function (require) {
         init: function () {
             this._super.apply(this, arguments);
 
-            this.operation = $(".oe_website_canvas").data("id");
+            this.operation = $(".operation_chart").data("id");
 
             this.scale = null;
             this.minDate = null;
@@ -65,6 +62,17 @@ odoo.define("oacc_portal_overview_cdc.canvas", function (require) {
             });
             return Promise.all([this._super.apply(this, arguments), def]);
         },
+
+        willStart: async function () {
+            await loadJS("/web/static/lib/Chart/Chart.js");
+            await loadJS(
+                "/oacc_portal_overview_cdc/static/src/js/lib/chartjs-plugin-datalabels.min.js"
+            );
+            await loadJS(
+                "/oacc_portal_overview_cdc/static/lib/daterangepicker/daterangepicker.js"
+            );
+        },
+
         /**
          * @override
          */
diff --git a/templates/operation_templates_page.xml b/templates/operation_templates_page.xml
index 698c9bb7525e4c8765f9756faaa6ac3a6b3507eb..0600025b26ef9b9ecf7e16c36b6e8787d80a1273 100644
--- a/templates/operation_templates_page.xml
+++ b/templates/operation_templates_page.xml
@@ -8,7 +8,7 @@
         <t t-call="oacc_portal.layout_op">
             <t t-set="type_data" t-value="'pmo'" />
             <div
-                class="oe_website_canvas mb-5"
+                class="operation_chart mb-5"
                 t-att-data-name="type_data"
                 t-att-data-id="operation.id"
             >
@@ -42,7 +42,7 @@
         <t t-call="oacc_portal.layout_op">
             <t t-set="type_data" t-value="'cons'" />
             <div
-                class="mb-5 oe_website_canvas"
+                class="operation_chart mb-5"
                 t-att-data-name="type_data"
                 t-att-data-id="operation.id"
             >
@@ -69,7 +69,7 @@
         <t t-call="oacc_portal.layout_op">
             <t t-set="type_data" t-value="'prod'" />
             <div
-                class="mb-5 oe_website_canvas"
+                class="operation_chart mb-5"
                 t-att-data-name="type_data"
                 t-att-data-id="operation.id"
             >