From a1c70df410157590bd1f372a3f01a98ad78c6980 Mon Sep 17 00:00:00 2001
From: ulysse <ulysse@alenvi.io>
Date: Tue, 23 Apr 2024 11:35:46 +0200
Subject: [PATCH 1/4] COM-3697: update chart.js

---
 package-lock.json | 19 +++++++++++++++----
 package.json      |  2 +-
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f9fee3959f..fa6a96b381 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
         "@vuelidate/validators": "~2.0.4",
         "axios": "~1.6.7",
         "bignumber.js": "~9.1.2",
-        "chart.js": "~3.8.0",
+        "chart.js": "~4.4.2",
         "connect-history-api-fallback": "~2.0.0",
         "date-holidays": "~3.23.7",
         "dotenv": "~16.4.1",
@@ -3162,6 +3162,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/@nicolo-ribaudo/eslint-scope-5-internals": {
       "version": "5.1.1-v1",
       "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz",
@@ -7405,9 +7410,15 @@
       "dev": true
     },
     "node_modules/chart.js": {
-      "version": "3.8.2",
-      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.8.2.tgz",
-      "integrity": "sha512-7rqSlHWMUKFyBDOJvmFGW2lxULtcwaPLegDjX/Nu5j6QybY+GCiQkEY+6cqHw62S5tcwXMD8Y+H5OBGoR7d+ZQ=="
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.4.2.tgz",
+      "integrity": "sha512-6GD7iKwFpP5kbSD4MeRRRlTnQvxfQREy36uEtm1hzHzcOqwWx0YEHuspuoNlslu+nciLIB7fjjsHkUv/FzFcOg==",
+      "dependencies": {
+        "@kurkle/color": "^0.3.0"
+      },
+      "engines": {
+        "pnpm": ">=8"
+      }
     },
     "node_modules/check-more-types": {
       "version": "2.24.0",
diff --git a/package.json b/package.json
index 8a315b890e..064527673e 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "@vuelidate/validators": "~2.0.4",
     "axios": "~1.6.7",
     "bignumber.js": "~9.1.2",
-    "chart.js": "~3.8.0",
+    "chart.js": "~4.4.2",
     "connect-history-api-fallback": "~2.0.0",
     "date-holidays": "~3.23.7",
     "dotenv": "~16.4.1",

From 2c5bc8f6eeb3bba43888463123fc82f4e34f35eb Mon Sep 17 00:00:00 2001
From: ulysse <ulysse@alenvi.io>
Date: Tue, 23 Apr 2024 12:17:58 +0200
Subject: [PATCH 2/4] COM-3697: fix dependency

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index fa6a96b381..f3ee87eb0f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21398,7 +21398,7 @@
         "lodash-es": "latest"
       },
       "peerDependencies": {
-        "chart.js": "=> ^3.1.0",
+        "chart.js": "=> ~4.4.2",
         "vue": ">= 3"
       }
     },

From 981f74262a15579675c4780eec6b3b427b66aee1 Mon Sep 17 00:00:00 2001
From: ulysse <ulysse@alenvi.io>
Date: Thu, 25 Apr 2024 10:18:21 +0200
Subject: [PATCH 3/4] COM-3697: replace vue-chart-3

---
 package-lock.json                        | 25 +++++++-----------------
 package.json                             |  2 +-
 src/core/components/charts/LineChart.vue | 10 +++++-----
 3 files changed, 13 insertions(+), 24 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f3ee87eb0f..50724373e5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -32,7 +32,7 @@
         "quasar": "~2.13.1",
         "vue": "~3.4.19",
         "vue-advanced-cropper": "~2.8.1",
-        "vue-chart-3": "~3.1.8",
+        "vue-chartjs": "~5.3.1",
         "vue-router": "~4.2.5",
         "vuedraggable": "~4.1.0",
         "vuelidate": "~0.7.6",
@@ -14967,11 +14967,6 @@
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
-    "node_modules/lodash-es": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
-      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
-    },
     "node_modules/lodash._reinterpolate": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
@@ -21387,19 +21382,13 @@
         "vue": "^3.0.0"
       }
     },
-    "node_modules/vue-chart-3": {
-      "version": "3.1.8",
-      "resolved": "https://registry.npmjs.org/vue-chart-3/-/vue-chart-3-3.1.8.tgz",
-      "integrity": "sha512-zX5ajjQi/PocEqLETlej3vp92q/tnI/Fvu2RVb++Kap8qOrXu6PXCpodi73BFrWzEGZIAnqoUxC3OIkRWD657g==",
-      "dependencies": {
-        "@vue/runtime-core": "latest",
-        "@vue/runtime-dom": "latest",
-        "csstype": "latest",
-        "lodash-es": "latest"
-      },
+    "node_modules/vue-chartjs": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/vue-chartjs/-/vue-chartjs-5.3.1.tgz",
+      "integrity": "sha512-rZjqcHBxKiHrBl0CIvcOlVEBwRhpWAVf6rDU3vUfa7HuSRmGtCslc0Oc8m16oAVuk0erzc1FCtH1VCriHsrz+A==",
       "peerDependencies": {
-        "chart.js": "=> ~4.4.2",
-        "vue": ">= 3"
+        "chart.js": "^4.1.1",
+        "vue": "^3.0.0-0 || ^2.7.0"
       }
     },
     "node_modules/vue-component-type-helpers": {
diff --git a/package.json b/package.json
index 064527673e..46d14c98dd 100644
--- a/package.json
+++ b/package.json
@@ -39,7 +39,7 @@
     "quasar": "~2.13.1",
     "vue": "~3.4.19",
     "vue-advanced-cropper": "~2.8.1",
-    "vue-chart-3": "~3.1.8",
+    "vue-chartjs": "~5.3.1",
     "vue-router": "~4.2.5",
     "vuedraggable": "~4.1.0",
     "vuelidate": "~0.7.6",
diff --git a/src/core/components/charts/LineChart.vue b/src/core/components/charts/LineChart.vue
index 3827470de6..793d4e28f9 100644
--- a/src/core/components/charts/LineChart.vue
+++ b/src/core/components/charts/LineChart.vue
@@ -2,7 +2,7 @@
   <div>
     <q-card flat class="q-pa-md">
       <div class="text-weight-bold q-mb-md">{{ title }}</div>
-      <vue-chart-line-chart v-bind="lineChartProps" class="line-chart" />
+      <vue-chart-line-chart :options="options" :data="chartData" class="line-chart" />
     </q-card>
   </div>
 </template>
@@ -10,7 +10,7 @@
 <script>
 import { getCssVar } from 'quasar';
 import { toRefs, computed } from 'vue';
-import { LineChart as VueChartLineChart, useLineChart } from 'vue-chart-3';
+import { Line as VueChartLineChart } from 'vue-chartjs';
 import { Chart, registerables } from 'chart.js';
 
 Chart.register(...registerables);
@@ -48,10 +48,10 @@ export default {
       maintainAspectRatio: false,
     }));
 
-    const { lineChartProps } = useLineChart({ options, chartData });
-
     return {
-      lineChartProps,
+      // Computed
+      options,
+      chartData,
     };
   },
 };

From 4718ef0040b5272bda8c4625d162f633f66b4adc Mon Sep 17 00:00:00 2001
From: ulysse <ulysse@alenvi.io>
Date: Thu, 25 Apr 2024 19:08:59 +0200
Subject: [PATCH 4/4] COM-3697: formatQuantity

---
 src/core/components/courses/ProfileFollowUp.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/core/components/courses/ProfileFollowUp.vue b/src/core/components/courses/ProfileFollowUp.vue
index 434f9dd526..b8aede229c 100644
--- a/src/core/components/courses/ProfileFollowUp.vue
+++ b/src/core/components/courses/ProfileFollowUp.vue
@@ -8,11 +8,11 @@
           <div class="self-center justify-center column learners-data">
             <div class="row items-center">
               <ni-e-learning-indicator :indicator="traineesOnGoingCount" class="q-pr-sm" />
-              <div>apprenant{{ traineesOnGoingCount > 1 ? 's' : '' }} en cours</div>
+              <div>{{ formatQuantity('apprenant',traineesOnGoingCount, 's', false) }} en cours</div>
             </div>
             <div class="row items-center">
               <ni-e-learning-indicator :indicator="traineesFinishedCount" class="q-pr-sm" />
-              <div>apprenant{{ traineesFinishedCount > 1 ? 's' : '' }} ayant terminé</div>
+              <div>{{ formatQuantity('apprenant', traineesFinishedCount, 's', false) }} ayant terminé</div>
             </div>
           </div>
         </q-card>
@@ -33,6 +33,7 @@ import { useTraineeFollowUp } from '@composables/traineeFollowUp';
 import { useCharts } from '@composables/charts';
 import CompaniDate from '@helpers/dates/companiDates';
 import { MONTH, DAY } from '@data/constants';
+import { formatQuantity } from '@helpers/utils';
 
 export default {
   name: 'ProfileFollowUp',
@@ -85,6 +86,7 @@ export default {
       traineesOnGoingCount,
       traineesFinishedCount,
       // Methods
+      formatQuantity,
     };
   },
 };