feat(ecommerce): migrate Ari Shopping to Next.js 15 headless storefront v4

workloads/ecommerce/README.md

@@ -1,59 +1,30 @@
-# ARI Shopping Headless Storefront v4.0
+# ARI Shopping Headless Storefront v4.1
 
-Código base moderno para la tienda online ARI Shopping.
+Actualización enfocada en UX, interactividad y rendimiento sobre Next.js 15.5.10.
 
-## Stack
+## Correcciones principales
 
-- Next.js 15 con App Router y Server Components.
-- React 19 y TypeScript estricto.
-- Tailwind CSS 4.
-- Componentes accesibles estilo shadcn/ui sobre Radix UI.
-- Motion for React para microinteracciones.
-- Zustand con persistencia local para el carrito.
-- Adaptadores headless para catálogo local, Shopify Storefront API o Medusa.
-- `next/image` para optimización de imágenes.
-- Docker multi-stage con salida standalone.
+- Encabezado blanco premium con acentos cyan, violeta, fucsia y navegación negra.
+- Imágenes promocionales sin `opacity`, `mix-blend` ni 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/image` en modo `unoptimized` porque los recursos ya vienen procesados; evita latencia del optimizador durante la primera visita.
+- Menos componentes animados con JavaScript; las tarjetas usan transiciones CSS.
+- `content-visibility` para contenido fuera de pantalla.
+- Pantalla `loading.tsx` para transiciones de ruta.
 
-## Funcionalidad incluida
-
-- Header promocional cyan/amarillo/magenta.
-- Búsqueda predictiva.
-- Hero promocional Bento.
-- Carrusel horizontal de novedades.
-- Catálogo con búsqueda y filtros sin recarga.
-- PDP dinámica con galería, zoom, variantes y recomendados.
-- Botón móvil persistente para añadir al carrito.
-- Carrito lateral con Zustand y persistencia.
-- SEO y metadata con App Router.
-- Endpoint `/api/health`.
-- Arquitectura preparada para Shopify o Medusa.
-
-## Desarrollo
+## Validación
 
 ```bash
-cp .env.example .env.local
-npm install
-npm run dev
+npm ci
+npm run typecheck
+npm run build
 ```
 
-## Variables headless
+## Flujo
 
-El valor predeterminado es:
-
-```text
-HEADLESS_PROVIDER=mock
-```
-
-Proveedores preparados:
-
-```text
-mock
-shopify
-medusa
-```
-
-Los adaptadores Shopify y Medusa incluyen la conexión inicial y un punto claro para completar el mapeo al modelo `Product`.
-
-## Compatibilidad GitOps
-
-El contenedor Next.js escucha en el puerto `80`, por lo que mantiene compatibilidad con el Service y Deployment existentes que apuntaban al frontend Nginx.
+Gitea → Gitea Actions → Registry → actualización de `frontend.yaml` → Argo CD → Kubernetes.