angular version update

package.json

@@ -21,17 +21,17 @@
   },
   "private": true,
   "dependencies": {
-    "@angular-devkit/build-angular": "^17.3.8",
-    "@angular/animations": "^17.3.10",
-    "@angular/cli": "^17.3.8",
-    "@angular/common": "^17.3.10",
-    "@angular/compiler": "^17.3.10",
-    "@angular/compiler-cli": "^17.3.10",
-    "@angular/core": "^17.3.10",
-    "@angular/forms": "^17.3.10",
-    "@angular/platform-browser": "^17.3.10",
-    "@angular/platform-browser-dynamic": "^17.3.10",
-    "@angular/router": "^17.3.10",
+    "@angular-devkit/build-angular": "^18.2.12",
+    "@angular/animations": "^18.2.13",
+    "@angular/cli": "^18.2.12",
+    "@angular/common": "^18.2.13",
+    "@angular/compiler": "^18.2.13",
+    "@angular/compiler-cli": "^18.2.13",
+    "@angular/core": "^18.2.13",
+    "@angular/forms": "^18.2.13",
+    "@angular/platform-browser": "^18.2.13",
+    "@angular/platform-browser-dynamic": "^18.2.13",
+    "@angular/router": "^18.2.13",
     "@auth0/angular-jwt": "^5.1.0",
     "@rxweb/reactive-form-validators": "^2.1.6",
     "@sentry/angular": "^8.18.0",

src/app/app.module.ts

@@ -5,7 +5,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 
-import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
+import { HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 
 // External Libraries
 import { IconSpriteModule } from 'ng-svg-icon-sprite';
@@ -22,52 +22,46 @@ import { Sage300ConfigurationModule } from './integrations/sage300/sage300-main/
 import * as Sentry from "@sentry/angular";
 import { Router } from '@angular/router';
 
-@NgModule({
-  declarations: [
-    AppComponent
-  ],
-  imports: [
-    BrowserModule,
-    AppRoutingModule,
-    BrowserAnimationsModule,
-    HttpClientModule,
-    ToastModule,
-    SharedModule,
-    RippleModule,
-    IconSpriteModule.forRoot({ path: 'assets/sprites/sprite.svg' }),
-    Sage300ConfigurationModule
-  ],
-  providers: [
-    MessageService,
-    {
-      provide: JWT_OPTIONS,
-      useValue: JWT_OPTIONS
-    },
-    JwtHelperService,
-    {
-      provide: HTTP_INTERCEPTORS,
-      useClass: JwtInterceptor,
-      multi: true
-    },
-    {
-      provide: ErrorHandler,
-      useClass: GlobalErrorHandler
-    },
-    {
-      provide: ErrorHandler,
-      useValue: Sentry.createErrorHandler()
-    },
-    {
-      provide: Sentry.TraceService,
-      deps: [Router]
-    },
-    {
-      provide: APP_INITIALIZER,
-      useFactory: (brandingService: BrandingService) => () => brandingService.init(),
-      deps: [BrandingService, Sentry.TraceService],
-      multi: true
-    }
-  ],
-  bootstrap: [AppComponent]
-})
+@NgModule({ declarations: [
+        AppComponent
+    ],
+    bootstrap: [AppComponent], imports: [BrowserModule,
+        AppRoutingModule,
+        BrowserAnimationsModule,
+        ToastModule,
+        SharedModule,
+        RippleModule,
+        IconSpriteModule.forRoot({ path: 'assets/sprites/sprite.svg' }),
+        Sage300ConfigurationModule], providers: [
+        MessageService,
+        {
+            provide: JWT_OPTIONS,
+            useValue: JWT_OPTIONS
+        },
+        JwtHelperService,
+        {
+            provide: HTTP_INTERCEPTORS,
+            useClass: JwtInterceptor,
+            multi: true
+        },
+        {
+            provide: ErrorHandler,
+            useClass: GlobalErrorHandler
+        },
+        {
+            provide: ErrorHandler,
+            useValue: Sentry.createErrorHandler()
+        },
+        {
+            provide: Sentry.TraceService,
+            deps: [Router]
+        },
+        {
+            provide: APP_INITIALIZER,
+            useFactory: (brandingService: BrandingService) => () => brandingService.init(),
+            deps: [BrandingService, Sentry.TraceService],
+            multi: true
+        },
+        provideHttpClient(withInterceptorsFromDi())
+    ] })
 export class AppModule { }

src/app/auth/login/login.component.spec.ts

@@ -1,4 +1,4 @@
-import { HttpClientModule } from '@angular/common/http';
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ActivatedRoute, Router } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
@@ -23,23 +23,22 @@ xdescribe('LoginComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [
-        HttpClientModule, RouterTestingModule
-      ],
-      declarations: [ LoginComponent ],
-      providers: [
+    declarations: [LoginComponent],
+    imports: [RouterTestingModule],
+    providers: [
         {
-          provide: ActivatedRoute,
-          useValue: {
-            queryParams: of({
-              code: 'dummy-auth-code'
-            })
-          }
+            provide: ActivatedRoute,
+            useValue: {
+                queryParams: of({
+                    code: 'dummy-auth-code'
+                })
+            }
         },
-        { provide: AuthService, useValue: service1},
-        { provide: Router, useValue: routerSpy }
-      ]
-    })
+        { provide: AuthService, useValue: service1 },
+        { provide: Router, useValue: routerSpy },
+        provideHttpClient(withInterceptorsFromDi())
+    ]
+})
     .compileComponents();
 
     fixture = TestBed.createComponent(LoginComponent);

src/app/core/guard/auth.guard.spec.ts

@@ -1,6 +1,6 @@
 import { TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
-import { HttpClientModule } from '@angular/common/http';
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import { AuthGuard } from './auth.guard';
 import { AuthService } from '../services/common/auth.service';
 import { Router } from '@angular/router';
@@ -19,12 +19,13 @@ describe('AuthGuard', () => {
     };
 
     TestBed.configureTestingModule({
-      imports: [RouterTestingModule, HttpClientModule],
-      providers: [
-        {provide: AuthService, useValue: service1},
-        {provide: Router, useValue: router}
-      ]
-    });
+    imports: [RouterTestingModule],
+    providers: [
+        { provide: AuthService, useValue: service1 },
+        { provide: Router, useValue: router },
+        provideHttpClient(withInterceptorsFromDi())
+    ]
+});
 
     authService = TestBed.inject(AuthService);
     guard = TestBed.inject(AuthGuard);

src/app/core/interceptor/jwt.interceptor.spec.ts

@@ -1,8 +1,8 @@
 import { getTestBed, inject, TestBed } from '@angular/core/testing';
 import { JwtHelperService, JWT_OPTIONS } from '@auth0/angular-jwt';
-import { HttpClient, HttpRequest, HTTP_INTERCEPTORS } from '@angular/common/http';
+import { HttpClient, HttpRequest, HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import { JwtInterceptor } from './jwt.interceptor';
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { HttpTestingController, provideHttpClientTesting } from '@angular/common/http/testing';
 import { environment } from 'src/environments/environment';
 import { ApiService } from '../services/common/api.service';
 import { Observable, of } from 'rxjs';
@@ -29,26 +29,28 @@ xdescribe('JwtInterceptor', () => {
     };
 
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule],
-      providers: [
+    imports: [],
+    providers: [
         ApiService, JwtHelperService,
         {
-          provide: HTTP_INTERCEPTORS,
-          useClass: JwtInterceptor,
-          multi: true
+            provide: HTTP_INTERCEPTORS,
+            useClass: JwtInterceptor,
+            multi: true
         },
         {
-          provide: JWT_OPTIONS,
-          useValue: JWT_OPTIONS
+            provide: JWT_OPTIONS,
+            useValue: JWT_OPTIONS
         },
         {
-          provide: AuthService,
-          useValue: service1
+            provide: AuthService,
+            useValue: service1
         },
         JwtInterceptor,
-        JwtHelperService
-      ]
-    });
+        JwtHelperService,
+        provideHttpClient(withInterceptorsFromDi()),
+        provideHttpClientTesting()
+    ]
+});
 
     injector = getTestBed();
     client = TestBed.inject(HttpClient);

src/app/core/interceptor/jwt.interceptor.ts

@@ -1,11 +1,5 @@
 import { Injectable } from '@angular/core';
-import {
-  HttpRequest,
-  HttpHandler,
-  HttpEvent,
-  HttpInterceptor,
-  HttpErrorResponse
-} from '@angular/common/http';
+import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor, HttpErrorResponse } from '@angular/common/http';
 
 import { BehaviorSubject, Observable, of, throwError } from 'rxjs';
 import { catchError, filter, map, switchMap, take } from 'rxjs/operators';

src/app/core/services/bamboo-hr/bamboo-hr.service.spec.ts

@@ -1,10 +1,11 @@
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { HttpTestingController, provideHttpClientTesting } from '@angular/common/http/testing';
 import { getTestBed, TestBed } from '@angular/core/testing';
 import { environment } from 'src/environments/environment';
 import { OrgService } from '../org/org.service';
 import { bambooHRMockConfiguration, bambooHRMockConfigurationPayload, bambooHRMockConnectionPayload, bambooHrMockData } from './bamboo-hr.fixture';
 
 import { BambooHrService } from './bamboo-hr.service';
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 
 xdescribe('BambooHrService', () => {
   let service: BambooHrService;
@@ -18,13 +19,13 @@ xdescribe('BambooHrService', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [
-        HttpClientTestingModule
-      ],
-      providers: [
-        { provide: OrgService, useValue: service1 }
-      ]
-    });
+    imports: [],
+    providers: [
+        { provide: OrgService, useValue: service1 },
+        provideHttpClient(withInterceptorsFromDi()),
+        provideHttpClientTesting()
+    ]
+});
     injector = getTestBed();
     service = TestBed.inject(BambooHrService);
     orgService = injector.inject(OrgService);

src/app/core/services/common/api.service.spec.ts

@@ -1,9 +1,9 @@
 import { getTestBed, TestBed } from '@angular/core/testing';
 
-import { HttpTestingController, HttpClientTestingModule } from '@angular/common/http/testing';
+import { HttpTestingController, provideHttpClientTesting } from '@angular/common/http/testing';
 import { environment } from 'src/environments/environment';
 import { ApiService } from './api.service';
-import { HttpErrorResponse, HttpEventType, HttpHeaders } from '@angular/common/http';
+import { HttpErrorResponse, HttpEventType, HttpHeaders, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
 xdescribe('ApiService', () => {
@@ -19,11 +19,13 @@ xdescribe('ApiService', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule],
-      providers: [
-        ApiService
-      ]
-    });
+    imports: [],
+    providers: [
+        ApiService,
+        provideHttpClient(withInterceptorsFromDi()),
+        provideHttpClientTesting()
+    ]
+});
     injector = getTestBed();
     service = injector.inject(ApiService);
     httpMock = injector.inject(HttpTestingController);

src/app/core/services/common/auth.service.spec.ts

@@ -1,10 +1,11 @@
 import { getTestBed, TestBed } from '@angular/core/testing';
 import { AuthService } from './auth.service';
-import { HttpTestingController, HttpClientTestingModule } from '@angular/common/http/testing';
+import { HttpTestingController, provideHttpClientTesting } from '@angular/common/http/testing';
 import { UserService } from '../misc/user.service';
 import { environment } from 'src/environments/environment';
 import { Router } from '@angular/router';
 import { loginResponse, minimalUser, tokenResponse } from '../../interceptor/jwt.fixture';
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 
 xdescribe('AuthService', () => {
   let service: AuthService;
@@ -21,13 +22,15 @@ xdescribe('AuthService', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule],
-      providers: [
+    imports: [],
+    providers: [
         AuthService,
-        { provide: UserService, useValue: service1},
-        { provide: Router, useValue: routerSpy }
-      ]
-    });
+        { provide: UserService, useValue: service1 },
+        { provide: Router, useValue: routerSpy },
+        provideHttpClient(withInterceptorsFromDi()),
+        provideHttpClientTesting()
+    ]
+});
     injector = getTestBed();
     service = injector.inject(AuthService);
     userService = injector.inject(UserService);

src/app/core/services/common/clone-setting.service.spec.ts

@@ -1,8 +1,9 @@
 import { TestBed, getTestBed } from '@angular/core/testing';
 
 import { CloneSettingService } from './clone-setting.service';
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { HttpTestingController, provideHttpClientTesting } from '@angular/common/http/testing';
 import { environment } from 'src/environments/environment';
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 
 xdescribe('CloneSettingService', () => {
   let service: CloneSettingService;
@@ -13,10 +14,9 @@ xdescribe('CloneSettingService', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [
-        HttpClientTestingModule
-      ]
-    });
+    imports: [],
+    providers: [provideHttpClient(withInterceptorsFromDi()), provideHttpClientTesting()]
+});
     injector = getTestBed();
     service = TestBed.inject(CloneSettingService);
     httpMock = injector.inject(HttpTestingController);