feat: enhance variant attribute handling across components for improved selection and display

src/app/core/layout/store-layout/store-layout.component.ts

@@ -12,6 +12,7 @@ import { findMenu } from '../../services/menu.utils';
 import { CheckoutService } from '../../services/checkout.service';
 import { ToastService } from '../../services/toast.service';
 import { Category } from '../../services/tenant.interface';
+import { VariantAttributeValue } from '../../services/catalog/catalog.interface';
 
 @Component({
   selector: 'app-store-layout',
@@ -80,7 +81,7 @@ export class StoreLayoutComponent implements OnInit {
     if (selectedVariant) {
       attributes = Object.entries(selectedVariant.values).map(([label, value]) => ({
         label: this.formatAttributeLabel(label),
-        value: Array.isArray(value) ? value.join(', ') : value,
+        value: this.variantAttributeLabel(value),
       }));
     }
 
@@ -103,6 +104,14 @@ export class StoreLayoutComponent implements OnInit {
     return label.charAt(0).toUpperCase() + label.slice(1);
   }
 
+  private variantAttributeLabel(value: VariantAttributeValue): string {
+    if (typeof value === 'string') return value;
+    if (Array.isArray(value)) {
+      return value.map((item) => (typeof item === 'string' ? item : item.label)).join(', ');
+    }
+    return value.label;
+  }
+
   protected readonly currentYear = new Date().getFullYear();
   protected readonly tenant = this.tenantService.tenant;
   protected readonly user = this.authService.user;

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

@@ -1,3 +1,5 @@
+import { VariantAttributeValue } from '../catalog/catalog.interface';
+
 export interface CartItemProduct {
   nombre: string;
   imagen: string | null;
@@ -8,7 +10,7 @@ export interface CartItemVariant {
   id: number;
   precio: string;
   stock_tecnico: number | null;
-  values: Record<string, string | string[]>;
+  values: Record<string, VariantAttributeValue>;
 }
 
 export interface CartItem {

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

@@ -47,6 +47,17 @@ export interface ProductAttribute {
 
 export type InventoryPolicy = 'tracked' | 'unlimited';
 
+export interface VariantAttributeOptionValue {
+  value: string;
+  label: string;
+}
+
+export type VariantAttributeValue =
+  | VariantAttributeOptionValue
+  | VariantAttributeOptionValue[]
+  | string
+  | string[];
+
 export interface CatalogItemVariant {
   id: number;
   descripcion?: string | null;
@@ -59,7 +70,7 @@ export interface CatalogItemVariant {
   maximum_use_date?: string | null;
   effective_minimum_use_date?: string | null;
   effective_maximum_use_date?: string | null;
-  values: Record<string, string | string[]>;
+  values: Record<string, VariantAttributeValue>;
 }
 
 export interface SelectedCatalogItemVariant extends CatalogItemVariant {
@@ -98,7 +109,7 @@ export interface CatalogFeaturedItemVariant {
   descripcion?: string | null;
   precio?: string;
   stock_tecnico: number | null;
-  values: Record<string, string | string[]>;
+  values: Record<string, VariantAttributeValue>;
 }
 
 export interface CatalogFeaturedItem {