feat(admin): ⬆️ update to Angular V18

* chore(admin): upgrading core angular to 18

* fix(admins): retrograde matomo & date-fns

* fix(admins): fixing typescript supported version & updating devkit/architect

* fix(admins): migration testing modules

* fix(admins): fixing matomo version conflict

* fix(admin): update packages

---------

Co-authored-by: Yassine R. <riffi.yassine@gmail.com>

Author: hbalty

.talismanrc

@@ -20,6 +20,6 @@ fileignoreconfig:
 - filename: packages/portail-admins/src/app/modules/admin-structures/utils/structure-filter-criteria.ts
   checksum: c54f1bf45a44280960869561243668e7a92713fb5265f008a95fc3fe66014bf1
 - filename: yarn.lock
-  checksum: 2724a73393a5b8c99b70618747aa501c5eddc444d4a3a26b635faacd9d9cb6e1
+  checksum: 4ce26d3d2734a1b84df51abc67dd6fd9391bd3fb1c4b5469e892d3b88f96285c
 threshold: medium
 version: "1.0"

packages/portail-admins/angular.json

@@ -17,7 +17,7 @@
             "outputPath": "dist/domifa-portail-admins",
             "index": "src/index.html",
             "main": "src/main.ts",
-            "polyfills": "src/polyfills.ts",
+            "polyfills": ["@angular/localize/init", "zone.js"],
             "tsConfig": "./tsconfig.app.json",
             "assets": ["src/assets"],
             "styles": [

packages/portail-admins/jest.config.js

@@ -1,7 +1,6 @@
 module.exports = {
   preset: "jest-preset-angular",
   setupFilesAfterEnv: ["<rootDir>/setup-jest.ts"],
-  globalSetup: "jest-preset-angular/global-setup",
   moduleNameMapper: {
     "^src/(.*)$": "<rootDir>/src/$1",
     "^app/(.*)$": "<rootDir>/src/app/$1",

packages/portail-admins/package.json

@@ -18,7 +18,7 @@
   "private": true,
   "dependencies": {
     "@angular/animations": "^18.2.13",
-    "@angular/cdk": "^18.2.13",
+    "@angular/cdk": "^18.2.14",
     "@angular/common": "^18.2.13",
     "@angular/compiler": "^18.2.13",
     "@angular/core": "^18.2.13",
@@ -50,15 +50,15 @@
   },
   "devDependencies": {
     "@angular-devkit/architect": "^0.2001.5",
-    "@angular-devkit/build-angular": "^18.2.13",
-    "@angular-devkit/core": "^18.2.13",
-    "@angular-devkit/schematics": "^18.1.1",
+    "@angular-devkit/build-angular": "^18.2.20",
+    "@angular-devkit/core": "^18.2.20",
+    "@angular-devkit/schematics": "^18.2.20",
     "@angular-eslint/builder": "^17.5.3",
     "@angular-eslint/eslint-plugin": "^17.5.3",
     "@angular-eslint/eslint-plugin-template": "^17.5.3",
     "@angular-eslint/schematics": "^17.5.3",
     "@angular-eslint/template-parser": "^17.5.3",
-    "@angular/cli": "^18.2.13",
+    "@angular/cli": "^18.2.20",
     "@angular/compiler-cli": "^18.2.13",
     "@angular/language-service": "^18.2.13",
     "@schematics/update": "^0.1102.18",

packages/portail-admins/src/app/app.component.spec.ts

@@ -1,14 +1,15 @@
-import { HttpClientTestingModule } from "@angular/common/http/testing";
 import { CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA } from "@angular/core";
 import { TestBed, waitForAsync } from "@angular/core/testing";
 import { RouterModule } from "@angular/router";
 import { AppComponent } from "./app.component";
+import { provideHttpClient } from "@angular/common/http";
 
 describe("AppComponent", () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [AppComponent],
-      imports: [HttpClientTestingModule, RouterModule.forRoot([])],
+      imports: [RouterModule.forRoot([])],
+      providers: [provideHttpClient()],
       schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
     }).compileComponents();
   }));

packages/portail-admins/src/app/app.module.ts

@@ -1,4 +1,8 @@
-import { HttpClientModule, HTTP_INTERCEPTORS } from "@angular/common/http";
+import {
+  HTTP_INTERCEPTORS,
+  provideHttpClient,
+  withInterceptorsFromDi,
+} from "@angular/common/http";
 import {
   CUSTOM_ELEMENTS_SCHEMA,
   ErrorHandler,
@@ -49,13 +53,13 @@ registerLocaleData(localeFr, "fr");
     GeneralModule,
     BrowserModule,
     FormsModule,
-    HttpClientModule,
     NgbModule,
     SharedModule,
     ReactiveFormsModule,
     MATOMO_INJECTORS,
   ],
   providers: [
+    provideHttpClient(withInterceptorsFromDi()),
     { provide: LOCALE_ID, useValue: "fr" },
     { provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
     {

packages/portail-admins/src/app/guards/auth-guard.spec.ts

@@ -1,5 +1,4 @@
 import { APP_BASE_HREF } from "@angular/common";
-import { HttpClientTestingModule } from "@angular/common/http/testing";
 import { inject, TestBed } from "@angular/core/testing";
 import {
   ActivatedRouteSnapshot,
@@ -10,6 +9,7 @@ import { RouterModule } from "@angular/router";
 import { AdminAuthService } from "../modules/admin-auth/services/admin-auth.service";
 import { AuthGuard } from "./auth-guard";
 import { CustomToastService } from "../modules/shared/services";
+import { provideHttpClient } from "@angular/common/http";
 
 describe("AuthGuard", () => {
   let authGuard: AuthGuard;
@@ -19,8 +19,9 @@ describe("AuthGuard", () => {
   let toastService: CustomToastService;
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule, RouterModule],
+      imports: [RouterModule],
       providers: [
+        provideHttpClient(),
         AuthGuard,
         {
           provide: ActivatedRouteSnapshot,

packages/portail-admins/src/app/guards/redirect-guard.spec.ts

@@ -1,10 +1,10 @@
 import { APP_BASE_HREF } from "@angular/common";
-import { HttpClientTestingModule } from "@angular/common/http/testing";
 import { inject, TestBed } from "@angular/core/testing";
 import { Router } from "@angular/router";
 import { RouterModule } from "@angular/router";
 import { AdminAuthService } from "../modules/admin-auth/services/admin-auth.service";
 import { RoleRedirectGuard } from "./redirect-guard";
+import { provideHttpClient } from "@angular/common/http";
 
 describe("RoleRedirectGuard", () => {
   let guard: RoleRedirectGuard;
@@ -13,8 +13,9 @@ describe("RoleRedirectGuard", () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule, RouterModule],
+      imports: [RouterModule],
       providers: [
+        provideHttpClient(),
         RoleRedirectGuard,
         AdminAuthService,
         { provide: APP_BASE_HREF, useValue: "/" },

packages/portail-admins/src/app/modules/admin-auth/admin-auth.module.ts

@@ -1,24 +1,26 @@
 import { CommonModule } from "@angular/common";
-import { HttpClientModule } from "@angular/common/http";
 import { NgModule } from "@angular/core";
 import { FormsModule, ReactiveFormsModule } from "@angular/forms";
 import { FontAwesomeModule } from "@fortawesome/angular-fontawesome";
 import { SharedModule } from "../shared/shared.module";
 import { AdminAuthRoutingModule } from "./admin-auth-routing.module";
 import { AdminLoginComponent } from "./admin-login/admin-login.component";
 import { AdminAuthService } from "./services/admin-auth.service";
+import {
+  provideHttpClient,
+  withInterceptorsFromDi,
+} from "@angular/common/http";
 
 @NgModule({
   declarations: [AdminLoginComponent],
   imports: [
     CommonModule,
     AdminAuthRoutingModule,
-    HttpClientModule,
     FormsModule,
     FontAwesomeModule,
     SharedModule,
     ReactiveFormsModule,
   ],
-  providers: [AdminAuthService],
+  providers: [provideHttpClient(withInterceptorsFromDi()), AdminAuthService],
 })
 export class AdminAuthModule {}

packages/portail-admins/src/app/modules/admin-auth/admin-login/admin-login.component.spec.ts

@@ -1,10 +1,10 @@
-import { HttpClientTestingModule } from "@angular/common/http/testing";
 import { CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA } from "@angular/core";
 import { ComponentFixture, TestBed } from "@angular/core/testing";
 import { FormsModule, ReactiveFormsModule } from "@angular/forms";
 import { RouterModule } from "@angular/router";
 import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
 import { AdminLoginComponent } from "./admin-login.component";
+import { provideHttpClient } from "@angular/common/http";
 
 describe("AdminLoginComponent", () => {
   let component: AdminLoginComponent;
@@ -14,12 +14,12 @@ describe("AdminLoginComponent", () => {
     await TestBed.configureTestingModule({
       declarations: [AdminLoginComponent],
       imports: [
-        HttpClientTestingModule,
         ReactiveFormsModule,
         NgbModule,
         FormsModule,
         RouterModule.forRoot([]),
       ],
+      providers: [provideHttpClient()],
       schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
     }).compileComponents();
   });