Update chartJS

Gemfile

@@ -57,7 +57,7 @@ gem "google-protobuf", "~> 3.23.4"
 gem "lograge", "~> 0.13.0"
 
 # Dependency for rails
-gem "nokogiri", ">= 1.14.3"
+gem "nokogiri", ">= 1.15.4"
 
 # Open Graph tag
 gem "meta-tags", "~> 2.19.0"

Gemfile.lock

@@ -761,7 +761,7 @@ DEPENDENCIES
   minitest-retry
   mocha
   newrelic_rpm (~> 9.3.1)
-  nokogiri (>= 1.14.3)
+  nokogiri (>= 1.15.4)
   omniauth-github (~> 2.0.1)
   omniauth-google-oauth2 (~> 1.1.1)
   omniauth-rails_csrf_protection (~> 1.0.1)

app/javascript/admin/stats/index.js

@@ -1,4 +1,4 @@
-import Chart from 'chart.js';
+import { Chart } from 'chart.js';
 
 let colors = [
   '255, 99, 132',

app/javascript/packs/chart/Chart.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import moment from "moment";
-import Chart from "chart.js";
+import  { Chart } from "chart.js";
 
 export default class ReactChart extends React.Component {
   constructor(props) {

app/javascript/views/admin/payments/components/currentChart/CurrentChart.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import Chart from "chart.js";
+import { Chart, ChartType } from "chart.js"
 import Card from "../../../../../components/card/Card";
 
 interface ICurrentChartProps {
@@ -44,7 +44,7 @@ export default class CurrentChart extends React.Component<
         legend: { display: false },
         responsive: false
       },
-      type: "doughnut"
+      type: "doughnut" as ChartType
     };
 
     const myChart = new Chart(node, currentChartSettings);

app/javascript/views/admin/payments/components/earningsChart/EarningsChart.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import Chart from "chart.js";
+import { Chart, ChartType } from "chart.js";
 import Card from "../../../../../components/card/Card";
 
 interface IEarningsChartProps {
@@ -91,15 +91,15 @@ export default class EarningsChart extends React.Component<
           display: false
         },
         scales: {
-          yAxes: [
+          y:
             {
               display: false,
               stacked: true
             }
-          ]
+
         }
       },
-      type: "line"
+      type: "line" as ChartType
     };
 
     const myChart = new Chart(node, referralChartSettings);

package.json

@@ -68,7 +68,7 @@
     "babel-loader": "9.1.3",
     "brave-ui": "git+https://github.com/brave/brave-ui#11019732ef5fc09a75bae371c3f3ffece651d97c",
     "bs58": "5.0.0",
-    "chart.js": "^2.7.2",
+    "chart.js": "4.4.0",
     "clipboard": "^2.0.11",
     "compression-webpack-plugin": "10",
     "css-loader": "^6.8.1",

yarn.lock

@@ -1846,6 +1846,11 @@
     "@jridgewell/resolve-uri" "^3.1.0"
     "@jridgewell/sourcemap-codec" "^1.4.14"
 
+"@kurkle/color@^0.3.0":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@kurkle/color/-/color-0.3.2.tgz#5acd38242e8bde4f9986e7913c8fdf49d3aa199f"
+  integrity sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw==
+
 "@leichtgewicht/ip-codec@^2.0.1":
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz#b2ac626d6cb9c8718ab459166d4bb405b8ffa78b"
@@ -3865,28 +3870,12 @@ chalk@^4.0, chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.2:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
-chart.js@^2.7.2:
-  version "2.9.4"
-  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.4.tgz#0827f9563faffb2dc5c06562f8eb10337d5b9684"
-  integrity sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==
-  dependencies:
-    chartjs-color "^2.1.0"
-    moment "^2.10.2"
-
-chartjs-color-string@^0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
-  integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
-  dependencies:
-    color-name "^1.0.0"
-
-chartjs-color@^2.1.0:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
-  integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
+[email protected]:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-4.4.0.tgz#df843fdd9ec6bd88d7f07e2b95348d221bd2698c"
+  integrity sha512-vQEj6d+z0dcsKLlQvbKIMYFHd3t8W/7L2vfJIbYcfyPcRx92CsHqECpueN8qVGNlKyDcr5wBrYAYKnfu/9Q1hQ==
   dependencies:
-    chartjs-color-string "^0.6.0"
-    color-convert "^1.9.3"
+    "@kurkle/color" "^0.3.0"
 
 cheerio-select@^2.1.0:
   version "2.1.0"
@@ -7856,7 +7845,7 @@ mkdirp@^1.0.3, mkdirp@^1.0.4:
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
   integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
 
-moment@^2.10.2, moment@^2.29.4:
+moment@^2.29.4:
   version "2.29.4"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz#3dbe052889fe7c1b2ed966fcb3a77328964ef108"
   integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==