refactor: remove docker folder, refactor frontend files

docker/docker-compose.yml

@@ -1,18 +0,0 @@
-volumes:
-  casino-db-data:
-
-services:
-  db:
-    image: postgres:17.5
-    container_name: casino-db
-    restart: unless-stopped
-    volumes:
-      - casino-db-data:/var/lib/postgresql/data
-    environment:
-      POSTGRES_DB: postgresdb
-      POSTGRES_USER: postgres_user
-      POSTGRES_PASSWORD: postgres_pass
-    healthcheck:
-      test: "exit 0"
-    ports:
-      - "5432:5432"

frontend/src/app/app.component.html

@@ -1,5 +1,6 @@
 <div class="min-h-screen flex flex-col">
   <main class="flex-grow">
+    <app-navbar></app-navbar>
     <router-outlet></router-outlet>
   </main>
   <app-footer></app-footer>

frontend/src/app/app.component.ts

@@ -2,11 +2,12 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { RouterOutlet } from '@angular/router';
 import { FooterComponent } from '@shared/components/footer/footer.component';
+import {NavbarComponent} from "@shared/components/navbar/navbar.component";
 
 @Component({
   selector: 'app-root',
   standalone: true,
-  imports: [CommonModule, RouterOutlet, FooterComponent],
+  imports: [CommonModule, RouterOutlet, FooterComponent, NavbarComponent],
   providers: [],
   templateUrl: './app.component.html',
   styleUrl: './app.component.css',

frontend/src/app/auth.guard.ts

@@ -1,6 +1,6 @@
 import { CanActivateFn, Router } from '@angular/router';
 import { inject } from '@angular/core';
-import { AuthService } from './service/auth.service';
+import { AuthService } from '@service/auth.service';
 
 export const authGuard: CanActivateFn = async () => {
   const authService = inject(AuthService);

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

@@ -1,5 +1,3 @@
-<app-navbar />
-
 <div class="min-h-screen bg-deep-blue flex items-center justify-center">
   <div class="modal-card max-w-md w-full">
     <h2 class="modal-heading text-center">Anmelden</h2>

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

@@ -1,15 +1,14 @@
-import { Component } from '@angular/core';
+import {Component} from '@angular/core';
-import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
-import { Router, RouterLink } from '@angular/router';
+import {Router, RouterLink} from '@angular/router';
-import { LoginRequest } from '../../../model/auth/LoginRequest';
+import {LoginRequest} from '../../../model/auth/LoginRequest';
-import { AuthService } from '../../../service/auth.service';
+import {AuthService} from '../../../service/auth.service';
-import { CommonModule } from '@angular/common';
+import {CommonModule} from '@angular/common';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
 
 @Component({
   selector: 'app-login',
   standalone: true,
-  imports: [CommonModule, ReactiveFormsModule, RouterLink, NavbarComponent],
+  imports: [CommonModule, ReactiveFormsModule, RouterLink],
   templateUrl: './login.component.html',
 })
 export class LoginComponent {

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

@@ -1,5 +1,3 @@
-<app-navbar />
-
 <div class="min-h-screen bg-deep-blue flex items-center justify-center">
   <div class="modal-card max-w-md w-full">
     <h2 class="modal-heading text-center">Konto erstellen</h2>

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

@@ -1,15 +1,14 @@
-import { Component } from '@angular/core';
+import {Component} from '@angular/core';
-import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
-import { Router, RouterLink } from '@angular/router';
+import {Router, RouterLink} from '@angular/router';
-import { RegisterRequest } from '../../../model/auth/RegisterRequest';
+import {RegisterRequest} from '../../../model/auth/RegisterRequest';
-import { AuthService } from '@service/auth.service';
+import {AuthService} from '@service/auth.service';
-import { CommonModule } from '@angular/common';
+import {CommonModule} from '@angular/common';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
 
 @Component({
   selector: 'app-register',
   standalone: true,
-  imports: [CommonModule, ReactiveFormsModule, RouterLink, NavbarComponent],
+  imports: [CommonModule, ReactiveFormsModule, RouterLink],
   templateUrl: './register.component.html',
 })
 export class RegisterComponent {

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

@@ -14,14 +14,14 @@ import {
   SimpleChanges,
   ViewChild,
 } from '@angular/core';
-import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
-import { loadStripe, Stripe } from '@stripe/stripe-js';
+import {loadStripe, Stripe} from '@stripe/stripe-js';
-import { debounceTime } from 'rxjs';
+import {debounceTime} from 'rxjs';
-import { CommonModule } from '@angular/common';
+import {CommonModule} from '@angular/common';
 import gsap from 'gsap';
-import { DepositService } from '@service/deposit.service';
+import {DepositService} from '@service/deposit.service';
-import { environment } from '@environments/environment';
+import {environment} from '@environments/environment';
-import { ModalAnimationService } from '@shared/services/modal-animation.service';
+import {ModalAnimationService} from '@shared/services/modal-animation.service';
 
 @Component({
   selector: 'app-deposit',

frontend/src/app/feature/game/blackjack/blackjack.component.html

@@ -1,5 +1,3 @@
-<app-navbar></app-navbar>
-
 <div class="container mx-auto px-4 py-6 space-y-8">
   <div class="grid grid-cols-1 lg:grid-cols-4 gap-6">
     <div class="lg:col-span-3 space-y-6 flex flex-col gap-4">

frontend/src/app/feature/game/blackjack/blackjack.component.ts

@@ -1,27 +1,25 @@
-import { ChangeDetectionStrategy, Component, inject, OnInit, signal } from '@angular/core';
+import {ChangeDetectionStrategy, Component, inject, OnInit, signal} from '@angular/core';
-import { CommonModule } from '@angular/common';
+import {CommonModule} from '@angular/common';
-import { Router } from '@angular/router';
+import {Router} from '@angular/router';
-import { DealerHandComponent } from './components/dealer-hand/dealer-hand.component';
+import {DealerHandComponent} from './components/dealer-hand/dealer-hand.component';
-import { PlayerHandComponent } from './components/player-hand/player-hand.component';
+import {PlayerHandComponent} from './components/player-hand/player-hand.component';
-import { GameControlsComponent } from './components/game-controls/game-controls.component';
+import {GameControlsComponent} from './components/game-controls/game-controls.component';
-import { GameInfoComponent } from './components/game-info/game-info.component';
+import {GameInfoComponent} from './components/game-info/game-info.component';
-import { BlackjackGame, Card } from '@blackjack/models/blackjack.model';
+import {BlackjackGame, Card} from '@blackjack/models/blackjack.model';
-import { BlackjackService } from '@blackjack/services/blackjack.service';
+import {BlackjackService} from '@blackjack/services/blackjack.service';
-import { HttpErrorResponse } from '@angular/common/http';
+import {HttpErrorResponse} from '@angular/common/http';
-import { GameResultComponent } from '@blackjack/components/game-result/game-result.component';
+import {GameResultComponent} from '@blackjack/components/game-result/game-result.component';
-import { GameState } from '@blackjack/enum/gameState';
+import {GameState} from '@blackjack/enum/gameState';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
+import {UserService} from '@service/user.service';
-import { UserService } from '@service/user.service';
+import {timer} from 'rxjs';
-import { timer } from 'rxjs';
+import {DebtDialogComponent} from '@shared/components/debt-dialog/debt-dialog.component';
-import { DebtDialogComponent } from '@shared/components/debt-dialog/debt-dialog.component';
+import {AuthService} from '@service/auth.service';
-import { AuthService } from '@service/auth.service';
 
 @Component({
   selector: 'app-blackjack',
   standalone: true,
   imports: [
     CommonModule,
-    NavbarComponent,
     DealerHandComponent,
     PlayerHandComponent,
     GameControlsComponent,

frontend/src/app/feature/game/slots/slots.component.html

@@ -1,5 +1,3 @@
-<app-navbar></app-navbar>
-
 <div class="container mx-auto px-4 py-6 space-y-8">
   <h1 class="text-3xl font-bold text-white mb-6">Spielautomaten</h1>
 

frontend/src/app/feature/game/slots/slots.component.ts

@@ -1,19 +1,11 @@
-import {
+import {ChangeDetectionStrategy, Component, inject, OnDestroy, OnInit, signal,} from '@angular/core';
-  ChangeDetectionStrategy,
+import {HttpClient} from '@angular/common/http';
-  Component,
+import {CommonModule, CurrencyPipe, KeyValuePipe, NgClass} from '@angular/common';
-  inject,
+import {FormsModule} from '@angular/forms';
-  OnInit,
+import {UserService} from '@service/user.service';
-  OnDestroy,
+import {Subscription} from 'rxjs';
-  signal,
+import {AnimatedNumberComponent} from '@blackjack/components/animated-number/animated-number.component';
-} from '@angular/core';
+import {AuthService} from '@service/auth.service';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
-import { HttpClient } from '@angular/common/http';
-import { CommonModule, KeyValuePipe, NgClass, CurrencyPipe } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { UserService } from '@service/user.service';
-import { Subscription } from 'rxjs';
-import { AnimatedNumberComponent } from '@blackjack/components/animated-number/animated-number.component';
-import { AuthService } from '@service/auth.service';
 
 interface SlotResult {
   status: 'win' | 'lose' | 'blank' | 'start';
@@ -26,7 +18,6 @@ interface SlotResult {
   standalone: true,
   imports: [
     CommonModule,
-    NavbarComponent,
     KeyValuePipe,
     NgClass,
     FormsModule,

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

@@ -1,4 +1,3 @@
-<app-navbar></app-navbar>
 <div class="container mx-auto px-4 py-6 space-y-8">
   <div class="flex justify-between items-center">
     <div class="flex items-center space-x-4"></div>

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

@@ -1,21 +1,19 @@
-import { ChangeDetectionStrategy, Component, inject, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, inject, OnInit} from '@angular/core';
-import { AsyncPipe, CurrencyPipe, DatePipe, NgFor } from '@angular/common';
+import {AsyncPipe, CurrencyPipe, DatePipe, NgFor} from '@angular/common';
-import { DepositComponent } from '../deposit/deposit.component';
+import {DepositComponent} from '../deposit/deposit.component';
-import { ActivatedRoute, Router } from '@angular/router';
+import {ActivatedRoute, Router} from '@angular/router';
-import { ConfirmationComponent } from '@shared/components/confirmation/confirmation.component';
+import {ConfirmationComponent} from '@shared/components/confirmation/confirmation.component';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
+import {Game} from 'app/model/Game';
-import { Game } from 'app/model/Game';
+import {Observable} from 'rxjs';
-import { Observable } from 'rxjs';
+import {TransactionService} from '@service/transaction.service';
-import { TransactionService } from '@service/transaction.service';
 import format from 'ajv/dist/vocabularies/format';
-import { TransactionHistoryComponent } from '../transaction-history/transaction-history.component';
+import {TransactionHistoryComponent} from '../transaction-history/transaction-history.component';
-import { TransactionData } from '../../model/TransactionData';
+import {TransactionData} from '../../model/TransactionData';
 
 @Component({
   selector: 'app-homepage',
   standalone: true,
   imports: [
-    NavbarComponent,
     CurrencyPipe,
     NgFor,
     DepositComponent,

frontend/src/app/feature/landing/landing.component.html

@@ -1,5 +1,3 @@
-<app-navbar></app-navbar>
-
 <div class="min-h-screen bg-deep-blue text-text-primary">
   <div class="container mx-auto px-4 py-8 sm:py-12">
     <div class="max-w-5xl mx-auto">

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

@@ -1,13 +1,12 @@
-import { ChangeDetectionStrategy, Component, inject, OnDestroy, OnInit } from '@angular/core';
+import {ChangeDetectionStrategy, Component, inject, OnDestroy, OnInit} from '@angular/core';
-import { NgFor } from '@angular/common';
+import {NgFor} from '@angular/common';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
+import {RouterLink} from '@angular/router';
-import { RouterLink } from '@angular/router';
+import {AuthService} from '@service/auth.service';
-import { AuthService } from '@service/auth.service';
 
 @Component({
   selector: 'app-landing-page',
   standalone: true,
-  imports: [NavbarComponent, NgFor, RouterLink],
+  imports: [NgFor, RouterLink],
   templateUrl: './landing.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })

frontend/src/app/feature/login-success/login-success.component.html

@@ -1 +0,0 @@
-<p>Logging in...</p>

frontend/src/app/feature/login-success/login-success.component.ts

@@ -1,43 +0,0 @@
-import { ChangeDetectionStrategy, Component, inject, OnInit } from '@angular/core';
-import { Router } from '@angular/router';
-import { AuthService } from '../../service/auth.service';
-import { OAuthService } from 'angular-oauth2-oidc';
-
-@Component({
-  selector: 'app-login-success',
-  standalone: true,
-  imports: [],
-  templateUrl: './login-success.component.html',
-  styleUrl: './login-success.component.css',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export default class LoginSuccessComponent implements OnInit {
-  private authService: AuthService = inject(AuthService);
-  private oauthService: OAuthService = inject(OAuthService);
-  private router: Router = inject(Router);
-
-  async ngOnInit() {
-    try {
-      if (this.oauthService.hasValidAccessToken()) {
-        this.router.navigate(['/home']);
-      } else {
-        setTimeout(() => {
-          if (this.oauthService.hasValidAccessToken() || this.authService.getUser()) {
-            this.router.navigate(['/home']);
-          } else {
-            this.router.navigate(['/']);
-          }
-        }, 3000);
-      }
-    } catch (err) {
-      console.error('Error during login callback:', err);
-      setTimeout(() => {
-        if (this.authService.isLoggedIn()) {
-          this.router.navigate(['/home']);
-        } else {
-          this.router.navigate(['/']);
-        }
-      }, 3000);
-    }
-  }
-}

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

@@ -1,5 +1,3 @@
-<app-navbar></app-navbar>
-
 <div class="container mx-auto px-4 py-6 space-y-8">
   <h1 class="text-3xl font-bold text-white mb-6">Lootbox Öffnen</h1>
 

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

@@ -1,17 +1,16 @@
-import { ChangeDetectorRef, Component } from '@angular/core';
+import {ChangeDetectorRef, Component} from '@angular/core';
-import { CommonModule } from '@angular/common';
+import {CommonModule} from '@angular/common';
-import { ActivatedRoute, Router } from '@angular/router';
+import {ActivatedRoute, Router} from '@angular/router';
-import { LootboxService } from '../services/lootbox.service';
+import {LootboxService} from '../services/lootbox.service';
-import { LootBox, Reward } from 'app/model/LootBox';
+import {LootBox, Reward} from 'app/model/LootBox';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
+import {UserService} from '@service/user.service';
-import { UserService } from '@service/user.service';
+import {User} from 'app/model/User';
-import { User } from 'app/model/User';
+import {AuthService} from '@service/auth.service';
-import { AuthService } from '@service/auth.service';
 
 @Component({
   selector: 'app-lootbox-opening',
   standalone: true,
-  imports: [CommonModule, NavbarComponent],
+  imports: [CommonModule],
   templateUrl: './lootbox-opening.component.html',
   styleUrls: ['./lootbox-opening.component.css'],
 })

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

@@ -1,4 +1,3 @@
-<app-navbar></app-navbar>
 <div class="container mx-auto px-4 py-6">
   <h1 class="text-3xl font-bold text-white mb-6">Lootboxen</h1>
 

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

@@ -1,18 +1,17 @@
-import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
-import { CommonModule } from '@angular/common';
+import {CommonModule} from '@angular/common';
-import { NavbarComponent } from '@shared/components/navbar/navbar.component';
+import {LootboxService} from '../services/lootbox.service';
-import { LootboxService } from '../services/lootbox.service';
+import {LootBox} from 'app/model/LootBox';
-import { LootBox } from 'app/model/LootBox';
+import {Router} from '@angular/router';
-import { Router } from '@angular/router';
+import {timeout} from 'rxjs';
-import { timeout } from 'rxjs';
+import {User} from 'app/model/User';
-import { User } from 'app/model/User';
+import {AuthService} from '@service/auth.service';
-import { AuthService } from '@service/auth.service';
+import {UserService} from '@service/user.service';
-import { UserService } from '@service/user.service';
 
 @Component({
   selector: 'app-lootbox-selection',
   standalone: true,
-  imports: [CommonModule, NavbarComponent],
+  imports: [CommonModule],
   templateUrl: './lootbox-selection.component.html',
   styleUrls: ['./lootbox-selection.component.css'],
 })

frontend/src/app/feature/transaction-history/transaction-history.component.ts

@@ -1,15 +1,8 @@
-import {
+import {ChangeDetectionStrategy, Component, EventEmitter, inject, Input, Output,} from '@angular/core';
-  ChangeDetectionStrategy,
+import {TransactionService} from '@service/transaction.service';
-  Component,
+import {Observable} from 'rxjs';
-  EventEmitter,
+import {AsyncPipe, CurrencyPipe, DatePipe, NgIf} from '@angular/common';
-  inject,
+import {TransactionData} from '../../model/TransactionData';
-  Input,
-  Output,
-} from '@angular/core';
-import { TransactionService } from '@service/transaction.service';
-import { Observable } from 'rxjs';
-import { AsyncPipe, CurrencyPipe, DatePipe, NgIf } from '@angular/common';
-import { TransactionData } from '../../model/TransactionData';
 
 const PER_PAGE = 5;
 

frontend/src/app/shared/components/navbar/navbar.component.html

@@ -11,7 +11,7 @@
       </div>
 
       <div class="hidden md:flex items-center space-x-4">
-        @if (!isLoggedIn) {
+        @if (!isLoggedIn()) {
           <a routerLink="/login" class="button-primary px-4 py-1.5">Anmelden</a>
           <a
             routerLink="/register"
@@ -19,7 +19,7 @@
             >Registrieren</a
           >
         }
-        @if (isLoggedIn) {
+        @if (isLoggedIn()) {
           <div
             class="text-white font-bold bg-deep-blue-contrast rounded-full px-4 py-2 text-sm hover:bg-deep-blue-contrast/80 hover:cursor-pointer hover:scale-105 transition-all active:scale-95 select-none duration-300"
             routerLink="/home"
@@ -70,7 +70,7 @@
       <div class="nav-mobile-menu">
         <a routerLink="/games" class="nav-mobile-link">Spiele</a>
         <div class="pt-2 space-y-2">
-          @if (!isLoggedIn) {
+          @if (!isLoggedIn()) {
             <a routerLink="/login" class="button-primary w-full py-1.5 block text-center"
               >Anmelden</a
             >
@@ -80,7 +80,7 @@
               >Registrieren</a
             >
           }
-          @if (isLoggedIn) {
+          @if (isLoggedIn()) {
             <button (click)="logout()" class="button-primary w-full py-1.5">Abmelden</button>
           }
         </div>

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

@@ -21,7 +21,7 @@ import { AnimatedNumberComponent } from '@blackjack/components/animated-number/a
 export class NavbarComponent implements OnInit, OnDestroy {
   isMenuOpen = false;
   private authService: AuthService = inject(AuthService);
-  isLoggedIn = this.authService.isLoggedIn();
+  isLoggedIn = signal(this.authService.isLoggedIn());
 
   private authSubscription!: Subscription;
   public balance = signal(0);
@@ -30,6 +30,7 @@ export class NavbarComponent implements OnInit, OnDestroy {
     this.authSubscription = this.authService.userSubject.subscribe({
       next: (user) => {
         this.balance.set(user?.balance ?? 0);
+        this.isLoggedIn.set(this.authService.isLoggedIn());
       },
     });
   }