Primer corte de checkout real, a proposito acotado: el carrito pasa de estado 100% local (localStorage con productos completos) a sincronizar con un cart_id real de Medusa via /api/cart/* (rutas puente same-origin, mismo patron que /api/search -- MEDUSA_BACKEND_URL es DNS interno del cluster, no resuelve desde el navegador). Formas de respuesta de la API verificadas en vivo con un carrito de prueba real antes de escribir el mapeo (no asumidas contra documentacion): agregar el mismo variant_id dos veces hace merge de cantidad automatico (no crea linea duplicada); eliminar una linea devuelve el carrito actualizado en 'parent', no en 'cart' como los demas endpoints. La firma publica de useCartStore (addItem/removeItem/updateQuantity/ items) no cambia, asi que ningun componente consumidor (cart-drawer, navbar, product-card, product-purchase, mobile-add-to-cart) necesito tocarse. Sigue cerrando por WhatsApp -- direccion/envio/pago quedan para los siguientes cortes del ADR 0009.
ARI Shopping Headless Storefront v4.1
Actualización enfocada en UX, interactividad y rendimiento sobre Next.js 15.5.10.
Correcciones principales
- Encabezado blanco premium con acentos cyan, violeta, fucsia y navegación negra.
- Imágenes promocionales sin
opacity,mix-blendni filtros de color. - Menú principal funcional mediante Drawer accesible de Radix UI.
- Cuenta y favoritos funcionales.
- Carrusel con flechas, teclado, scroll suave y
scroll-snap. - Zoom real de producto entre 100% y 300%, rueda, botones, doble clic y arrastre.
- Thumbnails WebP dedicados para tarjetas, búsqueda, carrito y favoritos.
- Recursos originales recomprimidos y caché HTTP para
/images. next/imageen modounoptimizedporque los recursos ya vienen procesados; evita latencia del optimizador durante la primera visita.- Menos componentes animados con JavaScript; las tarjetas usan transiciones CSS.
content-visibilitypara contenido fuera de pantalla.- Pantalla
loading.tsxpara transiciones de ruta.
Validación
npm ci
npm run typecheck
npm run build
Flujo
Gitea → Gitea Actions → Registry → actualización de frontend.yaml → Argo CD → Kubernetes.