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 53d9db944bd10971449d9a63a93ddc4cbaef47fa Author: Philipp Zehnder <[email protected]> AuthorDate: Tue Mar 24 10:02:37 2026 +0100 migrate chart designer UI to inject() --- .../chart-appearance-settings.component.ts | 12 +++++------- .../aggregate-configuration.component.ts | 4 ++-- .../data-settings/chart-data-settings.component.ts | 15 +++++++-------- .../field-selection-panel.component.ts | 17 +++++++++++------ .../field-selection/field-selection.component.ts | 13 ++++++++++--- ...selection-panel-row-value-autocomplete.component.ts | 13 ++++++++++--- ...filter-selection-panel-row-value-input.component.ts | 13 ++++++++++--- .../filter-selection-panel.component.ts | 18 +++++++++--------- .../group-selection-panel.component.ts | 10 ++++------ .../order-selection-panel.component.ts | 6 +++--- .../chart-visualisation-settings.component.ts | 9 ++++----- 11 files changed, 75 insertions(+), 55 deletions(-) diff --git a/ui/src/app/chart/components/chart-view/designer-panel/appearance-settings/chart-appearance-settings.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/appearance-settings/chart-appearance-settings.component.ts index 667ebc4501..b8b2833d12 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/appearance-settings/chart-appearance-settings.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/appearance-settings/chart-appearance-settings.component.ts @@ -16,7 +16,7 @@ * */ -import { Component, Input, OnDestroy, OnInit } from '@angular/core'; +import { Component, Input, OnDestroy, OnInit, inject } from '@angular/core'; import { ChartConfigurationService } from '../../../../../chart-shared/services/chart-configuration.service'; import { DataExplorerWidgetModel } from '@streampipes/platform-services'; import { ChartTypeService } from '../../../../../chart-shared/services/chart-type.service'; @@ -51,6 +51,10 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class ChartAppearanceSettingsComponent implements OnInit, OnDestroy { + private widgetTypeService = inject(ChartTypeService); + private widgetRegistryService = inject(ChartRegistry); + private widgetConfigurationService = inject(ChartConfigurationService); + @Input() currentlyConfiguredWidget: DataExplorerWidgetModel; backgroundOption: 'default' | 'custom' = 'default'; @@ -72,12 +76,6 @@ export class ChartAppearanceSettingsComponent implements OnInit, OnDestroy { widgetTypeSubscription: Subscription; extendedAppearanceConfigComponent: any; - constructor( - private widgetTypeService: ChartTypeService, - private widgetRegistryService: ChartRegistry, - private widgetConfigurationService: ChartConfigurationService, - ) {} - ngOnInit(): void { this.findWidget(this.currentlyConfiguredWidget.widgetType); this.widgetTypeSubscription = diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/aggregate-configuration/aggregate-configuration.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/aggregate-configuration/aggregate-configuration.component.ts index 1da88458f6..77ee49957f 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/aggregate-configuration/aggregate-configuration.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/aggregate-configuration/aggregate-configuration.component.ts @@ -49,6 +49,8 @@ import { FormsModule } from '@angular/forms'; ], }) export class AggregateConfigurationComponent { + private widgetConfigService = inject(ChartConfigurationService); + @Input() queryConfig: QueryConfig; @Input() widgetId: string; @@ -63,8 +65,6 @@ export class AggregateConfigurationComponent { { value: 'w', label: this.translateService.instant('Week') }, ]; - constructor(private widgetConfigService: ChartConfigurationService) {} - triggerDataRefresh() { if (this.widgetId) { this.widgetConfigService.notify({ diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/chart-data-settings.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/chart-data-settings.component.ts index 89e108b7e8..0715e65e18 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/chart-data-settings.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/chart-data-settings.component.ts @@ -23,6 +23,7 @@ import { OnInit, Output, ViewChild, + inject, } from '@angular/core'; import { DataExplorerDataConfig, @@ -110,6 +111,12 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class ChartDataSettingsComponent implements OnInit { + private datalakeRestService = inject(DatalakeRestService); + private widgetConfigService = inject(ChartConfigurationService); + private fieldProviderService = inject(ChartFieldProviderService); + private widgetTypeService = inject(ChartTypeService); + private router = inject(Router); + @Input() dataConfig: DataExplorerDataConfig; @Input() dataLakeMeasure: DataLakeMeasure; @Input() newWidgetMode: boolean; @@ -137,14 +144,6 @@ export class ChartDataSettingsComponent implements OnInit { expandFieldsDataSource = true; expandFieldsQuery = true; - constructor( - private datalakeRestService: DatalakeRestService, - private widgetConfigService: ChartConfigurationService, - private fieldProviderService: ChartFieldProviderService, - private widgetTypeService: ChartTypeService, - private router: Router, - ) {} - ngOnInit(): void { this.loadPipelinesAndMeasurements(); } diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection-panel/field-selection-panel.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection-panel/field-selection-panel.component.ts index 4fcce7eb0e..574fa479c7 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection-panel/field-selection-panel.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection-panel/field-selection-panel.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 { EventPropertyUnion, FieldConfig, @@ -54,6 +61,9 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class FieldSelectionPanelComponent implements OnInit { + private fieldProvider = inject(ChartFieldProviderService); + private widgetConfigService = inject(ChartConfigurationService); + MAX_INITIAL_FIELDS = 3; @Input() sourceConfig: SourceConfig; @@ -63,11 +73,6 @@ export class FieldSelectionPanelComponent implements OnInit { expandFields = false; - constructor( - private fieldProvider: ChartFieldProviderService, - private widgetConfigService: ChartConfigurationService, - ) {} - ngOnInit() { this.applyDefaultFields(); this.initialFieldSelectionEvent.emit(); diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection/field-selection.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection/field-selection.component.ts index 29da735763..b68cd07d85 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection/field-selection.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/field-selection/field-selection.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 { EventPropertyUnion, FieldConfig, @@ -51,14 +58,14 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class FieldSelectionComponent implements OnInit { + private widgetConfigService = inject(ChartConfigurationService); + @Input() field: FieldConfig; @Input() sourceConfig: SourceConfig; @Output() addFieldEmitter: EventEmitter<EventPropertyUnion> = new EventEmitter<EventPropertyUnion>(); - constructor(private widgetConfigService: ChartConfigurationService) {} - ngOnInit() { if (!this.field.aggregations) { this.field.aggregations = []; diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input-autocomplete/filter-selection-panel-row-value-autocomplete.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input-autocomplete/filter-selection-panel-row-value-autocomplete.component.ts index 6c57bce59c..3abbf0bad0 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input-autocomplete/filter-selection-panel-row-value-autocomplete.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input-autocomplete/filter-selection-panel-row-value-autocomplete.component.ts @@ -15,7 +15,14 @@ * limitations under the License. * */ -import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { + Component, + EventEmitter, + Input, + OnInit, + Output, + inject, +} from '@angular/core'; import { SelectedFilter } from '@streampipes/platform-services'; import { EscapeNumberFilterService } from '../escape-number-filter.service'; import { MatFormField } from '@angular/material/form-field'; @@ -43,6 +50,8 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class FilterSelectionPanelRowValueAutocompleteComponent implements OnInit { + private escapeNumberFilterService = inject(EscapeNumberFilterService); + @Input() public filter: SelectedFilter; @@ -54,8 +63,6 @@ export class FilterSelectionPanelRowValueAutocompleteComponent implements OnInit public value: string; - constructor(private escapeNumberFilterService: EscapeNumberFilterService) {} - ngOnInit(): void { this.value = this.escapeNumberFilterService.removeEnclosingQuotes( this.filter.value, diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input/filter-selection-panel-row-value-input.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input/filter-selection-panel-row-value-input.component.ts index f4de3a53da..d87a994225 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input/filter-selection-panel-row-value-input.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel-row/panel-row-value-input/filter-selection-panel-row-value-input.component.ts @@ -15,7 +15,14 @@ * limitations under the License. * */ -import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { + Component, + EventEmitter, + Input, + OnInit, + Output, + inject, +} from '@angular/core'; import { SelectedFilter } from '@streampipes/platform-services'; import { EscapeNumberFilterService } from '../escape-number-filter.service'; import { MatFormField } from '@angular/material/form-field'; @@ -29,6 +36,8 @@ import { TranslatePipe } from '@ngx-translate/core'; imports: [MatFormField, MatInput, FormsModule, TranslatePipe], }) export class FilterSelectionPanelRowValueInputComponent implements OnInit { + private escapeNumberFilterService = inject(EscapeNumberFilterService); + @Input() public filter: SelectedFilter; @@ -41,8 +50,6 @@ export class FilterSelectionPanelRowValueInputComponent implements OnInit { public value: string; - constructor(private escapeNumberFilterService: EscapeNumberFilterService) {} - ngOnInit(): void { this.value = this.escapeNumberFilterService.removeEnclosingQuotes( this.filter.value, diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel.component.ts index d4d464d804..7c79ef42e2 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/filter-selection-panel/filter-selection-panel.component.ts @@ -16,7 +16,7 @@ * */ -import { Component, Input, OnInit } from '@angular/core'; +import { Component, Input, OnInit, inject } from '@angular/core'; import { DatalakeRestService, FilterExpressionGroup, @@ -60,18 +60,18 @@ import { FilterExpressionPreviewService } from './filter-expression-preview.serv ], }) export class FilterSelectionPanelComponent implements OnInit { + private widgetConfigService = inject(ChartConfigurationService); + private fieldProviderService = inject(ChartFieldProviderService); + private dataLakeRestService = inject(DatalakeRestService); + private dialogService = inject(DialogService); + private filterExpressionPreviewService = inject( + FilterExpressionPreviewService, + ); + @Input() sourceConfig: SourceConfig; tagValues: Map<string, string[]> = new Map<string, string[]>(); - constructor( - private widgetConfigService: ChartConfigurationService, - private fieldProviderService: ChartFieldProviderService, - private dataLakeRestService: DatalakeRestService, - private dialogService: DialogService, - private filterExpressionPreviewService: FilterExpressionPreviewService, - ) {} - ngOnInit(): void { this.sourceConfig.queryConfig.selectedFilters.forEach(filter => { filter.chainingOperator ??= 'AND'; diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/group-selection-panel/group-selection-panel.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/group-selection-panel/group-selection-panel.component.ts index 2ec13e3ef7..5e68ea025a 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/group-selection-panel/group-selection-panel.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/group-selection-panel/group-selection-panel.component.ts @@ -16,7 +16,7 @@ * */ -import { Component, Input, OnInit } from '@angular/core'; +import { Component, Input, OnInit, inject } from '@angular/core'; import { ChartFieldProviderService } from '../../../../../../chart-shared/services/chart-field-provider.service'; import { ChartConfigurationService } from '../../../../../../chart-shared/services/chart-configuration.service'; import { @@ -44,12 +44,10 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class GroupSelectionPanelComponent implements OnInit { - @Input() sourceConfig: SourceConfig; + private fieldProvider = inject(ChartFieldProviderService); + private widgetConfigService = inject(ChartConfigurationService); - constructor( - private fieldProvider: ChartFieldProviderService, - private widgetConfigService: ChartConfigurationService, - ) {} + @Input() sourceConfig: SourceConfig; ngOnInit() { const groupByFields = this.sourceConfig.queryConfig.groupBy; diff --git a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/order-selection-panel/order-selection-panel.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/order-selection-panel/order-selection-panel.component.ts index 3feb00d07c..76871938d8 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/data-settings/order-selection-panel/order-selection-panel.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/data-settings/order-selection-panel/order-selection-panel.component.ts @@ -16,7 +16,7 @@ * */ -import { Component, Input, OnInit } from '@angular/core'; +import { Component, Input, OnInit, inject } from '@angular/core'; import { SourceConfig } from '@streampipes/platform-services'; import { ChartConfigurationService } from '../../../../../../chart-shared/services/chart-configuration.service'; import { SplitSectionComponent } from '@streampipes/shared-ui'; @@ -37,9 +37,9 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class OrderSelectionPanelComponent implements OnInit { - @Input() sourceConfig: SourceConfig; + private widgetConfigService = inject(ChartConfigurationService); - constructor(private widgetConfigService: ChartConfigurationService) {} + @Input() sourceConfig: SourceConfig; ngOnInit(): void { this.sourceConfig.queryConfig.order ??= 'DESC'; diff --git a/ui/src/app/chart/components/chart-view/designer-panel/visualisation-settings/chart-visualisation-settings.component.ts b/ui/src/app/chart/components/chart-view/designer-panel/visualisation-settings/chart-visualisation-settings.component.ts index 3287537288..abf0ea29e5 100644 --- a/ui/src/app/chart/components/chart-view/designer-panel/visualisation-settings/chart-visualisation-settings.component.ts +++ b/ui/src/app/chart/components/chart-view/designer-panel/visualisation-settings/chart-visualisation-settings.component.ts @@ -22,6 +22,7 @@ import { OnChanges, OnInit, SimpleChanges, + inject, } from '@angular/core'; import { DataExplorerWidgetModel } from '@streampipes/platform-services'; import { ChartTypeService } from '../../../../../chart-shared/services/chart-type.service'; @@ -58,12 +59,10 @@ import { TranslatePipe } from '@ngx-translate/core'; ], }) export class ChartVisualisationSettingsComponent implements OnInit, OnChanges { - @Input() currentlyConfiguredWidget: DataExplorerWidgetModel; + private widgetTypeService = inject(ChartTypeService); + private widgetRegistryService = inject(ChartRegistry); - constructor( - private widgetTypeService: ChartTypeService, - private widgetRegistryService: ChartRegistry, - ) {} + @Input() currentlyConfiguredWidget: DataExplorerWidgetModel; availableWidgets: IWidget<any>[]; activeWidgetType: IWidget<any>;
