ftr: update packages to newest version

TRACEFOSS-1023

Author: fbedarf

package.json

@@ -33,91 +33,95 @@
   },
   "private": true,
   "dependencies": {
-    "@angular-material-components/datetime-picker": "7.0.1",
+    "@angular-material-components/datetime-picker": "9.0.0",
     "@angular/animations": "15.1.5",
-    "@angular/cdk": "15.1.4",
+    "@angular/cdk": "15.1.5",
     "@angular/common": "15.1.5",
     "@angular/compiler": "15.1.5",
     "@angular/core": "15.1.5",
     "@angular/forms": "15.1.5",
-    "@angular/material": "15.1.4",
+    "@angular/material": "15.1.5",
     "@angular/platform-browser": "15.1.5",
     "@angular/platform-browser-dynamic": "15.1.5",
     "@angular/router": "15.1.5",
-    "@deck.gl/core": "8.8.20",
-    "@deck.gl/layers": "8.7.12",
-    "@deck.gl/mapbox": "8.8.22",
-    "@mapbox/mapbox-gl-language": "^1.0.0",
+    "@deck.gl/core": "8.8.24",
+    "@deck.gl/layers": "8.8.24",
+    "@deck.gl/mapbox": "8.8.24",
+    "@loaders.gl/core": "^3.3.0",
+    "@luma.gl/core": "^8.5.18",
+    "@mapbox/mapbox-gl-language": "^1.0.1",
     "@types/lodash-es": "4.17.6",
-    "angular-i18next": "11.0.0",
+    "angular-i18next": "15.0.5",
     "autoprefixer": "10.4.13",
-    "d3": "7.8.0",
-    "i18next": "21.10.0",
+    "d3": "7.8.2",
+    "esbuild": "^0.17.8",
+    "i18next": "22.4.9",
     "i18next-browser-languagedetector": "7.0.1",
-    "i18next-http-backend": "2.0.2",
-    "keycloak-angular": "10.0.2",
-    "keycloak-js": "18.0.1",
+    "i18next-http-backend": "2.1.1",
+    "keycloak-angular": "13.0.0",
+    "keycloak-js": "20.0.3",
     "lodash-es": "4.17.21",
+    "mapbox-gl": "^2.12.1",
     "maplibre-gl": "^2.4.0",
-    "postcss": "8.4.19",
-    "rxjs": "7.5.7",
-    "tailwindcss": "3.2.4",
-    "tslib": "2.4.1",
+    "postcss": "8.4.21",
+    "rxjs": "7.8.0",
+    "tailwindcss": "3.2.7",
+    "tslib": "2.5.0",
     "webpack": "5.75.0",
-    "zone.js": "0.11.8"
+    "zone.js": "0.12.0"
   },
   "devDependencies": {
     "@angular-builders/custom-webpack": "15.0.0",
     "@angular-devkit/build-angular": "15.1.6",
-    "@angular-eslint/builder": "15.1.0",
-    "@angular-eslint/eslint-plugin": "15.2.0",
+    "@angular-eslint/builder": "15.2.1",
+    "@angular-eslint/eslint-plugin": "15.2.1",
     "@angular-eslint/eslint-plugin-template": "15.2.1",
     "@angular-eslint/schematics": "15.2.1",
     "@angular-eslint/template-parser": "15.2.1",
     "@angular/cli": "15.1.6",
     "@angular/compiler-cli": "15.1.5",
     "@angular/language-service": "15.1.5",
-    "@badeball/cypress-cucumber-preprocessor": "^15.0.0",
-    "@bahmutov/cypress-esbuild-preprocessor": "^2.1.5",
-    "@commitlint/cli": "17.4.2",
-    "@commitlint/config-conventional": "16.2.4",
-    "@cypress/schematic": "2.4.0",
+    "@badeball/cypress-cucumber-preprocessor": "^15.1.3",
+    "@bahmutov/cypress-esbuild-preprocessor": "^2.2.0",
+    "@commitlint/cli": "17.4.3",
+    "@commitlint/config-conventional": "17.4.3",
+    "@cypress/schematic": "2.5.0",
     "@testing-library/angular": "13.1.0",
-    "@testing-library/jasmine-dom": "1.2.0",
+    "@testing-library/jasmine-dom": "1.3.3",
     "@types/d3": "7.4.0",
     "@types/jasmine": "4.3.1",
     "@types/luxon": "3.2.0",
-    "@types/node": "18.11.4",
-    "@types/testing-library__jasmine-dom": "^1.0.3",
-    "@typescript-eslint/eslint-plugin": "5.48.0",
-    "@typescript-eslint/parser": "5.49.0",
-    "cypress": "^12.4.0",
-    "eslint": "8.28.0",
-    "eslint-config-prettier": "8.5.0",
+    "@types/node": "^18.13.0",
+    "@types/testing-library__jasmine-dom": "^1.3.0",
+    "@typescript-eslint/eslint-plugin": "5.52.0",
+    "@typescript-eslint/parser": "5.52.0",
+    "cypress": "^12.5.1",
+    "eslint": "8.34.0",
+    "eslint-config-prettier": "8.6.0",
     "eslint-plugin-import": "2.27.5",
-    "eslint-plugin-jsdoc": "39.6.4",
+    "eslint-plugin-jsdoc": "40.0.0",
     "eslint-plugin-prefer-arrow": "1.2.3",
-    "husky": "8.0.2",
-    "jasmine-core": "4.3.0",
+    "husky": "8.0.3",
+    "jasmine-core": "4.5.0",
     "karma": "6.4.1",
-    "karma-chrome-launcher": "3.1.0",
+    "karma-chrome-launcher": "3.1.1",
     "karma-coverage": "2.2.0",
     "karma-jasmine": "5.1.0",
     "karma-jasmine-html-reporter": "2.0.0",
     "karma-sonarqube-reporter": "1.4.0",
-    "lint-staged": "13.0.3",
-    "msw": "1.0.0",
+    "lint-staged": "13.1.2",
+    "msw": "1.0.1",
     "playwright-webkit": "^1.30.0",
     "postcss-import": "15.1.0",
     "postcss-loader": "7.0.2",
-    "postcss-scss": "4.0.4",
-    "prettier": "2.7.1",
-    "stylelint": "14.16.1",
-    "stylelint-config-standard-scss": "4.0.0",
+    "postcss-scss": "4.0.6",
+    "prettier": "2.8.4",
+    "stylelint": "15.1.0",
+    "stylelint-config-standard-scss": "7.0.1",
     "ts-loader": "^9.4.2",
     "ts-node": "10.9.1",
     "typescript": "4.9.5",
-    "webpack-bundle-analyzer": "4.5.0"
+    "webpack-bundle-analyzer": "4.8.0"
   },
   "msw": {
     "workerDirectory": "src"

src/app/modules/core/extensions/fetch-custom-protocols.ts

@@ -58,16 +58,18 @@ export const buildCustomProtocolResolver = (customProtocolsRegistry: CustomProto
     const resolution = customProtocolResolution[prefix];
     const fullPrefix = customProtocolName + ':' + prefix;
 
-    const originalQueryParams = Object.fromEntries(new URL(url).searchParams);
+    const originalQueryParams = {};
+    new URL(url).searchParams.forEach((key, value) => (originalQueryParams[key] = value));
+
     const cleanUrl = url.split('?')[0];
 
     const targetQueryParams = new HttpParams({
       fromObject: { ...originalQueryParams, ...resolution.queryParams },
     }).toString();
 
     const hasQueryParams = Object.keys(targetQueryParams).length > 0;
-    const tartegUrlWithoutParams = cleanUrl.replace(fullPrefix, resolution.pathname) + (resolution.postfix ?? '');
-    return tartegUrlWithoutParams + (hasQueryParams ? '?' + targetQueryParams : '');
+    const targetUrlWithoutParams = cleanUrl.replace(fullPrefix, resolution.pathname) + (resolution.postfix ?? '');
+    return targetUrlWithoutParams + (hasQueryParams ? '?' + targetQueryParams : '');
   };
 };
 

src/app/modules/page/about/presentation/about.component.html

@@ -23,6 +23,6 @@
   <app-header [title]="'pageAbout.title' | i18n"></app-header>
   <section
     class="mt-4 regular-text"
-    [innerHTML]="'pageAbout.content' | i18n: { interpolation: { escapeValue: false } }"
+    [innerHTML]="'pageAbout.content' | i18n : { interpolation: { escapeValue: false } }"
   ></section>
 </div>

src/app/modules/page/dashboard/presentation/map/map.component.ts

@@ -26,7 +26,7 @@ import { MapboxLayer } from '@deck.gl/mapbox';
 import MapboxLanguage from '@mapbox/mapbox-gl-language';
 import { I18NEXT_SERVICE, ITranslationService } from 'angular-i18next';
 import * as mapboxGl from 'maplibre-gl';
-import { Map, NavigationControl } from 'maplibre-gl';
+import { IControl, Map, NavigationControl } from 'maplibre-gl';
 import { distinctUntilChanged } from 'rxjs/operators';
 import { environment } from 'src/environments/environment';
 import { MAPPING, PartsCoordinates, supportedLanguages } from './map.model';
@@ -75,7 +75,7 @@ export class MapComponent implements AfterViewInit {
       this.map.remove();
     }
 
-    const locale: Record<string, string> = this.i18NextService.t('map', { returnObjects: true });
+    const locale = this.i18NextService.t('map', { returnObjects: true }) as unknown as Record<string, string>;
     this.map = new Map({
       container: this.mapElRef.nativeElement,
       style: environment.mapStyles,
@@ -90,7 +90,7 @@ export class MapComponent implements AfterViewInit {
       ? this.i18NextService.language
       : 'mul';
 
-    const language = new MapboxLanguage({ defaultLanguage });
+    const language = new MapboxLanguage({ defaultLanguage }) as unknown as IControl;
     this.map.addControl(language);
 
     this.map.addControl(

src/app/modules/shared/components/notification-reason/notification-reason.component.html

@@ -34,7 +34,7 @@
         <p>{{ 'commonInvestigation.status.' + message?.status | i18n }}</p>
         <p class="message--text__date flex items-center" *ngIf="message.date">
           <mat-icon class="message--text__date-icon">access_time</mat-icon
-          >{{ message.date | formatDate: { dateStyle: 'short', timeStyle: 'short' } }}
+          >{{ message.date | formatDate : { dateStyle: 'short', timeStyle: 'short' } }}
         </p>
       </div>
     </div>

src/app/modules/shared/components/pagination/paginator-intl.service.ts

@@ -35,7 +35,7 @@ export class PaginatorIntlService implements MatPaginatorIntl {
   public changes: Subject<void>;
 
   constructor(@Inject(I18NEXT_SERVICE) private readonly i18NextService: ITranslationService) {
-    // unfortuantelly BehaviorSubject<string | null> cannot be automatically casted to Subject<void>
+    // fortuneteller BehaviorSubject<string | null> cannot be automatically cast to Subject<void>
     // which is required by MatPaginatorIntl
     const languageChanged = i18NextService.events.languageChanged as unknown as Subject<void>;
 
@@ -47,7 +47,7 @@ export class PaginatorIntlService implements MatPaginatorIntl {
 
   public getRangeLabel(page: number, pageSize: number, length: number): string {
     if (length == 0 || pageSize == 0) {
-      return this.i18NextService.t('pagination.emptyRange', { length });
+      return this.i18NextService.t('pagination.emptyRange', { length } as Record<string, number>);
     }
     length = Math.max(length, 0);
     const startIndex = page * pageSize;
@@ -57,7 +57,7 @@ export class PaginatorIntlService implements MatPaginatorIntl {
       startIndex: startIndex + 1,
       endIndex,
       length,
-    });
+    } as Record<string, number>);
   }
 
   private setLabels() {

src/app/modules/shared/components/select/select.component.html

@@ -40,5 +40,5 @@
 </ng-template>
 
 <ng-template let-lable="value" #normalOption>
-  {{ lable | valueToLable: options | i18n }}
+  {{ lable | valueToLable : options | i18n }}
 </ng-template>

src/app/modules/shared/components/table/table.component.html

@@ -22,7 +22,7 @@
 <div [class.mat-elevation-z8]="!noShadow">
   <ng-container *ngIf="selectedPartsInfoLabel">
     <div *appHasRole="tableConfig.columnRoles?.['select'] ?? 'user'" class="table--selected__container">
-      <p class="regular-text">{{ selectedPartsInfoLabel | i18n: { count: selection?.selected?.length || 0 } }}</p>
+      <p class="regular-text">{{ selectedPartsInfoLabel | i18n : { count: selection?.selected?.length || 0 } }}</p>
       <app-button
         *ngIf="this.selection?.selected?.length"
         (click)="clickSelectAction.emit()"

src/app/modules/shared/pipes/format-date.pipe.ts

@@ -22,7 +22,6 @@
 import { Inject, OnDestroy, Pipe, PipeTransform } from '@angular/core';
 import { CalendarDateModel } from '@core/model/calendar-date.model';
 import { I18NEXT_SERVICE, ITranslationService } from 'angular-i18next';
-import { DateTimeFormatOptions } from 'luxon';
 import type { Subscription } from 'rxjs';
 import { filter } from 'rxjs/operators';
 
@@ -33,7 +32,7 @@ interface DateFormatOptions {
 @Pipe({ name: 'formatDate', pure: false })
 export class FormatDatePipe implements PipeTransform, OnDestroy {
   private readonly languageChangedSubscription: Subscription;
-  private readonly formatOptions = { dateStyle: 'short' } as DateTimeFormatOptions;
+  private readonly formatOptions = { dateStyle: 'short' } as Intl.DateTimeFormatOptions;
   private language: string;
 
   constructor(@Inject(I18NEXT_SERVICE) { language, events }: ITranslationService) {
@@ -48,7 +47,7 @@ export class FormatDatePipe implements PipeTransform, OnDestroy {
     this.languageChangedSubscription.unsubscribe();
   }
 
-  public transform(input: string | CalendarDateModel, dateTimeOptions?: DateTimeFormatOptions): string {
+  public transform(input: string | CalendarDateModel, dateTimeOptions?: Intl.DateTimeFormatOptions): string {
     if (!input) {
       return '--';
     }

src/mockServiceWorker.js

@@ -23,7 +23,7 @@
 /* tslint:disable */
 
 /**
- * Mock Service Worker (1.0.0).
+ * Mock Service Worker (1.0.1).
  * @see https://github.com/mswjs/msw
  * - Please do NOT modify this file.
  * - Please do NOT serve this file on production.