feat/ migrate to standalone components

Author: belnadris

package.json

@@ -65,5 +65,8 @@
     "typescript": "5.9.3",
     "wait-on": "9.0.3",
     "webdriver-manager": "13.0.2"
+  },
+  "engines": {
+    "node": ">= 22.12.0 || >= 24.0.0"
   }
 }

src/app/app-routing.module.ts

@@ -1,15 +1,15 @@
-import { TestBed, waitForAsync } from '@angular/core/testing';
-import { RouterTestingModule } from '@angular/router/testing';
-import { AppComponent } from './app.component';
-import { TranslateModule, TranslateService } from '@ngx-translate/core';
-import { TauriService } from './core/services';
+import {TestBed, waitForAsync} from '@angular/core/testing';
+import {AppComponent} from './app.component';
+import {TranslateModule} from '@ngx-translate/core';
+import {TauriService} from './core/services';
+import {provideRouter} from '@angular/router';
 
 describe('AppComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [AppComponent],
-      providers: [TauriService],
-      imports: [RouterTestingModule, TranslateModule.forRoot()],
+      declarations: [],
+      imports: [AppComponent, TranslateModule.forRoot()],
+      providers: [provideRouter([]), TauriService]
     }).compileComponents();
   }));
 

src/app/app.component.spec.ts

@@ -1,20 +1,22 @@
-import { Component } from '@angular/core';
+import {Component, inject} from '@angular/core';
 import { TranslateService } from '@ngx-translate/core';
 import { APP_CONFIG } from '../environments/environment';
 import { TauriService } from './core/services';
+import {RouterOutlet} from '@angular/router';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss'],
-  standalone: false,
+  standalone: true,
+  imports: [RouterOutlet]
 })
 export class AppComponent {
-  constructor(
-    private tauriService: TauriService,
-    private translate: TranslateService
-  ) {
-    translate.setFallbackLang('en');
+  private readonly tauriService = inject(TauriService);
+  private readonly translate = inject(TranslateService);
+
+  constructor() {
+    this.translate.setFallbackLang('en');
     console.log('APP_CONFIG', APP_CONFIG);
 
     if (this.tauriService.isTauri) {

src/app/app.component.ts

@@ -1,18 +1,18 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
 
-import { DetailComponent } from './detail.component';
-import { TranslateModule, TranslateService } from '@ngx-translate/core';
-
-import { RouterTestingModule } from '@angular/router/testing';
+import {DetailComponent} from './detail.component';
+import {TranslateModule} from '@ngx-translate/core';
+import {provideRouter} from '@angular/router';
 
 describe('DetailComponent', () => {
   let component: DetailComponent;
   let fixture: ComponentFixture<DetailComponent>;
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [DetailComponent],
-      imports: [TranslateModule.forRoot(), RouterTestingModule],
+      declarations: [],
+      imports: [DetailComponent, TranslateModule.forRoot()],
+      providers: [provideRouter([])]
     }).compileComponents();
   }));
 

src/app/app.module.ts

@@ -1,10 +1,13 @@
 import { Component, OnInit } from '@angular/core';
+import { RouterLink } from '@angular/router';
+import { TranslateModule } from '@ngx-translate/core';
 
 @Component({
     selector: 'app-detail',
     templateUrl: './detail.component.html',
     styleUrls: ['./detail.component.scss'],
-    standalone: false
+    standalone: true,
+  imports: [RouterLink, TranslateModule]
 })
 export class DetailComponent implements OnInit {