fix: Remove constructor injection

frontend/e2e/homepage.spec.ts

@@ -10,7 +10,7 @@ test('home page loads correctly', async ({ page }) => {
 
 test('registration popup should open and close', async ({ page }) => {
   await page.goto('/');
-  await page.getByRole('button', { name: 'Registrieren' }).click();
+  await page.getByRole('navigation').getByRole('button', { name: 'Jetzt registrieren' }).click();
 
   await expect(page.getByText('Konto erstellenE-')).toBeVisible();
 
@@ -21,7 +21,7 @@ test('registration popup should open and close', async ({ page }) => {
 
 test('registration should work', async ({ page }) => {
   await page.goto('/');
-  await page.getByRole('button', { name: 'Registrieren' }).click();
+  await page.getByRole('navigation').getByRole('button', { name: 'Jetzt registrieren' }).click();
 
   await page.getByRole('textbox', { name: 'E-Mail' }).fill('test@kjan.email');
   await page.getByRole('textbox', { name: 'Benutzername' }).fill('test-playwright');

frontend/src/app/feature/auth/login/login.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Output, signal } from '@angular/core';
+import { Component, EventEmitter, Output, signal, inject } from '@angular/core';
 import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { LoginRequest } from '../../../model/auth/LoginRequest';
@@ -20,11 +20,11 @@ export class LoginComponent {
   @Output() closeDialog = new EventEmitter<void>();
   @Output() forgotPassword = new EventEmitter<void>();
 
-  constructor(
-    private fb: FormBuilder,
-    private authService: AuthService,
-    private router: Router
-  ) {
+  private fb = inject(FormBuilder);
+  private authService = inject(AuthService);
+  private router = inject(Router);
+
+  constructor() {
     this.loginForm = this.fb.group({
       usernameOrEmail: ['', [Validators.required]],
       password: ['', [Validators.required]],

frontend/src/app/feature/auth/recover-password/recover-password.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Output, signal, OnInit } from '@angular/core';
+import { Component, EventEmitter, Output, signal, OnInit, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
@@ -22,12 +22,12 @@ export default class RecoverPasswordComponent implements OnInit {
   @Output() closeDialog = new EventEmitter<void>();
   @Output() switchToLogin = new EventEmitter<void>();
 
-  constructor(
-    private fb: FormBuilder,
-    private authService: AuthService,
-    private router: Router,
-    private route: ActivatedRoute
-  ) {
+  private fb = inject(FormBuilder);
+  private authService = inject(AuthService);
+  private router = inject(Router);
+  private route = inject(ActivatedRoute);
+
+  constructor() {
     this.emailForm = this.fb.group({
       email: ['', [Validators.required, Validators.email]],
     });

frontend/src/app/feature/auth/register/register.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Output, signal } from '@angular/core';
+import { Component, EventEmitter, Output, signal, inject } from '@angular/core';
 import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { RegisterRequest } from '../../../model/auth/RegisterRequest';
 import { AuthService } from '@service/auth.service';
@@ -19,10 +19,10 @@ export class RegisterComponent {
   @Output() switchForm = new EventEmitter<void>();
   @Output() closeDialog = new EventEmitter<void>();
 
-  constructor(
-    private fb: FormBuilder,
-    private authService: AuthService
-  ) {
+  private fb = inject(FormBuilder);
+  private authService = inject(AuthService);
+
+  constructor() {
     this.registerForm = this.fb.group({
       email: ['', [Validators.required, Validators.email]],
       username: ['', [Validators.required, Validators.minLength(3)]],

frontend/src/app/feature/game/blackjack/components/dealer-hand/dealer-hand.component.ts

@@ -1,4 +1,11 @@
-import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  Input,
+  OnChanges,
+  SimpleChanges,
+  inject,
+} from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { Card } from '@blackjack/models/blackjack.model';
 import { PlayingCardComponent } from '../playing-card/playing-card.component';
@@ -47,7 +54,7 @@ export class DealerHandComponent implements OnChanges {
 
   private lastCardCount = 0;
 
-  constructor(protected gameControlsService: GameControlsService) {}
+  protected gameControlsService = inject(GameControlsService);
 
   ngOnChanges(changes: SimpleChanges): void {
     if (changes['cards']) {

frontend/src/app/feature/game/blackjack/components/game-controls/game-controls.component.ts

@@ -1,4 +1,11 @@
-import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+  inject,
+} from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { GameState } from '@blackjack/enum/gameState';
 import { Card } from '@blackjack/models/blackjack.model';
@@ -69,7 +76,7 @@ export class GameControlsComponent {
 
   protected readonly GameState = GameState;
 
-  constructor(protected gameControlsService: GameControlsService) {}
+  protected gameControlsService = inject(GameControlsService);
 
   get canDoubleDown(): boolean {
     return (

frontend/src/app/feature/game/blackjack/components/game-info/game-info.component.ts

@@ -7,6 +7,7 @@ import {
   Output,
   signal,
   SimpleChanges,
+  inject,
 } from '@angular/core';
 import { CommonModule, CurrencyPipe } from '@angular/common';
 import { FormGroup, ReactiveFormsModule } from '@angular/forms';
@@ -121,7 +122,9 @@ export class GameInfoComponent implements OnChanges {
 
   betForm: FormGroup;
 
-  constructor(private bettingService: BettingService) {
+  private bettingService = inject(BettingService);
+
+  constructor() {
     this.betForm = this.bettingService.createBetForm();
   }
 

frontend/src/app/feature/game/blackjack/components/player-hand/player-hand.component.ts

@@ -1,4 +1,11 @@
-import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  Input,
+  OnChanges,
+  SimpleChanges,
+  inject,
+} from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { PlayingCardComponent } from '../playing-card/playing-card.component';
 import { Card } from '@blackjack/models/blackjack.model';
@@ -49,7 +56,7 @@ export class PlayerHandComponent implements OnChanges {
 
   private lastCardCount = 0;
 
-  constructor(protected gameControlsService: GameControlsService) {}
+  protected gameControlsService = inject(GameControlsService);
 
   ngOnChanges(changes: SimpleChanges): void {
     if (changes['cards']) {

frontend/src/app/feature/game/blackjack/components/playing-card/playing-card.component.ts

@@ -6,6 +6,7 @@ import {
   Input,
   OnChanges,
   SimpleChanges,
+  inject,
 } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { gsap } from 'gsap';
@@ -58,7 +59,7 @@ export class PlayingCardComponent implements AfterViewInit, OnChanges {
   @Input({ required: true }) hidden!: boolean;
   @Input() isNew = false;
 
-  constructor(private elementRef: ElementRef) {}
+  private elementRef = inject(ElementRef);
 
   get isRedSuit(): boolean {
     return this.suit === 'HEARTS' || this.suit === 'DIAMONDS';

frontend/src/app/feature/game/blackjack/services/betting.service.ts

@@ -1,11 +1,11 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 
 @Injectable({
   providedIn: 'root',
 })
 export class BettingService {
-  constructor(private fb: FormBuilder) {}
+  private fb = inject(FormBuilder);
 
   createBetForm(): FormGroup {
     return this.fb.group({

frontend/src/app/feature/game/dice/dice.service.ts

@@ -1,4 +1,4 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { DiceDto, DiceResult } from './dice.model';
@@ -10,7 +10,7 @@ import { environment } from '@environments/environment';
 export class DiceService {
   private apiUrl = `${environment.apiUrl}/dice`;
 
-  constructor(private http: HttpClient) {}
+  private http = inject(HttpClient);
 
   rollDice(diceDto: DiceDto): Observable<DiceResult> {
     return this.http.post<DiceResult>(this.apiUrl, diceDto);

frontend/src/app/feature/home/home.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, OnInit, inject } from '@angular/core';
 import { NgFor } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Game } from 'app/model/Game';
@@ -14,10 +14,8 @@ import format from 'ajv/dist/vocabularies/format';
 export default class HomeComponent implements OnInit {
   isDepositSuccessful = false;
 
-  constructor(
-    public route: ActivatedRoute,
-    public router: Router
-  ) {}
+  public route = inject(ActivatedRoute);
+  public router = inject(Router);
 
   ngOnInit() {
     this.isDepositSuccessful = this.route.snapshot.queryParams['success'] == 'true';

frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, Component } from '@angular/core';
+import { ChangeDetectorRef, Component, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 import { LootboxService } from '../services/lootbox.service';
@@ -26,14 +26,14 @@ export default class LootboxOpeningComponent {
   currentUser: User | null = null;
   private winSound: HTMLAudioElement;
 
-  constructor(
-    private route: ActivatedRoute,
-    private router: Router,
-    private lootboxService: LootboxService,
-    private userService: UserService,
-    private authService: AuthService,
-    private cdr: ChangeDetectorRef
-  ) {
+  private route = inject(ActivatedRoute);
+  private router = inject(Router);
+  private lootboxService = inject(LootboxService);
+  private userService = inject(UserService);
+  private authService = inject(AuthService);
+  private cdr = inject(ChangeDetectorRef);
+
+  constructor() {
     this.winSound = new Audio('/sounds/win.mp3');
     this.loadLootbox();
     this.authService.userSubject.subscribe((user) => {

frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { ChangeDetectorRef, Component, OnInit, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { LootboxService } from '../services/lootbox.service';
 import { LootBox } from 'app/model/LootBox';
@@ -86,13 +86,11 @@ export default class LootboxSelectionComponent implements OnInit {
     },
   ];
 
-  constructor(
-    private lootboxService: LootboxService,
-    private router: Router,
-    private cdr: ChangeDetectorRef,
-    private authService: AuthService,
-    private userService: UserService
-  ) {}
+  private lootboxService = inject(LootboxService);
+  private router = inject(Router);
+  private cdr = inject(ChangeDetectorRef);
+  private authService = inject(AuthService);
+  private userService = inject(UserService);
 
   ngOnInit(): void {
     this.loadLootboxes();

frontend/src/app/service/auth.service.ts

@@ -1,4 +1,4 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { BehaviorSubject, Observable, tap } from 'rxjs';
 import { Router, ActivatedRoute } from '@angular/router';
@@ -19,13 +19,13 @@ export class AuthService {
   private userUrl = `${environment.apiUrl}/users`;
   private oauthUrl = `${environment.apiUrl}/oauth2`;
 
+  private http = inject(HttpClient);
+  private router = inject(Router);
+  private route = inject(ActivatedRoute);
+
   userSubject: BehaviorSubject<User | null>;
 
-  constructor(
-    private http: HttpClient,
-    private router: Router,
-    private route: ActivatedRoute
-  ) {
+  constructor() {
     this.userSubject = new BehaviorSubject<User | null>(this.getUserFromStorage());
 
     // Check for token in URL (OAuth callback) on initialization

frontend/src/app/shared/components/confirmation/confirmation.component.ts

@@ -7,6 +7,7 @@ import {
   OnDestroy,
   Output,
   ViewChild,
+  inject,
 } from '@angular/core';
 import { ModalAnimationService } from '@shared/services/modal-animation.service';
 import gsap from 'gsap';
@@ -23,7 +24,7 @@ export class ConfirmationComponent implements AfterViewInit, OnDestroy {
   @ViewChild('modalBg') modalBg!: ElementRef;
   @ViewChild('modalCard') modalCard!: ElementRef;
 
-  constructor(private modalAnimationService: ModalAnimationService) {}
+  private modalAnimationService = inject(ModalAnimationService);
 
   ngAfterViewInit() {
     if (this.successful) {

frontend/src/app/shared/services/sound-initializer.service.ts

@@ -1,4 +1,4 @@
-import { Injectable, Renderer2, RendererFactory2 } from '@angular/core';
+import { Injectable, Renderer2, RendererFactory2, inject } from '@angular/core';
 
 @Injectable({
   providedIn: 'root',
@@ -7,8 +7,10 @@ export class SoundInitializerService {
   private renderer: Renderer2;
   private observer: MutationObserver;
 
-  constructor(rendererFactory: RendererFactory2) {
-    this.renderer = rendererFactory.createRenderer(null, null);
+  private rendererFactory = inject(RendererFactory2);
+
+  constructor() {
+    this.renderer = this.rendererFactory.createRenderer(null, null);
 
     this.observer = new MutationObserver((mutations) => {
       mutations.forEach((mutation) => {