Update to Angular v19

package.json

@@ -13,17 +13,17 @@
     "test": "ng test"
   },
   "dependencies": {
-    "@angular/animations": "18.2.13",
+    "@angular/animations": "19.0.5",
     "@angular/cdk": "18.2.14",
-    "@angular/common": "18.2.13",
+    "@angular/common": "19.0.5",
-    "@angular/compiler": "18.2.13",
+    "@angular/compiler": "19.0.5",
-    "@angular/core": "18.2.13",
+    "@angular/core": "19.0.5",
-    "@angular/forms": "18.2.13",
+    "@angular/forms": "19.0.5",
     "@angular/material": "18.2.14",
     "@angular/material-luxon-adapter": "18.2.14",
-    "@angular/platform-browser": "18.2.13",
+    "@angular/platform-browser": "19.0.5",
-    "@angular/platform-browser-dynamic": "18.2.13",
+    "@angular/platform-browser-dynamic": "19.0.5",
-    "@angular/router": "18.2.13",
+    "@angular/router": "19.0.5",
     "@ngneat/transloco": "6.0.4",
     "apexcharts": "3.49.1",
     "crypto-js": "4.2.0",
@@ -36,12 +36,12 @@
     "quill": "2.0.2",
     "rxjs": "7.8.1",
     "tslib": "2.6.3",
-    "zone.js": "0.14.10"
+    "zone.js": "0.15.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "18.2.12",
+    "@angular-devkit/build-angular": "19.0.6",
-    "@angular/cli": "18.2.12",
+    "@angular/cli": "19.0.6",
-    "@angular/compiler-cli": "18.2.13",
+    "@angular/compiler-cli": "19.0.5",
     "@tailwindcss/typography": "0.5.13",
     "@types/chroma-js": "2.4.4",
     "@types/crypto-js": "4.2.2",

src/@fuse/components/alert/alert.component.ts

@@ -34,7 +34,6 @@ import { Subject, filter, takeUntil } from 'rxjs';
     changeDetection: ChangeDetectionStrategy.OnPush,
     animations: fuseAnimations,
     exportAs: 'fuseAlert',
-    standalone: true,
     imports: [MatIconModule, MatButtonModule],
 })
 export class FuseAlertComponent implements OnChanges, OnInit, OnDestroy {

src/@fuse/components/card/card.component.ts

@@ -18,7 +18,6 @@ import { FuseCardFace } from '@fuse/components/card/card.types';
     encapsulation: ViewEncapsulation.None,
     animations: fuseAnimations,
     exportAs: 'fuseCard',
-    standalone: true,
     imports: [],
 })
 export class FuseCardComponent implements OnChanges {

src/@fuse/components/fullscreen/fullscreen.component.ts

@@ -17,7 +17,6 @@ import { MatTooltipModule } from '@angular/material/tooltip';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'fuseFullscreen',
-    standalone: true,
     imports: [
         MatButtonModule,
         MatTooltipModule,

src/@fuse/components/highlight/highlight.component.ts

@@ -25,7 +25,6 @@ import { FuseHighlightService } from '@fuse/components/highlight/highlight.servi
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'fuseHighlight',
-    standalone: true,
     imports: [NgClass],
 })
 export class FuseHighlightComponent implements OnChanges, AfterViewInit {

src/@fuse/components/loading-bar/loading-bar.component.ts

@@ -20,7 +20,6 @@ import { Subject, takeUntil } from 'rxjs';
     styleUrls: ['./loading-bar.component.scss'],
     encapsulation: ViewEncapsulation.None,
     exportAs: 'fuseLoadingBar',
-    standalone: true,
     imports: [MatProgressBarModule],
 })
 export class FuseLoadingBarComponent implements OnChanges, OnInit, OnDestroy {

src/@fuse/components/masonry/masonry.component.ts

@@ -16,7 +16,6 @@ import { fuseAnimations } from '@fuse/animations';
     encapsulation: ViewEncapsulation.None,
     animations: fuseAnimations,
     exportAs: 'fuseMasonry',
-    standalone: true,
     imports: [NgTemplateOutlet],
 })
 export class FuseMasonryComponent implements OnChanges, AfterViewInit {

src/@fuse/components/navigation/horizontal/components/basic/basic.component.ts

@@ -26,7 +26,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-horizontal-navigation-basic-item',
     templateUrl: './basic.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         NgClass,
         RouterLink,

src/@fuse/components/navigation/horizontal/components/branch/branch.component.ts

@@ -25,7 +25,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-horizontal-navigation-branch-item',
     templateUrl: './branch.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         NgClass,
         MatMenuModule,

src/@fuse/components/navigation/horizontal/components/divider/divider.component.ts

@@ -17,7 +17,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-horizontal-navigation-divider-item',
     templateUrl: './divider.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [NgClass],
 })
 export class FuseHorizontalNavigationDividerItemComponent

src/@fuse/components/navigation/horizontal/components/spacer/spacer.component.ts

@@ -17,7 +17,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-horizontal-navigation-spacer-item',
     templateUrl: './spacer.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [NgClass],
 })
 export class FuseHorizontalNavigationSpacerItemComponent

src/@fuse/components/navigation/horizontal/horizontal.component.ts

@@ -27,7 +27,6 @@ import { FuseHorizontalNavigationSpacerItemComponent } from './components/spacer
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'fuseHorizontalNavigation',
-    standalone: true,
     imports: [
         FuseHorizontalNavigationBasicItemComponent,
         FuseHorizontalNavigationBranchItemComponent,

src/@fuse/components/navigation/vertical/components/aside/aside.component.ts

@@ -28,7 +28,6 @@ import { Subject, filter, takeUntil } from 'rxjs';
     selector: 'fuse-vertical-navigation-aside-item',
     templateUrl: './aside.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         NgClass,
         MatTooltipModule,

src/@fuse/components/navigation/vertical/components/basic/basic.component.ts

@@ -25,7 +25,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-vertical-navigation-basic-item',
     templateUrl: './basic.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         NgClass,
         RouterLink,

src/@fuse/components/navigation/vertical/components/collapsable/collapsable.component.ts

@@ -29,7 +29,6 @@ import { Subject, filter, takeUntil } from 'rxjs';
     templateUrl: './collapsable.component.html',
     animations: fuseAnimations,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         NgClass,
         MatTooltipModule,

src/@fuse/components/navigation/vertical/components/divider/divider.component.ts

@@ -17,7 +17,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-vertical-navigation-divider-item',
     templateUrl: './divider.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [NgClass],
 })
 export class FuseVerticalNavigationDividerItemComponent

src/@fuse/components/navigation/vertical/components/group/group.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-vertical-navigation-group-item',
     templateUrl: './group.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         NgClass,
         MatIconModule,

src/@fuse/components/navigation/vertical/components/spacer/spacer.component.ts

@@ -17,7 +17,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'fuse-vertical-navigation-spacer-item',
     templateUrl: './spacer.component.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [NgClass],
 })
 export class FuseVerticalNavigationSpacerItemComponent

src/@fuse/components/navigation/vertical/vertical.component.ts

@@ -64,7 +64,6 @@ import {
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'fuseVerticalNavigation',
-    standalone: true,
     imports: [
         FuseScrollbarDirective,
         FuseVerticalNavigationAsideItemComponent,

src/@fuse/fuse.provider.ts

@@ -1,11 +1,11 @@
 import { provideHttpClient, withInterceptors } from '@angular/common/http';
 import {
-    APP_INITIALIZER,
-    ENVIRONMENT_INITIALIZER,
     EnvironmentProviders,
     Provider,
     importProvidersFrom,
     inject,
+    provideAppInitializer,
+    provideEnvironmentInitializer,
 } from '@angular/core';
 import { MATERIAL_SANITY_CHECKS } from '@angular/material/core';
 import { MatDialogModule } from '@angular/material/dialog';
@@ -29,7 +29,7 @@ import { FuseUtilsService } from '@fuse/services/utils';
 export type FuseProviderConfig = {
     mockApi?: {
         delay?: number;
-        services?: any[];
+        service?: any;
     };
     fuse?: FuseConfig;
 };
@@ -68,51 +68,24 @@ export const provideFuse = (
         },
 
         importProvidersFrom(MatDialogModule),
-        {
+        provideEnvironmentInitializer(() => inject(FuseConfirmationService)),
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(FuseConfirmationService),
-            multi: true,
-        },
 
         provideHttpClient(withInterceptors([fuseLoadingInterceptor])),
-        {
+        provideEnvironmentInitializer(() => inject(FuseLoadingService)),
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(FuseLoadingService),
-            multi: true,
-        },
 
-        {
+        provideEnvironmentInitializer(() => inject(FuseMediaWatcherService)),
-            provide: ENVIRONMENT_INITIALIZER,
+        provideEnvironmentInitializer(() => inject(FusePlatformService)),
-            useValue: () => inject(FuseMediaWatcherService),
+        provideEnvironmentInitializer(() => inject(FuseSplashScreenService)),
-            multi: true,
+        provideEnvironmentInitializer(() => inject(FuseUtilsService)),
-        },
-        {
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(FusePlatformService),
-            multi: true,
-        },
-        {
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(FuseSplashScreenService),
-            multi: true,
-        },
-        {
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(FuseUtilsService),
-            multi: true,
-        },
     ];
 
     // Mock Api services
-    if (config?.mockApi?.services) {
+    if (config?.mockApi?.service) {
         providers.push(
             provideHttpClient(withInterceptors([mockApiInterceptor])),
-            {
+            provideAppInitializer(() => {
-                provide: APP_INITIALIZER,
+                const mockApiService = inject(config.mockApi.service);
-                deps: [...config.mockApi.services],
+            })
-                useFactory: () => (): any => null,
-                multi: true,
-            }
         );
     }
 

src/@fuse/services/confirmation/dialog/dialog.component.ts

@@ -24,7 +24,6 @@ import { FuseConfirmationConfig } from '@fuse/services/confirmation/confirmation
         `,
     ],
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatButtonModule, MatDialogModule, MatIconModule, NgClass],
 })
 export class FuseConfirmationDialogComponent {

src/app/app.component.ts

@@ -5,7 +5,6 @@ import { RouterOutlet } from '@angular/router';
     selector: 'app-root',
     templateUrl: './app.component.html',
     styleUrls: ['./app.component.scss'],
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class AppComponent {

src/app/app.config.ts

@@ -1,5 +1,10 @@
 import { provideHttpClient } from '@angular/common/http';
-import { APP_INITIALIZER, ApplicationConfig, inject } from '@angular/core';
+import {
+    ApplicationConfig,
+    inject,
+    isDevMode,
+    provideAppInitializer,
+} from '@angular/core';
 import { LuxonDateAdapter } from '@angular/material-luxon-adapter';
 import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
 import { provideAnimations } from '@angular/platform-browser/animations';
@@ -9,7 +14,7 @@ import { TranslocoService, provideTransloco } from '@ngneat/transloco';
 import { appRoutes } from 'app/app.routes';
 import { provideAuth } from 'app/core/auth/auth.provider';
 import { provideIcons } from 'app/core/icons/icons.provider';
-import { mockApiServices } from 'app/mock-api';
+import { MockApiService } from 'app/mock-api';
 import { firstValueFrom } from 'rxjs';
 import { TranslocoHttpLoader } from './core/transloco/transloco.http-loader';
 
@@ -58,22 +63,17 @@ export const appConfig: ApplicationConfig = {
                 defaultLang: 'en',
                 fallbackLang: 'en',
                 reRenderOnLangChange: true,
-                prodMode: true,
+                prodMode: !isDevMode(),
             },
             loader: TranslocoHttpLoader,
         }),
-        {
+        provideAppInitializer(() => {
-            // Preload the default language before the app starts to prevent empty/jumping content
+            const translocoService = inject(TranslocoService);
-            provide: APP_INITIALIZER,
+            const defaultLang = translocoService.getDefaultLang();
-            useFactory: () => {
+            translocoService.setActiveLang(defaultLang);
-                const translocoService = inject(TranslocoService);
-                const defaultLang = translocoService.getDefaultLang();
-                translocoService.setActiveLang(defaultLang);
 
-                return () => firstValueFrom(translocoService.load(defaultLang));
+            return firstValueFrom(translocoService.load(defaultLang));
-            },
+        }),
-            multi: true,
-        },
 
         // Fuse
         provideAuth(),
@@ -81,7 +81,7 @@ export const appConfig: ApplicationConfig = {
         provideFuse({
             mockApi: {
                 delay: 0,
-                services: mockApiServices,
+                service: MockApiService,
             },
             fuse: {
                 layout: 'classy',

src/app/core/auth/auth.provider.ts

@@ -1,9 +1,9 @@
 import { provideHttpClient, withInterceptors } from '@angular/common/http';
 import {
-    ENVIRONMENT_INITIALIZER,
     EnvironmentProviders,
     Provider,
     inject,
+    provideEnvironmentInitializer,
 } from '@angular/core';
 import { authInterceptor } from 'app/core/auth/auth.interceptor';
 import { AuthService } from 'app/core/auth/auth.service';
@@ -11,10 +11,6 @@ import { AuthService } from 'app/core/auth/auth.service';
 export const provideAuth = (): Array<Provider | EnvironmentProviders> => {
     return [
         provideHttpClient(withInterceptors([authInterceptor])),
-        {
+        provideEnvironmentInitializer(() => inject(AuthService)),
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(AuthService),
-            multi: true,
-        },
     ];
 };

src/app/core/icons/icons.provider.ts

@@ -1,17 +1,11 @@
 import {
-    ENVIRONMENT_INITIALIZER,
     EnvironmentProviders,
     inject,
+    provideEnvironmentInitializer,
     Provider,
 } from '@angular/core';
 import { IconsService } from 'app/core/icons/icons.service';
 
 export const provideIcons = (): Array<Provider | EnvironmentProviders> => {
-    return [
+    return [provideEnvironmentInitializer(() => inject(IconsService))];
-        {
-            provide: ENVIRONMENT_INITIALIZER,
-            useValue: () => inject(IconsService),
-            multi: true,
-        },
-    ];
 };

src/app/layout/common/languages/languages.component.ts

@@ -22,7 +22,6 @@ import { take } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'languages',
-    standalone: true,
     imports: [MatButtonModule, MatMenuModule, NgTemplateOutlet],
 })
 export class LanguagesComponent implements OnInit, OnDestroy {

src/app/layout/common/messages/messages.component.ts

@@ -26,7 +26,6 @@ import { Subject, takeUntil } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'messages',
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/layout/common/notifications/notifications.component.ts

@@ -26,7 +26,6 @@ import { Subject, takeUntil } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'notifications',
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/layout/common/quick-chat/quick-chat.component.ts

@@ -30,7 +30,6 @@ import { Subject, takeUntil } from 'rxjs';
     styleUrls: ['./quick-chat.component.scss'],
     encapsulation: ViewEncapsulation.None,
     exportAs: 'quickChat',
-    standalone: true,
     imports: [
         NgClass,
         MatIconModule,

src/app/layout/common/search/search.component.ts

@@ -42,7 +42,6 @@ import { Subject, debounceTime, filter, map, takeUntil } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     exportAs: 'fuseSearch',
     animations: fuseAnimations,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/layout/common/settings/settings.component.ts

@@ -35,7 +35,6 @@ import { Subject, takeUntil } from 'rxjs';
         `,
     ],
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         MatIconModule,
         FuseDrawerComponent,

src/app/layout/common/shortcuts/shortcuts.component.ts

@@ -36,7 +36,6 @@ import { Subject, takeUntil } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'shortcuts',
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/layout/common/user/user.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     exportAs: 'user',
-    standalone: true,
     imports: [
         MatButtonModule,
         MatMenuModule,

src/app/layout/layout.component.ts

@@ -31,7 +31,6 @@ import { ThinLayoutComponent } from './layouts/vertical/thin/thin.component';
     templateUrl: './layout.component.html',
     styleUrls: ['./layout.component.scss'],
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         EmptyLayoutComponent,
         CenteredLayoutComponent,

src/app/layout/layouts/empty/empty.component.ts

@@ -7,7 +7,6 @@ import { Subject } from 'rxjs';
     selector: 'empty-layout',
     templateUrl: './empty.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [FuseLoadingBarComponent, RouterOutlet],
 })
 export class EmptyLayoutComponent implements OnDestroy {

src/app/layout/layouts/horizontal/centered/centered.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'centered-layout',
     templateUrl: './centered.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/horizontal/enterprise/enterprise.component.ts

@@ -25,7 +25,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'enterprise-layout',
     templateUrl: './enterprise.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/horizontal/material/material.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'material-layout',
     templateUrl: './material.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/horizontal/modern/modern.component.ts

@@ -25,7 +25,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'modern-layout',
     templateUrl: './modern.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/vertical/classic/classic.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'classic-layout',
     templateUrl: './classic.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/vertical/classy/classy.component.ts

@@ -26,7 +26,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'classy-layout',
     templateUrl: './classy.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/vertical/compact/compact.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'compact-layout',
     templateUrl: './compact.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         MatButtonModule,

src/app/layout/layouts/vertical/dense/dense.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'dense-layout',
     templateUrl: './dense.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/vertical/futuristic/futuristic.component.ts

@@ -26,7 +26,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'futuristic-layout',
     templateUrl: './futuristic.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/layout/layouts/vertical/thin/thin.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'thin-layout',
     templateUrl: './thin.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         FuseLoadingBarComponent,
         FuseVerticalNavigationComponent,

src/app/mock-api/index.ts

@@ -1,3 +1,4 @@
+import { inject, Injectable } from '@angular/core';
 import { AcademyMockApi } from 'app/mock-api/apps/academy/api';
 import { ChatMockApi } from 'app/mock-api/apps/chat/api';
 import { ContactsMockApi } from 'app/mock-api/apps/contacts/api';
@@ -22,28 +23,29 @@ import { ProjectMockApi } from 'app/mock-api/dashboards/project/api';
 import { ActivitiesMockApi } from 'app/mock-api/pages/activities/api';
 import { IconsMockApi } from 'app/mock-api/ui/icons/api';
 
-export const mockApiServices = [
+@Injectable({ providedIn: 'root' })
-    AcademyMockApi,
+export class MockApiService {
-    ActivitiesMockApi,
+    academyMockApi = inject(AcademyMockApi);
-    AnalyticsMockApi,
+    activitiesMockApi = inject(ActivitiesMockApi);
-    AuthMockApi,
+    analyticsMockApi = inject(AnalyticsMockApi);
-    ChatMockApi,
+    authMockApi = inject(AuthMockApi);
-    ContactsMockApi,
+    chatMockApi = inject(ChatMockApi);
-    CryptoMockApi,
+    contactsMockApi = inject(ContactsMockApi);
-    ECommerceInventoryMockApi,
+    cryptoMockApi = inject(CryptoMockApi);
-    FileManagerMockApi,
+    eCommerceInventoryMockApi = inject(ECommerceInventoryMockApi);
-    FinanceMockApi,
+    fileManagerMockApi = inject(FileManagerMockApi);
-    HelpCenterMockApi,
+    financeMockApi = inject(FinanceMockApi);
-    IconsMockApi,
+    helpCenterMockApi = inject(HelpCenterMockApi);
-    MailboxMockApi,
+    iconsMockApi = inject(IconsMockApi);
-    MessagesMockApi,
+    mailboxMockApi = inject(MailboxMockApi);
-    NavigationMockApi,
+    messagesMockApi = inject(MessagesMockApi);
-    NotesMockApi,
+    navigationMockApi = inject(NavigationMockApi);
-    NotificationsMockApi,
+    notesMockApi = inject(NotesMockApi);
-    ProjectMockApi,
+    notificationsMockApi = inject(NotificationsMockApi);
-    SearchMockApi,
+    projectMockApi = inject(ProjectMockApi);
-    ScrumboardMockApi,
+    searchMockApi = inject(SearchMockApi);
-    ShortcutsMockApi,
+    scrumboardMockApi = inject(ScrumboardMockApi);
-    TasksMockApi,
+    shortcutsMockApi = inject(ShortcutsMockApi);
-    UserMockApi,
+    tasksMockApi = inject(TasksMockApi);
-];
+    userMockApi = inject(UserMockApi);
+}

src/app/modules/admin/apps/academy/academy.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './academy.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class AcademyComponent {

src/app/modules/admin/apps/academy/details/details.component.ts

@@ -28,7 +28,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         RouterLink,

src/app/modules/admin/apps/academy/list/list.component.ts

@@ -31,7 +31,6 @@ import { BehaviorSubject, Subject, combineLatest, takeUntil } from 'rxjs';
     templateUrl: './list.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         CdkScrollable,
         MatFormFieldModule,

src/app/modules/admin/apps/chat/chat.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './chat.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class ChatComponent {

src/app/modules/admin/apps/chat/chats/chats.component.ts

@@ -25,7 +25,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './chats.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         NewChatComponent,

src/app/modules/admin/apps/chat/contact-info/contact-info.component.ts

@@ -14,7 +14,6 @@ import { Chat } from 'app/modules/admin/apps/chat/chat.types';
     templateUrl: './contact-info.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [MatButtonModule, MatIconModule],
 })
 export class ContactInfoComponent {

src/app/modules/admin/apps/chat/conversation/conversation.component.ts

@@ -30,7 +30,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './conversation.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         ContactInfoComponent,

src/app/modules/admin/apps/chat/empty-conversation/empty-conversation.component.ts

@@ -10,7 +10,6 @@ import { MatIconModule } from '@angular/material/icon';
     templateUrl: './empty-conversation.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [MatIconModule],
 })
 export class EmptyConversationComponent {

src/app/modules/admin/apps/chat/new-chat/new-chat.component.ts

@@ -18,7 +18,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './new-chat.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [MatButtonModule, MatIconModule],
 })
 export class NewChatComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/chat/profile/profile.component.ts

@@ -21,7 +21,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './profile.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/apps/contacts/contacts.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './contacts.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class ContactsComponent {

src/app/modules/admin/apps/contacts/details/details.component.ts

@@ -50,7 +50,6 @@ import { Subject, debounceTime, takeUntil } from 'rxjs';
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatTooltipModule,

src/app/modules/admin/apps/contacts/list/list.component.ts

@@ -45,7 +45,6 @@ import {
     templateUrl: './list.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         RouterOutlet,

src/app/modules/admin/apps/ecommerce/inventory/inventory.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './inventory.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class InventoryComponent {

src/app/modules/admin/apps/ecommerce/inventory/list/inventory.component.ts

@@ -83,7 +83,6 @@ import {
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
     animations: fuseAnimations,
-    standalone: true,
     imports: [
         MatProgressBarModule,
         MatFormFieldModule,

src/app/modules/admin/apps/file-manager/details/details.component.ts

@@ -20,7 +20,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [MatButtonModule, RouterLink, MatIconModule],
 })
 export class FileManagerDetailsComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/file-manager/file-manager.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './file-manager.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class FileManagerComponent {

src/app/modules/admin/apps/file-manager/list/list.component.ts

@@ -30,7 +30,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './list.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         RouterOutlet,

src/app/modules/admin/apps/help-center/faqs/faqs.component.ts

@@ -11,7 +11,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'help-center-faqs',
     templateUrl: './faqs.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatButtonModule, RouterLink, MatIconModule, MatExpansionModule],
 })
 export class HelpCenterFaqsComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/help-center/guides/category/category.component.ts

@@ -10,7 +10,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'help-center-guides-category',
     templateUrl: './category.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatButtonModule, RouterLink, MatIconModule],
 })
 export class HelpCenterGuidesCategoryComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/help-center/guides/guide/guide.component.ts

@@ -10,7 +10,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'help-center-guides-guide',
     templateUrl: './guide.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatButtonModule, RouterLink, MatIconModule],
 })
 export class HelpCenterGuidesGuideComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/help-center/guides/guides.component.ts

@@ -10,7 +10,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'help-center-guides',
     templateUrl: './guides.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatButtonModule, RouterLink, MatIconModule],
 })
 export class HelpCenterGuidesComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/help-center/help-center.component.ts

@@ -12,7 +12,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'help-center',
     templateUrl: './help-center.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         MatFormFieldModule,
         MatInputModule,

src/app/modules/admin/apps/help-center/support/support.component.ts

@@ -23,7 +23,6 @@ import { HelpCenterService } from 'app/modules/admin/apps/help-center/help-cente
     templateUrl: './support.component.html',
     encapsulation: ViewEncapsulation.None,
     animations: fuseAnimations,
-    standalone: true,
     imports: [
         MatButtonModule,
         RouterLink,

src/app/modules/admin/apps/mailbox/compose/compose.component.ts

@@ -17,7 +17,6 @@ import { QuillEditorComponent } from 'ngx-quill';
     selector: 'mailbox-compose',
     templateUrl: './compose.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/apps/mailbox/details/details.component.ts

@@ -40,7 +40,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'mailbox-details',
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         MatButtonModule,
         RouterLink,

src/app/modules/admin/apps/mailbox/empty-details/empty-details.component.ts

@@ -5,7 +5,6 @@ import { MatIconModule } from '@angular/material/icon';
     selector: 'mailbox-empty-details',
     templateUrl: './empty-details.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatIconModule],
 })
 export class MailboxEmptyDetailsComponent {

src/app/modules/admin/apps/mailbox/list/list.component.ts

@@ -23,7 +23,6 @@ import { Subject, takeUntil } from 'rxjs';
     selector: 'mailbox-list',
     templateUrl: './list.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/apps/mailbox/mailbox.component.ts

@@ -15,7 +15,6 @@ import { MailboxSidebarComponent } from './sidebar/sidebar.component';
     selector: 'mailbox',
     templateUrl: './mailbox.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatSidenavModule, MailboxSidebarComponent, RouterOutlet],
 })
 export class MailboxComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/mailbox/settings/settings.component.ts

@@ -27,7 +27,6 @@ import { debounceTime, take } from 'rxjs';
     selector: 'mailbox-settings',
     templateUrl: './settings.component.html',
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/apps/mailbox/sidebar/sidebar.component.ts

@@ -22,7 +22,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './sidebar.component.html',
     styleUrls: ['./sidebar.component.scss'],
     encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [MatButtonModule, MatIconModule, FuseVerticalNavigationComponent],
 })
 export class MailboxSidebarComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/notes/details/details.component.ts

@@ -37,7 +37,6 @@ import {
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/apps/notes/labels/labels.component.ts

@@ -29,7 +29,6 @@ import {
     templateUrl: './labels.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatDialogModule,

src/app/modules/admin/apps/notes/list/list.component.ts

@@ -36,7 +36,6 @@ import {
     templateUrl: './list.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         MatRippleModule,

src/app/modules/admin/apps/notes/notes.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './notes.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class NotesComponent {

src/app/modules/admin/apps/scrumboard/board/add-card/add-card.component.ts

@@ -26,7 +26,6 @@ import { MatIconModule } from '@angular/material/icon';
     templateUrl: './add-card.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         NgClass,

src/app/modules/admin/apps/scrumboard/board/add-list/add-list.component.ts

@@ -25,7 +25,6 @@ import { MatIconModule } from '@angular/material/icon';
     templateUrl: './add-list.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         NgClass,

src/app/modules/admin/apps/scrumboard/board/board.component.ts

@@ -40,7 +40,6 @@ import { ScrumboardBoardAddListComponent } from './add-list/add-list.component';
     styleUrls: ['./board.component.scss'],
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         RouterLink,

src/app/modules/admin/apps/scrumboard/boards/boards.component.ts

@@ -20,7 +20,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './boards.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [CdkScrollable, RouterLink, MatIconModule],
 })
 export class ScrumboardBoardsComponent implements OnInit, OnDestroy {

src/app/modules/admin/apps/scrumboard/card/details/details.component.ts

@@ -42,7 +42,6 @@ import { Subject, debounceTime, takeUntil, tap } from 'rxjs';
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/apps/tasks/details/details.component.ts

@@ -52,7 +52,6 @@ import { Subject, debounceTime, filter, takeUntil, tap } from 'rxjs';
     templateUrl: './details.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         FormsModule,
         ReactiveFormsModule,

src/app/modules/admin/apps/tasks/list/list.component.ts

@@ -41,7 +41,6 @@ import { Subject, filter, fromEvent, takeUntil } from 'rxjs';
     templateUrl: './list.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         RouterOutlet,

src/app/modules/admin/apps/tasks/tasks.component.ts

@@ -10,7 +10,6 @@ import { RouterOutlet } from '@angular/router';
     templateUrl: './tasks.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [RouterOutlet],
 })
 export class TasksComponent {

src/app/modules/admin/dashboards/analytics/analytics.component.ts

@@ -21,7 +21,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './analytics.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/dashboards/crypto/crypto.component.ts

@@ -32,7 +32,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './crypto.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatSidenavModule,
         MatIconModule,

src/app/modules/admin/dashboards/finance/finance.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './finance.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         MatButtonModule,
         MatIconModule,

src/app/modules/admin/dashboards/project/project.component.ts

@@ -24,7 +24,6 @@ import { Subject, takeUntil } from 'rxjs';
     templateUrl: './project.component.html',
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [
         TranslocoModule,
         MatIconModule,

src/app/modules/admin/docs/changelog/changelog.ts

@@ -4,7 +4,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
     selector: 'changelog',
     templateUrl: './changelog.html',
     changeDetection: ChangeDetectionStrategy.OnPush,
-    standalone: true,
     imports: [],
 })
 export class ChangelogComponent {

src/app/modules/admin/docs/guides/authentication/jwt/jwt.ts

@@ -6,7 +6,6 @@ import { GuidesComponent } from 'app/modules/admin/docs/guides/guides.component'
 @Component({
     selector: 'jwt',
     templateUrl: './jwt.html',
-    standalone: true,
     imports: [MatIconModule, MatButtonModule],
 })
 export class JwtComponent {

src/app/modules/admin/docs/guides/customization/component-theming/component-theming.ts

@@ -7,7 +7,6 @@ import { GuidesComponent } from 'app/modules/admin/docs/guides/guides.component'
 @Component({
     selector: 'component-theming',
     templateUrl: './component-theming.html',
-    standalone: true,
     imports: [MatIconModule, MatButtonModule, FuseHighlightComponent],
 })
 export class ComponentThemingComponent {

src/app/modules/admin/docs/guides/customization/multi-language/multi-language.ts

@@ -6,7 +6,6 @@ import { GuidesComponent } from 'app/modules/admin/docs/guides/guides.component'
 @Component({
     selector: 'multi-language',
     templateUrl: './multi-language.html',
-    standalone: true,
     imports: [MatIconModule, MatButtonModule],
 })
 export class MultiLanguageCustomizationComponent {

src/app/modules/admin/docs/guides/customization/page-layouts/page-layouts.ts

@@ -6,7 +6,6 @@ import { GuidesComponent } from 'app/modules/admin/docs/guides/guides.component'
 @Component({
     selector: 'page-layouts',
     templateUrl: './page-layouts.html',
-    standalone: true,
     imports: [MatIconModule, MatButtonModule],
 })
 export class PageLayoutsComponent {

src/app/modules/admin/docs/guides/customization/splash-screen/splash-screen.ts

@@ -8,7 +8,6 @@ import { GuidesComponent } from 'app/modules/admin/docs/guides/guides.component'
 @Component({
     selector: 'splash-screen',
     templateUrl: './splash-screen.html',
-    standalone: true,
     imports: [
         MatIconModule,
         MatButtonModule,