This is an automated email from the ASF dual-hosted git repository.

zehnder pushed a commit to branch 
4287-migrate-angular-ui-from-constructor-injection-to-inject
in repository https://gitbox.apache.org/repos/asf/streampipes.git

commit 353f1bdb1fbf2aa89cb5a9e36ab3c0f01a8a8c31
Author: Philipp Zehnder <[email protected]>
AuthorDate: Tue Mar 24 09:59:53 2026 +0100

    migrate chart shared UI to inject()
---
 .../color-mapping-options-config.component.ts      |  5 +++--
 .../echarts-widget-appearance-config.component.ts  |  8 +++----
 .../select-color-properties-config.component.ts    | 15 ++++++++-----
 .../chart-container/chart-container.component.ts   | 25 ++++++++++-----------
 .../components/chart-container/chart.directive.ts  |  4 ++--
 .../gauge/config/gauge-widget-config.component.ts  | 10 ++++-----
 .../config/heatmap-widget-config.component.ts      | 10 ++++-----
 .../indicator-appearance-config.component.ts       |  8 +++----
 .../map/config/map-widget-config.component.ts      | 10 ++++-----
 .../config/pie-chart-widget-config.component.ts    | 10 ++++-----
 .../status-heatmap-widget-config.component.ts      | 10 ++++-----
 .../config/status-widget-config.component.ts       | 10 ++++-----
 .../table/config/table-widget-config.component.ts  | 10 ++++-----
 .../charts/table/table-widget.component.ts         | 14 +++++++-----
 .../time-series-appearance-config.component.ts     |  8 +++----
 .../time-series-chart-widget-config.component.ts   | 10 ++++-----
 .../traffic-light-widget-config.component.ts       |  8 +++----
 .../registry/chart-registry.service.ts             | 26 +++++++++++-----------
 .../chart-shared/services/chart-routing.service.ts |  6 ++---
 19 files changed, 105 insertions(+), 102 deletions(-)

diff --git 
a/ui/src/app/chart-shared/components/chart-config/color-mapping-options-config/color-mapping-options-config.component.ts
 
b/ui/src/app/chart-shared/components/chart-config/color-mapping-options-config/color-mapping-options-config.component.ts
index 8990edfa7a..03380eddb0 100644
--- 
a/ui/src/app/chart-shared/components/chart-config/color-mapping-options-config/color-mapping-options-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/chart-config/color-mapping-options-config/color-mapping-options-config.component.ts
@@ -24,6 +24,7 @@ import {
     OnInit,
     Output,
     SimpleChanges,
+    inject,
 } from '@angular/core';
 import { ColorMappingService } from '../../../services/color-mapping.service';
 import { DataExplorerField } from '@streampipes/platform-services';
@@ -67,6 +68,8 @@ import { TranslatePipe } from '@ngx-translate/core';
     ],
 })
 export class ColorMappingOptionsConfigComponent implements OnInit, OnChanges {
+    private colorMappingService = inject(ColorMappingService);
+
     @Input() colorMapping: { value: string; label: string; color: string }[];
 
     @Input() selectedProperty: DataExplorerField;
@@ -86,8 +89,6 @@ export class ColorMappingOptionsConfigComponent implements 
OnInit, OnChanges {
     protected isSelectedPropertyBoolean: boolean;
     private wasPreviousFieldBoolean: boolean;
 
-    constructor(private colorMappingService: ColorMappingService) {}
-
     ngOnInit(): void {
         this.isSelectedPropertyBoolean = this.isBooleanPropertySelected();
         this.resetColorMappings();
diff --git 
a/ui/src/app/chart-shared/components/chart-config/echarts-widget-appearance-config/echarts-widget-appearance-config.component.ts
 
b/ui/src/app/chart-shared/components/chart-config/echarts-widget-appearance-config/echarts-widget-appearance-config.component.ts
index 238c48f884..5c5ab4da66 100644
--- 
a/ui/src/app/chart-shared/components/chart-config/echarts-widget-appearance-config/echarts-widget-appearance-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/chart-config/echarts-widget-appearance-config/echarts-widget-appearance-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, inject } from '@angular/core';
 import { WidgetEchartsAppearanceConfig } from 
'../../../models/dataview-dashboard.model';
 import { ChartConfigurationService } from 
'../../../services/chart-configuration.service';
 import { SplitSectionComponent } from '@streampipes/shared-ui';
@@ -30,13 +30,11 @@ import { TranslatePipe } from '@ngx-translate/core';
     imports: [SplitSectionComponent, MatCheckbox, FormsModule, TranslatePipe],
 })
 export class SpEchartsWidgetAppearanceConfigComponent implements OnInit {
+    private widgetConfigurationService = inject(ChartConfigurationService);
+
     @Input()
     appearanceConfig: WidgetEchartsAppearanceConfig;
 
-    constructor(
-        private widgetConfigurationService: ChartConfigurationService,
-    ) {}
-
     ngOnInit() {
         this.appearanceConfig.chartAppearance ??= {
             showLegend: true,
diff --git 
a/ui/src/app/chart-shared/components/chart-config/select-color-properties-config/select-color-properties-config.component.ts
 
b/ui/src/app/chart-shared/components/chart-config/select-color-properties-config/select-color-properties-config.component.ts
index 94b92b43d6..ffe177b5ba 100644
--- 
a/ui/src/app/chart-shared/components/chart-config/select-color-properties-config/select-color-properties-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/chart-config/select-color-properties-config/select-color-properties-config.component.ts
@@ -16,7 +16,14 @@
  *
  */
 
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import {
+    Component,
+    EventEmitter,
+    Input,
+    OnInit,
+    Output,
+    inject,
+} from '@angular/core';
 import { ChartConfigurationService } from 
'../../../services/chart-configuration.service';
 import { DataExplorerField } from '@streampipes/platform-services';
 import { TimeSeriesChartWidgetModel } from 
'../../charts/time-series-chart/model/time-series-chart-widget.model';
@@ -39,6 +46,8 @@ import { TranslatePipe } from '@ngx-translate/core';
     ],
 })
 export class SelectColorPropertiesConfigComponent implements OnInit {
+    protected widgetConfigurationService = inject(ChartConfigurationService);
+
     @Output() changeSelectedProperties: EventEmitter<DataExplorerField[]> =
         new EventEmitter();
 
@@ -46,10 +55,6 @@ export class SelectColorPropertiesConfigComponent implements 
OnInit {
     @Input() selectedProperties: DataExplorerField[];
     @Input() currentlyConfiguredWidget: TimeSeriesChartWidgetModel;
 
-    constructor(
-        protected widgetConfigurationService: ChartConfigurationService,
-    ) {}
-
     ngOnInit(): void {
         if (!this.selectedProperties) {
             this.selectedProperties = [];
diff --git 
a/ui/src/app/chart-shared/components/chart-container/chart-container.component.ts
 
b/ui/src/app/chart-shared/components/chart-container/chart-container.component.ts
index 735874318d..c35ee55b03 100644
--- 
a/ui/src/app/chart-shared/components/chart-container/chart-container.component.ts
+++ 
b/ui/src/app/chart-shared/components/chart-container/chart-container.component.ts
@@ -30,6 +30,7 @@ import {
     Output,
     SimpleChanges,
     ViewChild,
+    inject,
 } from '@angular/core';
 import {
     ClientDashboardItem,
@@ -109,6 +110,17 @@ import { TranslatePipe } from '@ngx-translate/core';
 export class ChartContainerComponent
     implements OnInit, OnDestroy, OnChanges, AfterViewInit
 {
+    private chartRegistryService = inject(ChartRegistry);
+    private dashboardService = inject(ChartSharedService);
+    private componentFactoryResolver = inject(ComponentFactoryResolver);
+    private widgetTypeService = inject(ChartTypeService);
+    private authService = inject(AuthService);
+    private currentUserService = inject(CurrentUserService);
+    private timeSelectionService = inject(TimeSelectionService);
+    private nameChangeService = inject(NameChangeService);
+    private el = inject<ElementRef<HTMLDivElement>>(ElementRef);
+    private resizeService = inject(ResizeService);
+
     @ViewChild('menuTrigger') menu: MatMenuTrigger;
     @ViewChild('timeSelectorMenu')
     timeSelectorMenu: TimeRangeSelectorMenuComponent;
@@ -194,19 +206,6 @@ export class ChartContainerComponent
 
     @ViewChild(ChartDirective, { static: true }) widgetHost!: ChartDirective;
 
-    constructor(
-        private chartRegistryService: ChartRegistry,
-        private dashboardService: ChartSharedService,
-        private componentFactoryResolver: ComponentFactoryResolver,
-        private widgetTypeService: ChartTypeService,
-        private authService: AuthService,
-        private currentUserService: CurrentUserService,
-        private timeSelectionService: TimeSelectionService,
-        private nameChangeService: NameChangeService,
-        private el: ElementRef<HTMLDivElement>,
-        private resizeService: ResizeService,
-    ) {}
-
     resizeObserver: ResizeObserver;
     resizeTimeout: any;
 
diff --git 
a/ui/src/app/chart-shared/components/chart-container/chart.directive.ts 
b/ui/src/app/chart-shared/components/chart-container/chart.directive.ts
index 5f9da6929f..aa50d8b914 100644
--- a/ui/src/app/chart-shared/components/chart-container/chart.directive.ts
+++ b/ui/src/app/chart-shared/components/chart-container/chart.directive.ts
@@ -16,9 +16,9 @@
  *
  */
 
-import { Directive, ViewContainerRef } from '@angular/core';
+import { Directive, ViewContainerRef, inject } from '@angular/core';
 
 @Directive({ selector: '[spWidgetHost]' })
 export class ChartDirective {
-    constructor(public viewContainerRef: ViewContainerRef) {}
+    viewContainerRef = inject(ViewContainerRef);
 }
diff --git 
a/ui/src/app/chart-shared/components/charts/gauge/config/gauge-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/gauge/config/gauge-widget-config.component.ts
index 5e1ac40b16..90af46b7b0 100644
--- 
a/ui/src/app/chart-shared/components/charts/gauge/config/gauge-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/gauge/config/gauge-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import { ChartFieldProviderService } from 
'../../../../services/chart-field-provider.service';
@@ -53,10 +53,10 @@ export class GaugeWidgetConfigComponent extends 
BaseWidgetConfig<
     GaugeWidgetModel,
     GaugeVisConfig
 > {
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/heatmap/config/heatmap-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/heatmap/config/heatmap-widget-config.component.ts
index 3ef1aa3781..c40a0f6234 100644
--- 
a/ui/src/app/chart-shared/components/charts/heatmap/config/heatmap-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/heatmap/config/heatmap-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import {
@@ -56,10 +56,10 @@ export class HeatmapWidgetConfigComponent extends 
BaseWidgetConfig<
     HeatmapWidgetModel,
     HeatmapVisConfig
 > {
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/indicator/appearance-config/indicator-appearance-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/indicator/appearance-config/indicator-appearance-config.component.ts
index ceaf45c7e3..d7f05fe5d7 100644
--- 
a/ui/src/app/chart-shared/components/charts/indicator/appearance-config/indicator-appearance-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/indicator/appearance-config/indicator-appearance-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, inject } from '@angular/core';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import { IndicatorAppearanceConfig } from 
'../model/indicator-chart-widget.model';
 import {
@@ -43,13 +43,11 @@ import { TranslatePipe } from '@ngx-translate/core';
     ],
 })
 export class IndicatorAppearanceConfigComponent implements OnInit {
+    private widgetConfigurationService = inject(ChartConfigurationService);
+
     @Input()
     appearanceConfig: IndicatorAppearanceConfig;
 
-    constructor(
-        private widgetConfigurationService: ChartConfigurationService,
-    ) {}
-
     ngOnInit(): void {
         this.ensureAppearanceConfig();
     }
diff --git 
a/ui/src/app/chart-shared/components/charts/map/config/map-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/map/config/map-widget-config.component.ts
index 30c8f1836d..9f80242c75 100644
--- 
a/ui/src/app/chart-shared/components/charts/map/config/map-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/map/config/map-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import { ChartFieldProviderService } from 
'../../../../services/chart-field-provider.service';
@@ -67,10 +67,10 @@ export class MapWidgetConfigComponent extends 
BaseWidgetConfig<
     markerOrTrace: string[];
     markerType: string[];
 
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/pie/config/pie-chart-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/pie/config/pie-chart-widget-config.component.ts
index 21ada175d1..6e01a2e153 100644
--- 
a/ui/src/app/chart-shared/components/charts/pie/config/pie-chart-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/pie/config/pie-chart-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import {
     PieChartVisConfig,
@@ -60,10 +60,10 @@ export class SpPieChartWidgetConfigComponent extends 
BaseWidgetConfig<
     PieChartWidgetModel,
     PieChartVisConfig
 > {
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/status-heatmap/config/status-heatmap-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/status-heatmap/config/status-heatmap-widget-config.component.ts
index 420f239bf1..c0519b0895 100644
--- 
a/ui/src/app/chart-shared/components/charts/status-heatmap/config/status-heatmap-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/status-heatmap/config/status-heatmap-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import {
@@ -46,10 +46,10 @@ export class StatusHeatmapWidgetConfigComponent extends 
BaseWidgetConfig<
     StatusHeatmapWidgetModel,
     StatusHeatmapVisConfig
 > {
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/status/config/status-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/status/config/status-widget-config.component.ts
index b97789ce30..83b0212dba 100644
--- 
a/ui/src/app/chart-shared/components/charts/status/config/status-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/status/config/status-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import {
@@ -63,10 +63,10 @@ export class StatusWidgetConfigComponent extends 
BaseWidgetConfig<
     StatusWidgetModel,
     StatusVisConfig
 > {
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/table/config/table-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/table/config/table-widget-config.component.ts
index 2b311bdfde..8957d5adbe 100644
--- 
a/ui/src/app/chart-shared/components/charts/table/config/table-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/table/config/table-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import { TableVisConfig, TableWidgetModel } from '../model/table-widget.model';
@@ -80,10 +80,10 @@ export class TableWidgetConfigComponent extends 
BaseWidgetConfig<
         '#9333EA',
     ];
 
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/table/table-widget.component.ts 
b/ui/src/app/chart-shared/components/charts/table/table-widget.component.ts
index 850b9531e1..4aceeec541 100644
--- a/ui/src/app/chart-shared/components/charts/table/table-widget.component.ts
+++ b/ui/src/app/chart-shared/components/charts/table/table-widget.component.ts
@@ -17,7 +17,13 @@
  */
 
 import { DatePipe, NgClass, NgStyle } from '@angular/common';
-import { Component, ElementRef, HostListener, ViewChild } from '@angular/core';
+import {
+    Component,
+    ElementRef,
+    HostListener,
+    ViewChild,
+    inject,
+} from '@angular/core';
 import { MatIcon } from '@angular/material/icon';
 import { MatPaginator, PageEvent } from '@angular/material/paginator';
 import { MatCheckbox } from '@angular/material/checkbox';
@@ -102,6 +108,8 @@ const TIMESTAMP_MASK = 'yyyy-mm-dd HH:mm:ss.SSS';
     ],
 })
 export class TableWidgetComponent extends 
BaseDataExplorerWidgetDirective<TableWidgetModel> {
+    private elRef = inject(ElementRef);
+
     private static readonly DEFAULT_PAGE_SIZE = 20;
 
     @ViewChild(MatPaginator) paginator: MatPaginator;
@@ -129,10 +137,6 @@ export class TableWidgetComponent extends 
BaseDataExplorerWidgetDirective<TableW
     dropdownStyle: Record<string, string> = {};
     filterListScrollEnd = true;
 
-    constructor(private elRef: ElementRef) {
-        super();
-    }
-
     @HostListener('document:click', ['$event'])
     onDocumentClick(event: MouseEvent): void {
         if (!this.openFilterColumn) return;
diff --git 
a/ui/src/app/chart-shared/components/charts/time-series-chart/appearance-config/time-series-appearance-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/time-series-chart/appearance-config/time-series-appearance-config.component.ts
index 707499b8b9..0903c8fcef 100644
--- 
a/ui/src/app/chart-shared/components/charts/time-series-chart/appearance-config/time-series-appearance-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/time-series-chart/appearance-config/time-series-appearance-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component, Input } from '@angular/core';
+import { Component, Input, inject } from '@angular/core';
 import { TimeSeriesAppearanceConfig } from 
'../../../../models/dataview-dashboard.model';
 import { ChartConfigurationService } from 
'../../../../services/chart-configuration.service';
 import { LayoutDirective } from '@ngbracket/ngx-layout/flex';
@@ -33,13 +33,11 @@ import { SpDataZoomConfigComponent } from 
'../../../chart-config/data-zoom-confi
     ],
 })
 export class SpTimeSeriesAppearanceConfigComponent {
+    private widgetConfigurationService = inject(ChartConfigurationService);
+
     @Input()
     appearanceConfig: TimeSeriesAppearanceConfig;
 
-    constructor(
-        private widgetConfigurationService: ChartConfigurationService,
-    ) {}
-
     triggerViewUpdate() {
         this.widgetConfigurationService.notify({
             refreshView: true,
diff --git 
a/ui/src/app/chart-shared/components/charts/time-series-chart/config/time-series-chart-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/time-series-chart/config/time-series-chart-widget-config.component.ts
index 8502428b85..9e70d349e4 100644
--- 
a/ui/src/app/chart-shared/components/charts/time-series-chart/config/time-series-chart-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/time-series-chart/config/time-series-chart-widget-config.component.ts
@@ -16,7 +16,7 @@
  *
  */
 
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { BaseWidgetConfig } from '../../base/base-widget-config';
 import {
     TimeSeriesChartVisConfig,
@@ -50,10 +50,10 @@ export class TimeSeriesChartWidgetConfigComponent extends 
BaseWidgetConfig<
     TimeSeriesChartWidgetModel,
     TimeSeriesChartVisConfig
 > {
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
 
diff --git 
a/ui/src/app/chart-shared/components/charts/traffic-light/config/traffic-light-widget-config.component.ts
 
b/ui/src/app/chart-shared/components/charts/traffic-light/config/traffic-light-widget-config.component.ts
index 51bb7e578d..adb56b7652 100644
--- 
a/ui/src/app/chart-shared/components/charts/traffic-light/config/traffic-light-widget-config.component.ts
+++ 
b/ui/src/app/chart-shared/components/charts/traffic-light/config/traffic-light-widget-config.component.ts
@@ -61,10 +61,10 @@ export class TrafficLightWidgetConfigComponent extends 
BaseWidgetConfig<
     TrafficLightVisConfig
 > {
     translateService: TranslateService = inject(TranslateService);
-    constructor(
-        widgetConfigurationService: ChartConfigurationService,
-        fieldService: ChartFieldProviderService,
-    ) {
+    constructor() {
+        const widgetConfigurationService = inject(ChartConfigurationService);
+        const fieldService = inject(ChartFieldProviderService);
+
         super(widgetConfigurationService, fieldService);
     }
     warningRangeInterval: string;
diff --git a/ui/src/app/chart-shared/registry/chart-registry.service.ts 
b/ui/src/app/chart-shared/registry/chart-registry.service.ts
index 5b16d99c08..2a4cc8643c 100644
--- a/ui/src/app/chart-shared/registry/chart-registry.service.ts
+++ b/ui/src/app/chart-shared/registry/chart-registry.service.ts
@@ -17,7 +17,7 @@
  */
 
 import { IWidget } from '../models/dataview-dashboard.model';
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { TableWidgetConfigComponent } from 
'../components/charts/table/config/table-widget-config.component';
 import { TableWidgetComponent } from 
'../components/charts/table/table-widget.component';
 import { MapWidgetConfigComponent } from 
'../components/charts/map/config/map-widget-config.component';
@@ -63,20 +63,20 @@ import { TranslateService } from '@ngx-translate/core';
 
 @Injectable({ providedIn: 'root' })
 export class ChartRegistry {
+    private gaugeRenderer = inject(SpGaugeRendererService);
+    private heatmapRenderer = inject(SpHeatmapRendererService);
+    private statusHeatmapRenderer = inject(SpStatusHeatmapRendererService);
+    private histogramRenderer = inject(SpHistogramRendererService);
+    private pieRenderer = inject(SpPieRendererService);
+    private valueHeatmapRenderer = inject(SpValueHeatmapRendererService);
+    private scatterRenderer = inject(SpScatterRendererService);
+    private densityRenderer = inject(SpDensityRendererService);
+    private timeseriesRenderer = inject(SpTimeseriesRendererService);
+    private translateService = inject(TranslateService);
+
     chartTypes: IWidget<any>[] = [];
 
-    constructor(
-        private gaugeRenderer: SpGaugeRendererService,
-        private heatmapRenderer: SpHeatmapRendererService,
-        private statusHeatmapRenderer: SpStatusHeatmapRendererService,
-        private histogramRenderer: SpHistogramRendererService,
-        private pieRenderer: SpPieRendererService,
-        private valueHeatmapRenderer: SpValueHeatmapRendererService,
-        private scatterRenderer: SpScatterRendererService,
-        private densityRenderer: SpDensityRendererService,
-        private timeseriesRenderer: SpTimeseriesRendererService,
-        private translateService: TranslateService,
-    ) {
+    constructor() {
         this.chartTypes = [
             {
                 id: 'gauge',
diff --git a/ui/src/app/chart-shared/services/chart-routing.service.ts 
b/ui/src/app/chart-shared/services/chart-routing.service.ts
index d8346bdf97..d4d4c5d66a 100644
--- a/ui/src/app/chart-shared/services/chart-routing.service.ts
+++ b/ui/src/app/chart-shared/services/chart-routing.service.ts
@@ -16,16 +16,16 @@
  *
  */
 
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { Router } from '@angular/router';
 
 @Injectable({ providedIn: 'root' })
 export class ChartRoutingService {
+    private router = inject(Router);
+
     private chartPath = ['chart'];
     private dashboardPath = ['dashboard'];
 
-    constructor(private router: Router) {}
-
     navigateToDataViewOverview(omitConfirm: boolean = false): void {
         this.navigateToOverview(this.chartPath, omitConfirm);
     }

Reply via email to