feat: implement variant selection in cart and product components for enhanced user experience

src/app/core/services/cart/cart.interface.ts

@@ -1,6 +1,14 @@
 export interface CartItemProduct {
   nombre: string;
   imagen: string | null;
+  variants?: CartItemVariant[];
+}
+
+export interface CartItemVariant {
+  id: number;
+  precio: string;
+  stock_tecnico: number | null;
+  values: Record<string, string | string[]>;
 }
 
 export interface CartItem {

src/app/core/services/cart/cart.service.ts

@@ -50,9 +50,7 @@ export class CartService extends BaseApiService {
   ): Observable<ApiResponse<Cart>> {
     this.isUpdatingState.set(true);
     return this.http
-      .post<
-        ApiResponse<Cart>
-      >(
+      .post<ApiResponse<Cart>>(
         `${this.tenantApiUrl}/cart/items`,
         { catalog_item_id: catalogItemId, variant_id: variantId, cantidad },
         {
@@ -71,21 +69,27 @@ export class CartService extends BaseApiService {
       );
   }
 
-  updateItemQuantity(
+  updateItemQuantity(cartItemId: number, cantidad: number): Observable<ApiResponse<Cart>> {
+    return this.updateItem(cartItemId, { cantidad });
+  }
+
+  updateItemVariant(
     cartItemId: number,
     cantidad: number,
+    variantId: number,
+  ): Observable<ApiResponse<Cart>> {
+    return this.updateItem(cartItemId, { cantidad, variant_id: variantId });
+  }
+
+  private updateItem(
+    cartItemId: number,
+    payload: { cantidad: number; variant_id?: number },
   ): Observable<ApiResponse<Cart>> {
     this.isUpdatingState.set(true);
     return this.http
-      .patch<
-        ApiResponse<Cart>
-      >(
-        `${this.tenantApiUrl}/cart/items/${cartItemId}`,
-        { cantidad },
-        {
-          withCredentials: true,
-        },
-      )
+      .patch<ApiResponse<Cart>>(`${this.tenantApiUrl}/cart/items/${cartItemId}`, payload, {
+        withCredentials: true,
+      })
       .pipe(
         tap((response) => {
           this.cartState.set(response.data);
@@ -101,9 +105,7 @@ export class CartService extends BaseApiService {
   removeItem(cartItemId: number): Observable<ApiResponse<Cart>> {
     this.isUpdatingState.set(true);
     return this.http
-      .delete<
-        ApiResponse<Cart>
-      >(`${this.tenantApiUrl}/cart/items/${cartItemId}`, {
+      .delete<ApiResponse<Cart>>(`${this.tenantApiUrl}/cart/items/${cartItemId}`, {
         withCredentials: true,
       })
       .pipe(