feat: implement product overview and quantity components

src/app/services/product.service.ts

@@ -0,0 +1,43 @@
+import { Injectable, signal, WritableSignal } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Observable, shareReplay } from 'rxjs';
+import { Product } from '../product-selection/product-selection.component';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ProductService {
+  private productSignal = signal<Product | null>(null);
+  private quantitySignal = signal<number>(1);
+
+  constructor(private http: HttpClient) {}
+
+  // Local state management
+  setProduct(product: Product | null): void {
+    this.productSignal.set(product);
+    if (product) {
+      this.quantitySignal.set(1);
+    }
+  }
+
+  getProduct(): Product | null {
+    return this.productSignal();
+  }
+
+  setQuantity(quantity: number): void {
+    this.quantitySignal.set(quantity);
+  }
+
+  getQuantity(): number {
+    return this.quantitySignal();
+  }
+
+  // API calls
+  getProducts(): Observable<any[]> {
+    return this.http.get<any[]>('https://fakestoreapi.com/products');
+  }
+
+  getProductById(id: number): Observable<any> {
+    return this.http.get<any>(`https://fakestoreapi.com/products/${id}`);
+  }
+}