Reemplaza los inputs de texto libre de Ciudad/Departamento por dos selects en cascada, poblados con el dataset oficial de DIVIPOLA (33 departamentos + 1123 municipios, fuente proyecto26/colombia, verificado contra la codificacion real del DANE antes de incorporarlo -- id 5001 = Medellin, departmentId 5 = Antioquia, etc.). Sin dependencia npm nueva (JSON estatico + helper propio). Se guarda el id DIVIPOLA seleccionado en el estado del formulario, no solo el nombre -- EnvioClick (la integracion de envios real que reemplazara la tarifa fija de este ADR) va a necesitar identificar la ciudad sin ambiguedad, y las transportadoras colombianas referencian ciudades por este codigo. El nombre derivado del id sigue siendo lo que se manda a Medusa (shipping_address espera texto, no cambia el contrato existente).
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.