feat: eslint upgrade

.eslintrc.json

@@ -25,8 +25,9 @@
         "plugin:import/typescript",
         "eslint:recommended",
         "plugin:n/recommended",
-        "plugin:@typescript-eslint/recommended",
-        "plugin:@angular-eslint/recommended"
+        "plugin:@angular-eslint/recommended",
+        "plugin:@typescript-eslint/recommended-type-checked",
+        "plugin:@typescript-eslint/stylistic-type-checked"
       ],
       "settings": {
         "import/resolver": {
@@ -36,8 +37,12 @@
         }
       },
       "parser": "@typescript-eslint/parser",
+      "parserOptions": {
+        "project": true,
+        "tsconfigRootDir": "."
+      },
       "plugins": [
-        "eslint-plugin-import",
+        "import",
         "eslint-plugin-prefer-arrow",
         "@angular-eslint",
         "@typescript-eslint",
@@ -104,7 +109,33 @@
         "@typescript-eslint/type-annotation-spacing": "error",
         "no-useless-concat": ["error"],
         "no-duplicate-imports": ["error"],
-        "@typescript-eslint/consistent-type-definitions": ["error", "type"]
+        "@typescript-eslint/consistent-type-definitions": ["error", "type"],
+        "@typescript-eslint/prefer-optional-chain": "error",
+        "@typescript-eslint/prefer-nullish-coalescing": "error",
+        "@typescript-eslint/restrict-plus-operands": "error",
+        "@typescript-eslint/no-unsafe-member-access": "off",
+        "@typescript-eslint/no-floating-promises": "off",
+        "@typescript-eslint/unbound-method": [
+          "error",
+          {
+            "ignoreStatic": true
+          }
+        ],
+        "@angular-eslint/component-max-inline-declarations": [
+          "error",
+          {
+            "template": 0,
+            "styles": 0,
+            "animations": 15
+          }
+        ],
+        "@angular-eslint/contextual-decorator": ["error"],
+        "@angular-eslint/no-pipe-impure": ["error"],
+        "@angular-eslint/relative-url-prefix": ["error"],
+        "@angular-eslint/sort-ngmodule-metadata-arrays": [
+          "error",
+          {"locale": "en-US"}
+        ]
       }
     }
   ]

src/app/app-routing.module.ts

@@ -38,7 +38,7 @@ export class AppRoutingModule {
     router.events
       .pipe(filter((e): e is NavigationError => e instanceof NavigationError))
       .subscribe(e => {
-        toast.error(e.error.message);
+        toast.error(e.error.message as string);
         router.navigateByUrl('/dashboard');
       });
   }

src/app/app.module.ts

@@ -28,10 +28,10 @@ import {
 @NgModule({
   declarations: [AppComponent],
   imports: [
-    BrowserModule,
-    HammerModule,
     AppRoutingModule,
     BrowserAnimationsModule,
+    BrowserModule,
+    HammerModule,
     SharedModule.forRoot(),
     TranslateModule.forRoot({
       useDefaultLang: false,

src/app/application-modules/alert/alert.module.ts

@@ -44,27 +44,27 @@ const childRoutes: Routes = [
 
 @NgModule({
   declarations: [
-    AlertListComponent,
     AlertComponent,
+    AlertListComponent,
     AlertWeatherFieldComponent,
-    QuestionComponent,
-    MultipleComponent,
-    SliderComponent,
-    SelectWeatherFieldComponent,
-    SelectRowDirective,
     ClickOutsideDirective,
     ContainerDirective,
+    MultipleComponent,
+    QuestionComponent,
+    SelectRowDirective,
+    SelectWeatherFieldComponent,
+    SliderComponent,
   ],
   imports: [
     MatBadgeModule,
+    MatBottomSheetModule,
     MatCheckboxModule,
-    MatSelectModule,
-    ReactiveFormsModule,
     MatMenuModule,
-    MatSortModule,
-    MatBottomSheetModule,
     MatPaginatorModule,
+    MatSelectModule,
+    MatSortModule,
     NouisliderModule,
+    ReactiveFormsModule,
     SharedModule.forChild(),
     RouterModule.forChild(childRoutes),
   ],

src/app/application-modules/alert/click-outside.directive.ts

@@ -21,6 +21,4 @@ export class ClickOutsideDirective {
   }
 
   inside = false;
-
-  constructor() {}
 }

src/app/application-modules/alert/components/alert-list/alert-list.component.ts

@@ -42,16 +42,16 @@ export class AlertListComponent implements OnInit {
   @ViewChild('deleteButton')
   deleteButton!: TemplateRef<number>;
 
-  formatFields: {[key: string]: (a: Alert) => string} = {
+  formatFields: Record<string, (a: Alert) => string> = {
     force_notification: a =>
       this.titleCasePipe.transform(
-        this.translate.instant(`global.${a.forceNotification}`)
+        this.translate.instant(`global.${a.forceNotification}`) as string
       ),
     trigger_day: a =>
       this.titleCasePipe.transform(
         this.formatField(a.getTriggerDays(this.translate.currentLang), false)
       ),
-    trigger_hour: a => this.datePipe.transform(a.triggerHour, 'hour') as string,
+    trigger_hour: a => this.datePipe.transform(a.triggerHour, 'hour'),
     monitored_day: a =>
       this.titleCasePipe.transform(
         this.formatField(a.getMonitoredDays(), false)
@@ -124,7 +124,7 @@ export class AlertListComponent implements OnInit {
       result = result.slice(0, 2);
       ellips = '...';
     }
-    return `${result.map(a => this.translate.instant(a)).join(', ')}${ellips}`;
+    return `${result.map(a => this.translate.instant(a) as string).join(', ')}${ellips}`;
   }
 
   handleSelection(id: number): void {

src/app/application-modules/alert/components/alert-weather-field/alert-weather-field.component.ts

@@ -29,8 +29,6 @@ export class AlertWeatherFieldComponent
   configuration!: SliderConfig<true>;
   initialValue?: AlertWeatherField;
 
-  constructor() {}
-
   configureSlider(selected: WeatherFieldConfig): void {
     this.configuration = {
       min: selected.min,

src/app/application-modules/alert/components/multiple/multiple.component.ts

@@ -52,8 +52,6 @@ export class MultipleComponent<T, U extends boolean> implements OnInit {
 
   createdList: Created<T, U>[] = [];
 
-  constructor() {}
-
   ngOnInit(): void {
     this.host.viewContainerRef.clear();
     if (!this.form.length) {

src/app/application-modules/alert/components/question/question.component.ts

@@ -12,6 +12,4 @@ export class QuestionComponent<T> {
 
   @Input()
   ctrl?: FormArray | FormControl<T>;
-
-  constructor() {}
 }

src/app/application-modules/alert/components/slider/slider.component.ts

@@ -36,8 +36,6 @@ export class SliderComponent<T extends boolean>
   SliderFormatter = SliderFormatter;
   config = {};
 
-  constructor() {}
-
   ngOnInit() {
     if (!this.initialValue?.value) {
       this.shownAddBtn.emit(true);

src/app/application-modules/alert/select-row.directive.ts

@@ -36,6 +36,4 @@ export class SelectRowDirective {
   }
 
   setTimeoutConst?: number;
-
-  constructor() {}
 }

src/app/application-modules/dashboard/components/dashboard-details/dashboard-details.component.ts

@@ -49,7 +49,7 @@ export class DashboardDetailsComponent implements OnInit, OnDestroy {
   index!: number;
   subs: Subscription[] = [];
   alertId?: string;
-  formatFields: {[key: string]: (h: Hour) => string} = {
+  formatFields: Record<string, (h: Hour) => string> = {
     feels_like: h => `${h.feelsLikeC} ${UNITS[WeatherField.FEELS_LIKE]}`,
     cloud: h => `${h.cloud} ${UNITS[WeatherField.CLOUD]}`,
     humidity: h => `${h.humidity} ${UNITS[WeatherField.HUMIDITY]}`,
@@ -118,7 +118,7 @@ export class DashboardDetailsComponent implements OnInit, OnDestroy {
     return of(this.location.getState() as Forecast).pipe(
       mergeMap(forecast =>
         iif(
-          () => !forecast || !forecast.forecastDay,
+          () => !forecast?.forecastDay,
           of(this.place).pipe(
             switchMap(place => {
               if (place) {

src/app/application-modules/dashboard/components/dashboard-forecast/dashboard-forecast.component.ts

@@ -61,7 +61,7 @@ export class DashboardForecastComponent implements OnInit, OnDestroy {
         )
         .subscribe(
           (location: string) => this.navigate(location),
-          err => {
+          (err: string) => {
             this.showSpinner = false;
             this.toast.info(err);
           }
@@ -80,7 +80,7 @@ export class DashboardForecastComponent implements OnInit, OnDestroy {
         )
         .subscribe(
           location => this.searchForecast(location),
-          err => this.weatherService.handleError(err)
+          (err: string) => this.weatherService.handleError(err)
         )
     );
   }
@@ -97,7 +97,7 @@ export class DashboardForecastComponent implements OnInit, OnDestroy {
           );
           this.forecast = forecast;
         },
-        err => this.weatherService.handleError(err)
+        (err: string) => this.weatherService.handleError(err)
       );
   }
 

src/app/application-modules/dashboard/dashboard.module.ts

@@ -29,10 +29,10 @@ const childRoutes: Routes = [
     HighlightDirective,
   ],
   imports: [
-    MatProgressSpinnerModule,
-    MatTableModule,
     MatPaginatorModule,
+    MatProgressSpinnerModule,
     MatSlideToggleModule,
+    MatTableModule,
     SharedModule.forChild(),
     RouterModule.forChild(childRoutes),
   ],

src/app/application-modules/user/components/profile/profile.component.ts

@@ -22,7 +22,7 @@ export class ProfileComponent implements OnInit {
 
   ngOnInit() {
     this.menuService.title$.next(
-      this.translateService.instant('user.profile.title')
+      this.translateService.instant('user.profile.title') as string
     );
   }
 

src/app/application-modules/user/user.module.ts

@@ -21,7 +21,7 @@ const childRoutes: Routes = [
 ];
 
 @NgModule({
-  declarations: [SignupComponent, SigninComponent, ProfileComponent],
+  declarations: [ProfileComponent, SigninComponent, SignupComponent],
   imports: [
     SharedModule.forChild(),
     MatFormFieldModule,

src/app/model/alert/alert.ts

@@ -22,7 +22,7 @@ const WEEK_END = {
 };
 
 export class Alert {
-  @Transform(({value}) => Utils.formatHours(value), {
+  @Transform(({value}) => Utils.formatHours(value as string), {
     toClassOnly: true,
   })
   triggerHour!: DateTime;
@@ -44,7 +44,7 @@ export class Alert {
 
   @Expose()
   getMonitoredDays(): string[] {
-    return (Object.keys(MonitoredDay) as Array<keyof MonitoredDays>)
+    return (Object.keys(MonitoredDay) as (keyof MonitoredDays)[])
       .filter(key => this.monitoredDays[key])
       .map(monitored => `alert.monitored_days.${monitored}`);
   }

src/app/model/alert/create-alert.ts

@@ -7,7 +7,7 @@ import {DateTime} from 'luxon';
 export class CreateAlert {
   @Transform(
     ({value}) =>
-      `${Utils.formatMinutes(value, 'hh:mm:00.000')}${DateTime.now().toFormat(
+      `${Utils.formatMinutes(value as number, 'hh:mm:00.000')}${DateTime.now().toFormat(
         'ZZ'
       )}`
   )

src/app/model/http/http-request.ts

@@ -11,5 +11,5 @@ export type HttpPagedRequest<T> = HttpRequest & {
 };
 
 export type HttpBodyRequest = HttpRequest & {
-  body?: unknown | null;
+  body?: unknown;
 };

src/app/service/alert.service.ts

@@ -53,7 +53,7 @@ export class AlertService extends UtilsService {
   }
 
   deleteBydIds(ids: number[]): Observable<void> {
-    return this.delete({url: `?ids=${ids}`}).pipe(
+    return this.delete({url: `?ids=${ids.toString()}`}).pipe(
       tap(() => this.toast.info('alert.deleted', {size: ids.length}))
     );
   }

src/app/service/configuration.service.ts

@@ -10,8 +10,6 @@ import {Configuration} from '@model/configuration';
 export class ConfigurationService {
   configuration!: Configuration;
 
-  constructor() {}
-
   load(): Observable<Configuration> {
     return this.configuration
       ? of(this.configuration)

src/app/service/menu.service.ts

@@ -6,6 +6,4 @@ import {BehaviorSubject} from 'rxjs';
 })
 export class MenuService {
   title$ = new BehaviorSubject<string>('');
-
-  constructor() {}
 }

src/app/service/notification.service.ts

@@ -2,7 +2,7 @@ import {Injectable} from '@angular/core';
 import {SwPush} from '@angular/service-worker';
 import {from, throwError, EMPTY, Observable} from 'rxjs';
 import {catchError, switchMap, filter, tap} from 'rxjs/operators';
-import {UtilsService} from './utils.service';
+import {GobalError, UtilsService} from './utils.service';
 import {HttpClient} from '@angular/common/http';
 import {ToastService} from './toast.service';
 import {ConfigurationService} from './configuration.service';
@@ -59,7 +59,7 @@ export class NotificationService extends UtilsService {
               return EMPTY;
             }
           }),
-          catchError(err => {
+          catchError((err: GobalError) => {
             this.toast.error('notification.error', {
               err: NotificationService.getErrorMessage(err),
             });

src/app/service/toast.service.ts

@@ -4,7 +4,7 @@ import {TranslateService} from '@ngx-translate/core';
 import {Level} from '@model/level';
 import {Utils} from '@shared/utils';
 
-type TranslateArgs = {[key: string]: number | string};
+type TranslateArgs = Record<string, number | string>;
 
 @Injectable({providedIn: 'root'})
 export class ToastService {
@@ -16,7 +16,7 @@ export class ToastService {
   open(level: Level, message: string, translateArgs?: TranslateArgs): void {
     if (Utils.isNotBlank(message)) {
       this.snackBar.open(
-        this.translate.instant(message, translateArgs),
+        this.translate.instant(message, translateArgs) as string,
         undefined,
         {
           duration: 3000,

src/app/service/utils.service.ts

@@ -14,7 +14,7 @@ import {
   HttpBodyRequest,
 } from '@model/http/http-request';
 
-type GobalError = Error | ErrorEvent | HttpErrorResponse | string;
+export type GobalError = Error | ErrorEvent | HttpErrorResponse | string;
 
 @Injectable({
   providedIn: 'root',