Migrate to inject() for demo too #10706

src/app/AbstractSelect.ts

@@ -3,6 +3,7 @@ import {collectErrors, validateAllFormControls} from '@ecodev/natural';
 import {Observable} from 'rxjs';
 import {ErrorService} from '../../projects/natural/src/lib/testing/error.service';
 import {Item, ItemService} from '../../projects/natural/src/lib/testing/item.service';
+import {inject} from '@angular/core';
 
 export class AbstractSelect {
     public required = true;
@@ -32,11 +33,8 @@ export class AbstractSelect {
     public disabled = false;
     public freeText: Item | string | null = null;
     public withoutModelOutput: Item | string | string[] | null = null;
-
-    public constructor(
-        public readonly service: ItemService,
-        public readonly errorService?: ErrorService,
-    ) {}
+    public readonly service = inject(ItemService);
+    public readonly errorService = inject(ErrorService);
 
     public toggleDisabledAllFormControls(): void {
         this.formControl.disabled ? this.formControl.enable() : this.formControl.disable();

src/app/alert/alert.component.ts

@@ -1,4 +1,4 @@
-import {Component} from '@angular/core';
+import {Component, inject} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {NaturalAlertService} from '@ecodev/natural';
 
@@ -9,7 +9,7 @@ import {NaturalAlertService} from '@ecodev/natural';
     imports: [MatButtonModule],
 })
 export class AlertComponent {
-    public constructor(private readonly alertService: NaturalAlertService) {}
+    private readonly alertService = inject(NaturalAlertService);
 
     public confirm(): void {
         this.alertService

src/app/demo.error-handler.ts

@@ -1,11 +1,11 @@
-import {Injectable} from '@angular/core';
+import {Injectable, inject} from '@angular/core';
 import {MatSnackBar} from '@angular/material/snack-bar';
 import {NaturalLoggerExtra, NaturalLoggerType} from '@ecodev/natural';
 import {Observable, of} from 'rxjs';
 
 @Injectable({providedIn: 'root'})
 export class DemoLoggerExtra implements NaturalLoggerExtra {
-    public constructor(private readonly snackBar: MatSnackBar) {}
+    private readonly snackBar = inject(MatSnackBar);
 
     public getExtras(): Observable<Partial<NaturalLoggerType>> {
         this.snackBar.open('An error happened', 'Yes', {

src/app/detail/detail.component.ts

@@ -1,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatFormFieldModule} from '@angular/material/form-field';
@@ -35,7 +35,9 @@ import {Item, ItemInput, ItemService} from '../../../projects/natural/src/lib/te
 export class DetailComponent extends NaturalAbstractDetail<ItemService, NaturalSeoResolveData> implements OnInit {
     public readonly collectErrors = collectErrors;
 
-    public constructor(service: ItemService) {
+    public constructor() {
+        const service = inject(ItemService);
+
         super('detail', service);
 
         if (this.isUpdatePage()) {

src/app/editable-list/editable-list.component.ts

@@ -1,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component} from '@angular/core';
+import {Component, inject} from '@angular/core';
 import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
@@ -31,7 +31,9 @@ import {ItemService} from '../../../projects/natural/src/lib/testing/item.servic
 export class EditableListComponent extends NaturalAbstractEditableList<ItemService> {
     public columns = ['name', 'description'];
 
-    public constructor(service: ItemService) {
+    public constructor() {
+        const service = inject(ItemService);
+
         super(service);
 
         this.service

src/app/file/file.component.ts

@@ -1,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component} from '@angular/core';
+import {Component, inject} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCheckboxModule} from '@angular/material/checkbox';
@@ -63,6 +63,9 @@ function selectionToJson(selection: FileSelection): JsonFileSelection {
     ],
 })
 export class FileComponent {
+    private readonly uploadService = inject(NaturalFileService);
+    private readonly fileService = inject(FileService);
+
     public disabled = false;
     public fileOver: boolean | null = null;
     public fileOverJpg: boolean | null = null;
@@ -74,11 +77,6 @@ export class FileComponent {
 
     public model: FileModel | null = null;
 
-    public constructor(
-        private readonly uploadService: NaturalFileService,
-        private readonly fileService: FileService,
-    ) {}
-
     public fileChange(file: File): void {
         console.log('fileChange', fileToJson(file));
     }

src/app/hierarchic/hierarchic.component.ts

@@ -1,4 +1,4 @@
-import {Component} from '@angular/core';
+import {Component, inject} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {
     HierarchicDialogConfig,
@@ -20,6 +20,8 @@ import {ItemService} from '../../../projects/natural/src/lib/testing/item.servic
     imports: [NaturalHierarchicSelectorComponent, MatButtonModule],
 })
 export class HierarchicComponent {
+    private readonly hierarchicDialogService = inject(NaturalHierarchicSelectorDialogService);
+
     public searchFacets: NaturalSearchFacets = [
         {
             display: 'Number less than 100',
@@ -67,8 +69,6 @@ export class HierarchicComponent {
         },
     ];
 
-    public constructor(private readonly hierarchicDialogService: NaturalHierarchicSelectorDialogService) {}
-
     public log(...args: any): void {
         console.log(args);
     }

src/app/home/home.component.ts

@@ -1,5 +1,5 @@
 import {DOCUMENT} from '@angular/common';
-import {Component, Inject, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {MatExpansionModule} from '@angular/material/expansion';
 import {MatIconModule} from '@angular/material/icon';
@@ -32,10 +32,8 @@ import {ThemeService} from '../shared/services/theme.service';
     ],
 })
 export class HomeComponent implements OnInit {
-    public constructor(
-        public readonly themeService: ThemeService,
-        @Inject(DOCUMENT) private readonly document: Document,
-    ) {}
+    public readonly themeService = inject(ThemeService);
+    private readonly document = inject<Document>(DOCUMENT);
 
     public ngOnInit(): void {
         this.themeService.theme.subscribe(newTheme => {

src/app/list/list.component.ts

@@ -1,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatPaginatorModule} from '@angular/material/paginator';
 import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
@@ -103,7 +103,9 @@ export class ListComponent extends NaturalAbstractList<ItemService> implements O
 
     protected override defaultSorting: Sorting[] = [{field: 'name', order: SortingOrder.DESC}];
 
-    public constructor(service: ItemService) {
+    public constructor() {
+        const service = inject(ItemService);
+
         super(service);
     }
 }

src/app/navigable-list/navigable-list.component.ts

@@ -1,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatIconModule} from '@angular/material/icon';
@@ -65,7 +65,9 @@ export class NavigableListComponent extends NaturalAbstractNavigableList<ItemSer
     ];
     protected override defaultSorting: Sorting[] = [{field: 'name', order: SortingOrder.DESC}];
 
-    public constructor(service: ItemService) {
+    public constructor() {
+        const service = inject(ItemService);
+
         super(service);
     }
 }

src/app/other/other.component.ts

@@ -1,6 +1,6 @@
 import {CommonModule} from '@angular/common';
 import {HttpClient} from '@angular/common/http';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatRippleModule, ThemePalette} from '@angular/material/core';
@@ -52,6 +52,8 @@ type TableButtonConfiguration = {
     ],
 })
 export class OtherComponent implements OnInit {
+    private httpClient = inject(HttpClient);
+
     /**
      * Single control
      */
@@ -212,8 +214,6 @@ export class OtherComponent implements OnInit {
         prefix: new FormControl('', [Validators.required]),
     });
 
-    public constructor(private httpClient: HttpClient) {}
-
     public ngOnInit(): void {
         this.httpPrefixControl.valueChanges.subscribe(value => {
             console.log('httpPrefixControl.valueChanges', value);

src/app/relations/relations.component.ts

@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {NaturalAbstractDetail, NaturalHierarchicConfiguration} from '@ecodev/natural';
 import {NaturalRelationsComponent} from '../../../projects/natural/src/lib/modules/relations/relations.component';
@@ -14,6 +14,9 @@ import {NoResultService} from '../../../projects/natural/src/lib/testing/no-resu
     imports: [FormsModule, ReactiveFormsModule, NaturalRelationsComponent],
 })
 export class RelationsComponent extends NaturalAbstractDetail<ItemService> implements OnInit {
+    public readonly noResultService = inject(NoResultService);
+    public readonly errorService = inject(ErrorService);
+
     public hierarchicConfig: NaturalHierarchicConfiguration[] = [
         {
             service: ItemService,
@@ -23,11 +26,9 @@ export class RelationsComponent extends NaturalAbstractDetail<ItemService> imple
         },
     ];
 
-    public constructor(
-        service: ItemService,
-        public readonly noResultService: NoResultService,
-        public readonly errorService: ErrorService,
-    ) {
+    public constructor() {
+        const service = inject(ItemService);
+
         super('any', service);
     }
 

src/app/search/search.component.ts

@@ -1,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component, OnInit} from '@angular/core';
+import {Component, OnInit, inject} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
 import {ActivatedRoute, Router} from '@angular/router';
 import {
@@ -37,6 +37,11 @@ import {ItemService} from '../../../projects/natural/src/lib/testing/item.servic
     imports: [NaturalSearchComponent, MatButtonModule, CommonModule],
 })
 export class SearchComponent implements OnInit {
+    private readonly router = inject(Router);
+    private readonly route = inject(ActivatedRoute);
+    public readonly itemService = inject(ItemService);
+    public readonly errorService = inject(ErrorService);
+
     public facets1: NaturalSearchFacets = [
         {
             display: 'Active',
@@ -329,13 +334,6 @@ export class SearchComponent implements OnInit {
         ],
     ];
 
-    public constructor(
-        private readonly router: Router,
-        private readonly route: ActivatedRoute,
-        public readonly itemService: ItemService,
-        public readonly errorService: ErrorService,
-    ) {}
-
     public ngOnInit(): void {
         const params = this.route.snapshot.params.search;
         if (params) {

src/app/select-enum/select-enum.component.ts

@@ -6,8 +6,6 @@ import {IEnum, NaturalEnumService} from '@ecodev/natural';
 import {Observable, of} from 'rxjs';
 import {NaturalSelectEnumComponent} from '../../../projects/natural/src/lib/modules/select/select-enum/select-enum.component';
 import {AnyEnumService} from '../../../projects/natural/src/lib/testing/any-enum.service';
-import {ErrorService} from '../../../projects/natural/src/lib/testing/error.service';
-import {ItemService} from '../../../projects/natural/src/lib/testing/item.service';
 import {AbstractSelect} from '../AbstractSelect';
 
 @Component({
@@ -30,10 +28,6 @@ export class SelectEnumComponent extends AbstractSelect {
         return e.value === 'val2';
     }
 
-    public constructor(service: ItemService, errorService: ErrorService) {
-        super(service, errorService);
-    }
-
     protected override getNextValue(): Observable<any> {
         return of('val' + Math.ceil(Math.random() * Math.floor(3)));
     }

src/app/select-hierarchic/select-hierarchic.component.ts

@@ -6,7 +6,6 @@ import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
 import {NaturalHierarchicConfiguration} from '@ecodev/natural';
 import {NaturalSelectHierarchicComponent} from '../../../projects/natural/src/lib/modules/select/select-hierarchic/select-hierarchic.component';
-import {ErrorService} from '../../../projects/natural/src/lib/testing/error.service';
 import {ItemService} from '../../../projects/natural/src/lib/testing/item.service';
 import {AbstractSelect} from '../AbstractSelect';
 
@@ -33,8 +32,4 @@ export class SelectHierarchicComponent extends AbstractSelect {
             selectableAtKey: 'any',
         },
     ];
-
-    public constructor(service: ItemService, errorService: ErrorService) {
-        super(service, errorService);
-    }
 }

src/app/select/select.component.ts

@@ -7,8 +7,6 @@ import {MatIconModule} from '@angular/material/icon';
 import {MatInputModule} from '@angular/material/input';
 import {NaturalIconDirective} from '../../../projects/natural/src/lib/modules/icon/icon.directive';
 import {NaturalSelectComponent} from '../../../projects/natural/src/lib/modules/select/select/select.component';
-import {ErrorService} from '../../../projects/natural/src/lib/testing/error.service';
-import {ItemService} from '../../../projects/natural/src/lib/testing/item.service';
 import {AbstractSelect} from '../AbstractSelect';
 
 @Component({
@@ -28,11 +26,4 @@ import {AbstractSelect} from '../AbstractSelect';
         CommonModule,
     ],
 })
-export class SelectComponent extends AbstractSelect {
-    public constructor(
-        service: ItemService,
-        public override readonly errorService: ErrorService,
-    ) {
-        super(service, errorService);
-    }
-}
+export class SelectComponent extends AbstractSelect {}