From 59f84aa46f83d6a32b93d99bee7c5adece395b6d Mon Sep 17 00:00:00 2001 From: Ken Tandrian <60643640+KenTandrian@users.noreply.github.com> Date: Sun, 19 Jan 2025 15:32:14 +0700 Subject: [PATCH] Feature/upgrade chart.js dependencies to the latest versions (#4209) * chore(deps): bump chartjs-chart-treemap from 2.3.1 to 3.1.0 * chore(deps): bump chartjs-plugin-annotation from 2.1.2 to 3.1.0 * chore(deps): bump chart.js from 4.2.0 to 4.4.7 * fix(ts): reinforce chart type safety * Update changelog --- CHANGELOG.md | 3 ++ .../portfolio-proportion-chart.component.ts | 8 +++--- .../treemap-chart/treemap-chart.component.ts | 2 +- package-lock.json | 28 +++++++++---------- package.json | 6 ++-- 5 files changed, 25 insertions(+), 22 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index bbcbeb7db..8d3a23dc4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Extended the asset profile data in the _Financial Modeling Prep_ service - Extended the search by `isin` in the _Financial Modeling Prep_ service - Switched to _ESLint_’s flat config format +- Upgraded `chart.js` from version `4.2.0` to `4.4.7` +- Upgraded `chartjs-chart-treemap` from version `2.3.1` to `3.1.0` +- Upgraded `chartjs-plugin-annotation` from version `2.1.2` to `3.1.0` - Upgraded `eslint` dependencies ## 2.134.0 - 2025-01-15 diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts index 7f914870b..6319c3cd7 100644 --- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts +++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts @@ -77,7 +77,7 @@ export class GfPortfolioProportionChartComponent @ViewChild('chartCanvas') chartCanvas: ElementRef; - public chart: Chart<'pie'>; + public chart: Chart<'doughnut'>; public isLoading = true; private readonly OTHER_KEY = 'OTHER'; @@ -257,7 +257,7 @@ export class GfPortfolioProportionChartComponent }); }); - const datasets: ChartConfiguration['data']['datasets'] = [ + const datasets: ChartConfiguration<'doughnut'>['data']['datasets'] = [ { backgroundColor: chartDataSorted.map(([, item]) => { return item.color; @@ -295,7 +295,7 @@ export class GfPortfolioProportionChartComponent datasets[1].data[1] = Number.MAX_SAFE_INTEGER; } - const data: ChartConfiguration['data'] = { + const data: ChartConfiguration<'doughnut'>['data'] = { datasets, labels }; @@ -308,7 +308,7 @@ export class GfPortfolioProportionChartComponent ) as unknown; this.chart.update(); } else { - this.chart = new Chart(this.chartCanvas.nativeElement, { + this.chart = new Chart<'doughnut'>(this.chartCanvas.nativeElement, { data, options: { animation: false, diff --git a/libs/ui/src/lib/treemap-chart/treemap-chart.component.ts b/libs/ui/src/lib/treemap-chart/treemap-chart.component.ts index 11ee026f5..4c3167c9e 100644 --- a/libs/ui/src/lib/treemap-chart/treemap-chart.component.ts +++ b/libs/ui/src/lib/treemap-chart/treemap-chart.component.ts @@ -196,7 +196,7 @@ export class GfTreemapChartComponent min: Math.min(...negativeNetPerformancePercents) }; - const data: ChartConfiguration['data'] = { + const data: ChartConfiguration<'treemap'>['data'] = { datasets: [ { backgroundColor: (ctx) => { diff --git a/package-lock.json b/package-lock.json index 34891a9b9..3eeef5dac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -50,10 +50,10 @@ "bull": "4.16.2", "cache-manager": "5.7.6", "cache-manager-redis-yet": "5.1.4", - "chart.js": "4.2.0", + "chart.js": "4.4.7", "chartjs-adapter-date-fns": "3.0.0", - "chartjs-chart-treemap": "2.3.1", - "chartjs-plugin-annotation": "2.1.2", + "chartjs-chart-treemap": "3.1.0", + "chartjs-plugin-annotation": "3.1.0", "chartjs-plugin-datalabels": "2.2.0", "cheerio": "1.0.0", "class-transformer": "0.5.1", @@ -14308,15 +14308,15 @@ "license": "MIT" }, "node_modules/chart.js": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.2.0.tgz", - "integrity": "sha512-wbtcV+QKeH0F7gQZaCJEIpsNriFheacouJQTVIjITi3eQA8bTlIBoknz0+dgV79aeKLNMAX+nDslIVE/nJ3rzA==", + "version": "4.4.7", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.4.7.tgz", + "integrity": "sha512-pwkcKfdzTMAU/+jNosKhNL2bHtJc/sSmYgVbuGTEDhzkrhmyihmP7vUc/5ZK9WopidMDHNe3Wm7jOd/WhuHWuw==", "license": "MIT", "dependencies": { "@kurkle/color": "^0.3.0" }, "engines": { - "pnpm": "^7.0.0" + "pnpm": ">=8" } }, "node_modules/chartjs-adapter-date-fns": { @@ -14330,21 +14330,21 @@ } }, "node_modules/chartjs-chart-treemap": { - "version": "2.3.1", - "resolved": "https://registry.npmjs.org/chartjs-chart-treemap/-/chartjs-chart-treemap-2.3.1.tgz", - "integrity": "sha512-GW+iODLICIJhNZtHbTtaOjCwRIxmXcquXRKDFMsrkXyqyDeSN1aiVfzNNj6Xjy55soopqRA+YfHqjT2S2zF7lQ==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/chartjs-chart-treemap/-/chartjs-chart-treemap-3.1.0.tgz", + "integrity": "sha512-0LJxj4J9sCTHmrXCFlqtoBKMJDcS7VzFeRgNBRZRwU1QSpCXJKTNk5TysPEs5/YW0XYvZoN8u44RqqLf0pAzQw==", "license": "MIT", "peerDependencies": { "chart.js": ">=3.0.0" } }, "node_modules/chartjs-plugin-annotation": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/chartjs-plugin-annotation/-/chartjs-plugin-annotation-2.1.2.tgz", - "integrity": "sha512-kmEp2WtpogwnKKnDPO3iO3mVwvVGtmG5BkZVtAEZm5YzJ9CYxojjYEgk7OTrFbJ5vU098b84UeJRe8kRfNcq5g==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/chartjs-plugin-annotation/-/chartjs-plugin-annotation-3.1.0.tgz", + "integrity": "sha512-EkAed6/ycXD/7n0ShrlT1T2Hm3acnbFhgkIEJLa0X+M6S16x0zwj1Fv4suv/2bwayCT3jGPdAtI9uLcAMToaQQ==", "license": "MIT", "peerDependencies": { - "chart.js": ">=3.7.0" + "chart.js": ">=4.0.0" } }, "node_modules/chartjs-plugin-datalabels": { diff --git a/package.json b/package.json index 660efb315..e903b334a 100644 --- a/package.json +++ b/package.json @@ -96,10 +96,10 @@ "bull": "4.16.2", "cache-manager": "5.7.6", "cache-manager-redis-yet": "5.1.4", - "chart.js": "4.2.0", + "chart.js": "4.4.7", "chartjs-adapter-date-fns": "3.0.0", - "chartjs-chart-treemap": "2.3.1", - "chartjs-plugin-annotation": "2.1.2", + "chartjs-chart-treemap": "3.1.0", + "chartjs-plugin-annotation": "3.1.0", "chartjs-plugin-datalabels": "2.2.0", "cheerio": "1.0.0", "class-transformer": "0.5.1",