From 53f54182753f9400488acf5af4f60577caba5054 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torjus=20H=C3=A5kestad?= <torjus.hakestad@usit.uio.no>
Date: Sat, 10 Apr 2021 17:55:32 +0200
Subject: [PATCH] Change chart usage

---
 web/frontend/package.json                |  1 +
 web/frontend/src/components/StatsPie.vue |  5 +++--
 web/frontend/yarn.lock                   | 12 ++++++++++++
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/web/frontend/package.json b/web/frontend/package.json
index cdf8679..1178e2e 100644
--- a/web/frontend/package.json
+++ b/web/frontend/package.json
@@ -26,6 +26,7 @@
     "vue-router": "^3.5.1"
   },
   "devDependencies": {
+    "@types/chart.js": "^2.9.32",
     "@types/d3": "^6.3.0",
     "@types/faker": "^5.5.1",
     "@types/randomcolor": "^0.5.5",
diff --git a/web/frontend/src/components/StatsPie.vue b/web/frontend/src/components/StatsPie.vue
index c3e7e7e..08150bb 100644
--- a/web/frontend/src/components/StatsPie.vue
+++ b/web/frontend/src/components/StatsPie.vue
@@ -52,11 +52,13 @@
 import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
 import { StatResult } from '@/apiary/apiary';
 import axios from 'axios';
-import Chart from 'chart.js/auto';
+import { Chart, ArcElement, Legend, DoughnutController, Title } from 'chart.js';
 import randomColor from 'randomcolor';
 
 export type StatType = 'username' | 'password' | 'ip' | 'country' | 'total';
 
+Chart.register(ArcElement, Legend, DoughnutController, Title);
+
 @Component
 export default class StatsPie extends Vue {
   @Prop() private statType!: StatType;
@@ -161,7 +163,6 @@ export default class StatsPie extends Vue {
       type: 'doughnut',
       data: {
         labels: headers,
-        options: {},
         datasets: [
           {
             data: values,
diff --git a/web/frontend/yarn.lock b/web/frontend/yarn.lock
index 29730c0..3279b63 100644
--- a/web/frontend/yarn.lock
+++ b/web/frontend/yarn.lock
@@ -988,6 +988,13 @@
     "@types/connect" "*"
     "@types/node" "*"
 
+"@types/chart.js@^2.9.32":
+  version "2.9.32"
+  resolved "https://registry.yarnpkg.com/@types/chart.js/-/chart.js-2.9.32.tgz#b17d9a8c41ad348183a2ce041ebdeef892998251"
+  integrity sha512-d45JiRQwEOlZiKwukjqmqpbqbYzUX2yrXdH9qVn6kXpPDsTYCo6YbfFOlnUaJ8S/DhJwbBJiLsMjKpW5oP8B2A==
+  dependencies:
+    moment "^2.10.2"
+
 "@types/connect-history-api-fallback@*":
   version "1.3.4"
   resolved "https://registry.yarnpkg.com/@types/connect-history-api-fallback/-/connect-history-api-fallback-1.3.4.tgz#8c0f0e6e5d8252b699f5a662f51bdf82fd9d8bb8"
@@ -6632,6 +6639,11 @@ mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.5, mkdirp@~0.5.1:
   dependencies:
     minimist "^1.2.5"
 
+moment@^2.10.2:
+  version "2.29.1"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
+  integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
+
 move-concurrently@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"