feat(ticket-selector): implement ticket selector component with layout and functionality

src/app/features/store/pages/store-home-page/store-home-page.component.ts

@@ -10,7 +10,7 @@ import {
 } from '@angular/core';
 import { HttpErrorResponse } from '@angular/common/http';
 import { ActivatedRoute, Router } from '@angular/router';
-import { Subscription } from 'rxjs';
+import { firstValueFrom, Subscription } from 'rxjs';
 
 import { CartService } from '../../../../core/services/cart/cart.service';
 import { AuthService } from '../../../../core/services/auth/auth.service';
@@ -178,13 +178,23 @@ export class StoreHomePageComponent implements OnInit, OnDestroy {
 
     this.creatingDirectPurchase.set(true);
     try {
-      const purchase = await this.injector.get(CheckoutService).startCheckout(tenant.codigo, {
-        direct_item: {
-          catalog_item_id: event.product.id,
-          variant_id: event.variant ?? null,
-          cantidad: event.quantity,
-        },
-      });
+      const checkoutService = this.injector.get(CheckoutService);
+      const variantIds = event.variantIds ?? [];
+      const purchase =
+        variantIds.length > 1
+          ? await this.startTicketCheckout(
+              checkoutService,
+              tenant.codigo,
+              event.product.id,
+              variantIds,
+            )
+          : await checkoutService.startCheckout(tenant.codigo, {
+              direct_item: {
+                catalog_item_id: event.product.id,
+                variant_id: event.variant ?? null,
+                cantidad: event.quantity,
+              },
+            });
       await this.router.navigate(['/checkout'], { queryParams: { purchase: purchase.id } });
     } catch (error) {
       console.error('Failed to create direct purchase:', error);
@@ -194,6 +204,24 @@ export class StoreHomePageComponent implements OnInit, OnDestroy {
     }
   }
 
+  private async startTicketCheckout(
+    checkoutService: CheckoutService,
+    tenantCode: string,
+    catalogItemId: number,
+    variantIds: number[],
+  ) {
+    for (const variantId of variantIds) {
+      await firstValueFrom(this.cartService.addItem(catalogItemId, variantId, 1));
+    }
+
+    const cartId = this.cartService.cart()?.id;
+    if (cartId === null || cartId === undefined) {
+      throw new Error('No se pudo crear el carrito para las entradas seleccionadas.');
+    }
+
+    return checkoutService.startCheckout(tenantCode, { cart_id: cartId });
+  }
+
   protected onAddToCart(event: ProductListCartEvent): void {
     this.cartService.addItem(event.product.id, event.variant ?? null, event.quantity).subscribe({
       next: (response) => {