feat(purchase-status): implement purchase status page with loading and error handling

src/app/features/store/pages/checkout-page/checkout-page.component.html

@@ -21,6 +21,7 @@
             (paymentMethodChange)="selectPaymentMethod($event)"
             (copyTransferValue)="copyTransferValue($event.field, $event.value)"
             (cancelStep)="onCancel()"
+            (finalize)="onFinalize()"
           />
         </app-step>
       </app-stepper>

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

@@ -240,4 +240,26 @@ export class CheckoutPageComponent implements OnInit {
       this.copiedTransferField.set(null);
     }
   }
+
+  protected async onFinalize(): Promise<void> {
+    const purchaseId = this.createdPurchaseId();
+    const tenant = this.tenantService.tenant();
+
+    if (!purchaseId || !tenant) {
+      return;
+    }
+
+    try {
+      this.isGeneratingIntent.set(true); // Re-use this flag for loading state
+      await this.checkoutService.finalizePurchase(tenant.codigo, purchaseId);
+      void this.router.navigate(['/checkout/status', purchaseId]);
+    } catch (error) {
+      console.error('Failed to finalize purchase:', error);
+      // Even on failure, we probably want to navigate to the status page to show 'pending' or whatever state it is in.
+      // But maybe the endpoint returns error if not paid. For now, navigate anyway so the status page handles the state.
+      void this.router.navigate(['/checkout/status', purchaseId]);
+    } finally {
+      this.isGeneratingIntent.set(false);
+    }
+  }
 }

src/app/features/store/pages/checkout-page/checkout-payment-step.component.html

@@ -142,6 +142,7 @@
       type="button"
       hostClass="checkout-payment__action-btn"
       [disabled]="isGeneratingIntent()"
+      (click)="finalize.emit()"
     >
       Finalizar compra
     </app-button>

src/app/features/store/pages/checkout-page/checkout-payment-step.component.ts

@@ -25,6 +25,7 @@ export class CheckoutPaymentStepComponent {
   readonly paymentMethodChange = output<PaymentMethod>();
   readonly copyTransferValue = output<{ field: TransferField; value: string }>();
   readonly cancelStep = output<void>();
+  readonly finalize = output<void>();
 
   protected selectPaymentMethod(method: PaymentMethod): void {
     this.paymentMethodChange.emit(method);