From 63c14f9544d686c07410dfa2ca9f71351f584912 Mon Sep 17 00:00:00 2001
From: Herculino Trotta <netotrotta@gmail.com>
Date: Tue, 29 Oct 2024 21:30:49 -0300
Subject: [PATCH] feat: properly install chart.js as npm package and webpack
 bundle

---
 app/templates/includes/scripts.html |  2 +-
 frontend/package-lock.json          | 17 +++++++++++++++++
 frontend/package.json               |  1 +
 frontend/src/application/charts.js  |  2 ++
 4 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/application/charts.js

diff --git a/app/templates/includes/scripts.html b/app/templates/includes/scripts.html
index 90b6f69..d9f65ba 100644
--- a/app/templates/includes/scripts.html
+++ b/app/templates/includes/scripts.html
@@ -12,7 +12,7 @@
 {% include 'includes/scripts/hyperscript/swal.html' %}
 
 {% javascript_pack 'htmx' attrs="defer" %}
-<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+{% javascript_pack 'charts' %}
 
 <script>
 let tz = Intl.DateTimeFormat().resolvedOptions().timeZone;
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 99beeee..345d243 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -22,6 +22,7 @@
         "autosize": "^6.0.1",
         "babel-loader": "^8.2.3",
         "bootstrap": "^5.3.3",
+        "chart.js": "^4.4.6",
         "clean-webpack-plugin": "^4.0.0",
         "copy-webpack-plugin": "^11.0.0",
         "core-js": "^3.20.3",
@@ -2182,6 +2183,11 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@kurkle/color": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.2.tgz",
+      "integrity": "sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw=="
+    },
     "node_modules/@leichtgewicht/ip-codec": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
@@ -3198,6 +3204,17 @@
         "node": ">=4"
       }
     },
+    "node_modules/chart.js": {
+      "version": "4.4.6",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.4.6.tgz",
+      "integrity": "sha512-8Y406zevUPbbIBA/HRk33khEmQPk5+cxeflWE/2rx1NJsjVWMPw/9mSP9rxHP5eqi6LNoPBVMfZHxbwLSgldYA==",
+      "dependencies": {
+        "@kurkle/color": "^0.3.0"
+      },
+      "engines": {
+        "pnpm": ">=8"
+      }
+    },
     "node_modules/chokidar": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 9fed6f5..f530de9 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -35,6 +35,7 @@
     "autosize": "^6.0.1",
     "babel-loader": "^8.2.3",
     "bootstrap": "^5.3.3",
+    "chart.js": "^4.4.6",
     "clean-webpack-plugin": "^4.0.0",
     "copy-webpack-plugin": "^11.0.0",
     "core-js": "^3.20.3",
diff --git a/frontend/src/application/charts.js b/frontend/src/application/charts.js
new file mode 100644
index 0000000..7ccc9d9
--- /dev/null
+++ b/frontend/src/application/charts.js
@@ -0,0 +1,2 @@
+import Chart from 'chart.js/auto';
+window.Chart = Chart;