chore: update dependencies and do tree shaking (#292)

package.json

@@ -85,8 +85,8 @@
     "@types/passport-jwt": "^4.0.1",
     "@types/supertest": "^6.0.2",
     "@types/uuid": "^10.0.0",
-    "@typescript-eslint/eslint-plugin": "^8.19.0",
-    "@typescript-eslint/parser": "^8.19.0",
+    "@typescript-eslint/eslint-plugin": "^8.19.1",
+    "@typescript-eslint/parser": "^8.19.1",
     "eslint": "^9.17.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.1",
@@ -99,7 +99,7 @@
     "ts-node": "^10.9.2",
     "tsconfig-paths": "^4.2.0",
     "typescript": "^5.6.3",
-    "typescript-eslint": "^8.19.0"
+    "typescript-eslint": "^8.19.1"
   },
   "jest": {
     "moduleFileExtensions": [

ui/package.json

@@ -50,6 +50,6 @@
     "karma-coverage": "^2.2.1",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "^2.1.0",
-    "typescript": "^5.5.4"
+    "typescript": "^5.6.3"
   }
 }

ui/src/app/graph/echarts/echarts.component.ts

@@ -8,7 +8,12 @@ import {
   Inject,
 } from '@angular/core';
 import { AsyncPipe } from '@angular/common';
-import { ECharts, EChartsOption } from 'echarts';
+import { ECharts, EChartsCoreOption } from 'echarts/core';
+import * as echarts from 'echarts/core';
+// import necessary echarts components
+import { GraphChart } from 'echarts/charts';
+import { LegendComponent, TooltipComponent } from 'echarts/components';
+import { CanvasRenderer } from 'echarts/renderers';
 import { NgxEchartsDirective, provideEchartsCore } from 'ngx-echarts';
 import {
   BehaviorSubject,
@@ -25,12 +30,14 @@ import { PreferencesService } from '../../preferences.service';
 import { CollectionConfigDto } from '../../service/persistence/dto/collection-config.dto';
 import { CONFIG_ARR } from '../../app-initialize.factory';
 
+echarts.use([GraphChart, LegendComponent, TooltipComponent, CanvasRenderer]);
+
 @Component({
   selector: 'app-echarts',
   templateUrl: './echarts.component.html',
   styleUrls: ['./echarts.component.scss'],
   imports: [NgxEchartsDirective, AsyncPipe],
-  providers: [provideEchartsCore({ echarts: () => import('echarts') })],
+  providers: [provideEchartsCore({ echarts })],
 })
 export class EchartsComponent implements OnInit {
   @Input() dataConfig!: Observable<GraphDataConfig>;
@@ -39,8 +46,8 @@ export class EchartsComponent implements OnInit {
     name: string;
     selected: boolean;
   }>();
-  options!: EChartsOption;
-  updateOptions!: Observable<EChartsOption>;
+  options!: EChartsCoreOption;
+  updateOptions!: Observable<EChartsCoreOption>;
   loading!: boolean;
   echartsInstance: ECharts | undefined;
   private triggerRefresh = new BehaviorSubject(true);
@@ -126,7 +133,7 @@ export class EchartsComponent implements OnInit {
           zoom: 2,
         },
       ],
-    } as EChartsOption;
+    } as EChartsCoreOption;
     this.updateOptions = this.triggerRefresh.pipe(
       takeUntil(this.ngUnsubscribe),
       switchMap(() => this.dataConfig),
@@ -188,7 +195,7 @@ export class EchartsComponent implements OnInit {
                 }),
             },
           ],
-        } as EChartsOption;
+        } as EChartsCoreOption;
       }),
       // tap((v) => {
       //   console.log(v);