Adjust components to use inject

rossa-tech-cli/src/app/components/dashboard/dashboard.component.ts

@@ -1,5 +1,5 @@
 import { HttpErrorResponse } from '@angular/common/http';
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { LoaderService } from 'src/app/components/loader/loader.service';
 import {
@@ -20,22 +20,20 @@ import { MeterDataAddDialogComponent } from 'src/app/dialogs/meter-data-add-dial
 })
 export class DashboardComponent {
   usageTypes = UsageType;
-
   preparedMeterData: PreparedMeterData[] = [];
-
   meterDataEnergy: PreparedMeterData[] = [];
-  meterDataWater: MeterData[] = [];
-
+  // meterDataWater: MeterData[] = [];
   displayedColumns: string[] = ['date', 'amount', 'meter'];
 
-  constructor(
-    private dataBaseService: DatabaseService,
-    public meterDataService: MeterDataService,
-    private loaderService: LoaderService,
-    private globalService: GlobalService,
-    private errorService: ErrorService,
-    private dialog: MatDialog
-  ) {}
+  // injects
+  private dataBaseService: DatabaseService = inject(DatabaseService);
+  public meterDataService: MeterDataService = inject(MeterDataService);
+  private loaderService: LoaderService = inject(LoaderService);
+  // private globalService: GlobalService = inject(GlobalService)
+  private errorService: ErrorService = inject(ErrorService);
+  private dialog: MatDialog = inject(MatDialog);
+
+  constructor() {}
 
   ngOnInit(): void {
     this.loadMeterData();

rossa-tech-cli/src/app/components/header/header.component.ts

@@ -1,5 +1,5 @@
 import { HttpErrorResponse } from '@angular/common/http';
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
 import { AuthService } from 'src/app/auth/auth.service';
 import { LoginService } from 'src/app/auth/login.service';
 import { PageSecurityService } from 'src/app/auth/pageSecurity.service';
@@ -15,14 +15,16 @@ import { NotificationService } from 'src/app/core/services/notification.service'
 export class HeaderComponent implements OnInit {
   userLoggedIn: Boolean = false;
 
-  constructor(
-    private loginService: LoginService,
-    private pageSecurityService: PageSecurityService,
-    private errorService: ErrorService,
-    private loaderService: LoaderService,
-    private notificationService: NotificationService,
-    private authService: AuthService
-  ) {}
+  //injects
+  private loginService: LoginService = inject(LoginService);
+  private pageSecurityService: PageSecurityService =
+    inject(PageSecurityService);
+  private errorService: ErrorService = inject(ErrorService);
+  private loaderService: LoaderService = inject(LoaderService);
+  private notificationService: NotificationService =
+    inject(NotificationService);
+  private authService: AuthService = inject(AuthService);
+  constructor() {}
 
   ngOnInit(): void {
     this.userLoggedIn = this.authService.checkUserLoggedIn();

rossa-tech-cli/src/app/components/loader/loader.component.ts

@@ -1,13 +1,13 @@
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { LoaderService } from './loader.service';
 
 @Component({
   selector: 'app-loader',
   templateUrl: './loader.component.html',
-  styleUrls: ['./loader.component.scss']
+  styleUrls: ['./loader.component.scss'],
 })
 export class LoaderComponent {
-  constructor(public loaderService: LoaderService) {
-  }
-
+  //injects
+  public loaderService: LoaderService = inject(LoaderService);
+  constructor() {}
 }

rossa-tech-cli/src/app/components/loginPage/login.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
 import { HttpErrorResponse } from '@angular/common/http';
 import { Router } from '@angular/router';
 
@@ -21,14 +21,16 @@ export class LoginComponent implements OnInit {
     userPass: new FormControl('', Validators.required),
   });
 
-  constructor(
-    private loginService: LoginService,
-    private formsService: FormsService,
-    private authService: AuthService,
-    private loaderService: LoaderService,
-    private notificationService: NotificationService,
-    private router: Router
-  ) {}
+  //injects
+  private loginService: LoginService = inject(LoginService);
+  private formsService: FormsService = inject(FormsService);
+  private authService: AuthService = inject(AuthService);
+  private loaderService: LoaderService = inject(LoaderService);
+  private notificationService: NotificationService =
+    inject(NotificationService);
+  private router: Router = inject(Router);
+
+  constructor() {}
 
   ngOnInit() {
     let userLoggedIn: Boolean = this.authService.checkUserLoggedIn();

rossa-tech-cli/src/app/components/subcomponents/chart/chart.component.ts

@@ -1,20 +1,7 @@
-import {
-  Component,
-  ElementRef,
-  Input,
-  SimpleChanges,
-  ViewChild,
-} from '@angular/core';
-import {
-  MeterData,
-  MeterDataForYear,
-  PreparedMeterData,
-} from 'src/app/core/dataModels/Meterdata';
+import { Component, Input } from '@angular/core';
+import { MeterDataForYear } from 'src/app/core/dataModels/Meterdata';
 import { ChartType, ChartOptions, ChartDataset } from 'chart.js';
 
-// import Chart from 'chart.js/auto';
-import { BaseChartDirective } from 'ng2-charts';
-
 @Component({
   selector: 'app-chart',
   templateUrl: './chart.component.html',

rossa-tech-cli/src/app/components/subcomponents/meter-data-list/meter-data-list.component.ts

@@ -1,10 +1,7 @@
 import { Component, Input, OnChanges, OnInit } from '@angular/core';
 import { MatTableDataSource } from '@angular/material/table';
 import { UsageType } from 'src/app/core/dataModels/UsageType';
-import {
-  MeterData,
-  PreparedMeterData,
-} from 'src/app/core/dataModels/Meterdata';
+import { MeterData } from 'src/app/core/dataModels/Meterdata';
 
 @Component({
   selector: 'app-meter-data-list',
@@ -17,9 +14,6 @@ export class MeterDataListComponent implements OnInit, OnChanges {
   @Input()
   type!: UsageType;
   amount: number | undefined;
-  // meterData: PreparedMeterData = new PreparedMeterData();
-  // @Input()
-  // type: UsageType = UsageType.ENERGY;
 
   displayedColumns: string[] = ['id', 'date', 'amount', 'meter'];
 
@@ -112,11 +106,6 @@ export class MeterDataListComponent implements OnInit, OnChanges {
   ngOnInit(): void {}
 
   ngOnChanges(): void {
-    this.dataSource = new MatTableDataSource(
-      this.meterData
-      // this.meterData?.meterDataForYear[0].meterData
-    );
-
-    // this.amount = this.meterData?.meterDataForYear[0].amount;
+    this.dataSource = new MatTableDataSource(this.meterData);
   }
 }

rossa-tech-cli/src/app/dialogs/meter-data-add-dialog/meter-data-add-dialog.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MatDialogRef } from '@angular/material/dialog';
 import { Meter, Meters } from 'src/app/core/dataModels/Meter';
@@ -16,17 +16,20 @@ export class MeterDataAddDialogComponent implements OnInit {
   usageTypes = UsageType;
   usageType: UsageType = UsageType.ENERGY;
 
+  // injects
+  private fb: FormBuilder = inject(FormBuilder);
+  private dialogRef: MatDialogRef<MeterDataAddDialogComponent> = inject(
+    MatDialogRef<MeterDataAddDialogComponent>
+  );
+  private dataService: DatabaseService = inject(DatabaseService);
+
   form: FormGroup = this.fb.group({
     date: [new Date(), Validators.required],
     meter: ['', Validators.required],
     amount: ['', Validators.required],
   });
 
-  constructor(
-    private fb: FormBuilder,
-    private dialogRef: MatDialogRef<MeterDataAddDialogComponent>,
-    private dataService: DatabaseService
-  ) {}
+  constructor() {}
 
   ngOnInit(): void {
     this.dataService.getMeters().subscribe({