models

src/app/core/models/address.model.ts

@@ -19,6 +19,9 @@ export interface CreateAddress {
   postalCode: string;
   country: string;
   type: AddressType;
+  // FEHLTEN:
+  firstName: string;
+  lastName: string;
 }
 
 export interface UpdateAddress extends CreateAddress {

src/app/core/models/order.model.ts

@@ -34,6 +34,9 @@ export interface OrderDetail {
   totalAmount: number;
   shippingAddress: Address;
   billingAddress: Address;
+   shippingAddressId?: string;
+  billingAddressId?: string;
+  paymentMethodId?: string;
   paymentMethod?: string;
   shippingTrackingNumber?: string;
   shippedDate?: string;

src/app/core/models/shared.models.ts

@@ -0,0 +1,9 @@
+// Das Backend sendet dies bei Validierungsfehlern (400 Bad Request)
+export interface ValidationProblemDetails {
+  type?: string;
+  title?: string;
+  status?: number;
+  detail?: string;
+  instance?: string;
+  errors?: { [key: string]: string[] };
+}

src/app/core/models/user.model.ts

@@ -8,6 +8,9 @@ export interface User {
   lastActive?: string;
   firstName?: string;
   lastName?: string;
+  phoneNumber?: string;
+  defaultShippingAddressId?: string;
+  defaultBillingAddressId?: string;
 }
 
 export interface UpdateUserRolesRequest {

src/app/shared/components/layout/sidebar/sidebar.component.html

@@ -1,128 +1,128 @@
 <aside class="sidebar" [class.collapsed]="isCollapsed">
   <nav class="sidebar-nav">
+    <!-- Toggle bleibt wie er ist, da er keine Route ist -->
     <div class="nav-item" (click)="toggleSidebar()">
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>Toggle</span>
     </div>
 
+    <!-- Products -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'home'"
-      (click)="setActive('home')"
+      routerLink="/shop/products"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
+      <span>products</span>
+    </div>
 
+    <!-- Home -->
+    <div
+      class="nav-item"
+      routerLink="/shop/home"
+      routerLinkActive="active"
+    >
+      <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
       <span>Home</span>
     </div>
 
+    <!-- Categories -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'categories'"
-      (click)="setActive('categories')"
+      routerLink="/shop/categories"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>categories</span>
     </div>
 
+    <!-- Discounts -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'discounts'"
-      (click)="setActive('discounts')"
+      routerLink="/shop/discounts"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>discounts</span>
     </div>
+
+    <!-- Orders -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'orders'"
-      (click)="setActive('orders')"
+      routerLink="/shop/orders"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>orders</span>
     </div>
+
+    <!-- Payment Methods -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'payment-methods'"
-      (click)="setActive('payment-methods')"
+      routerLink="/shop/payment-methods"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>payment-methods</span>
     </div>
+   
+    <!-- Reviews -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'products'"
-      (click)="setActive('products')"
+      routerLink="/shop/reviews"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
-      <span>products</span>
-    </div>
-    <div
-      class="nav-item"
-      [class.active]="activeRoute === 'reviews'"
-      (click)="setActive('reviews')"
-    >
-      <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>reviews</span>
     </div>
-    <!-- <div
-      class="nav-item"
-      [class.active]="activeRoute === 'settings'"
-      (click)="setActive('settings')"
-    >
-      <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
 
-      <span>settings</span>
-    </div> -->
+    <!-- Shipping Methods -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'shipping-methods'"
-      (click)="setActive('shipping-methods')"
+      routerLink="/shop/shipping-methods"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>shipping-methods</span>
     </div>
+
+    <!-- Shop Info -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'shop-info'"
-      (click)="setActive('shop-info')"
+      routerLink="/shop/shop-info"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>shop-info</span>
     </div>
+
+    <!-- Supplier List -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'supplier-list'"
-      (click)="setActive('supplier-list')"
+      routerLink="/shop/supplier-list"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>supplier-list</span>
     </div>
+
+    <!-- Users -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'users'"
-      (click)="setActive('users')"
+      routerLink="/shop/users"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>users</span>
     </div>
+
+    <!-- Analytics -->
     <div
       class="nav-item"
-      [class.active]="activeRoute === 'analytics'"
-      (click)="setActive('analytics')"
+      routerLink="/shop/analytics"
+      routerLinkActive="active"
     >
       <app-icon [iconName]="'placeholder'" [svgColor]="'#8e44ad'"></app-icon>
-
       <span>analytics</span>
     </div>
   </nav>

src/app/shared/components/layout/sidebar/sidebar.component.ts

@@ -1,51 +1,40 @@
-// /src/app/core/components/default-layout/sidebar/sidebar.component.ts
-
 import { Component, OnInit, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { RouterLink, RouterLinkActive } from '@angular/router'; // RouterLink und RouterLinkActive importieren
+// WICHTIG: RouterLink und RouterLinkActive importieren
+import { RouterLink, RouterLinkActive, Router } from '@angular/router'; 
 import { IconComponent } from '../../ui/icon/icon.component';
 import { StorageService } from '../../../../core/services/storage.service';
-import { Router } from '@angular/router';
 
 @Component({
   selector: 'app-sidebar',
   standalone: true,
-  imports: [CommonModule, IconComponent], // RouterLink und RouterLinkActive hier hinzufügen
+  // WICHTIG: Hier im Array hinzufügen
+  imports: [CommonModule, IconComponent, RouterLink, RouterLinkActive], 
   templateUrl: './sidebar.component.html',
   styleUrl: './sidebar.component.css',
 })
 export class SidebarComponent implements OnInit {
-  // --- Abhängigkeiten mit moderner inject()-Syntax ---
   private storageService = inject(StorageService);
-
   private readonly sidebarCollapsedKey = 'app-sidebar-collapsed';
+  
   public isCollapsed = false;
 
-  activeRoute = 'dashboard';
   constructor(private router: Router) {}
 
   ngOnInit(): void {
     this.loadCollapsedState();
   }
 
-  setActive(route: string): void {
-    this.activeRoute = route;
-    this.router.navigateByUrl('/shop/' + route);
-  }
-
   toggleSidebar(): void {
     this.isCollapsed = !this.isCollapsed;
     this.saveCollapsedState();
   }
 
   private loadCollapsedState(): void {
-    // Der Service kümmert sich um die Browser-Prüfung und gibt boolean oder null zurück
-    this.isCollapsed =
-      this.storageService.getItem<boolean>(this.sidebarCollapsedKey) ?? false;
+    this.isCollapsed = this.storageService.getItem<boolean>(this.sidebarCollapsedKey) ?? false;
   }
 
   private saveCollapsedState(): void {
-    // Der Service kümmert sich um die Serialisierung des booleans
     this.storageService.setItem(this.sidebarCollapsedKey, this.isCollapsed);
   }
 }