Compare commits
17
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
5931e8933c | ||
|
|
52c628faa0 | ||
|
|
f88b72d781 | ||
|
|
525ebde5ce | ||
|
|
0f98fa286e | ||
|
|
33f510dcdd | ||
|
|
52295e2c6d | ||
|
|
fe0387cc4c | ||
|
|
cfec1543ab | ||
|
|
49a6645378 | ||
|
|
11ef812f64 | ||
|
|
4b2e6477e5 | ||
|
|
e5f9ec5f1d | ||
|
|
11b97b9178 | ||
|
|
229999fa5a | ||
|
|
8e0053ab84 | ||
|
|
e837c55de8 |
No files matched your search
@@ -0,0 +1,176 @@
|
||||
# ADR 0009 — Checkout real (pago en línea + envíos) para ARI Shopping
|
||||
|
||||
**Estado:** aceptada — proveedor de pago decidido (PayU, §3);
|
||||
implementación real (credenciales, shipping options, código) pendiente
|
||||
**Fecha:** 2026-08-28
|
||||
|
||||
## Contexto
|
||||
|
||||
El carrito hoy no completa una transacción real: arma el pedido en el
|
||||
cliente y lo cierra con un botón "Continuar por WhatsApp"
|
||||
(`components/layout/navbar.tsx`, `mobile-add-to-cart.tsx`) — un
|
||||
placeholder intencional, no un bug. El diálogo de cuenta ya lo admite
|
||||
explícitamente ("El inicio de sesión quedará conectado al backend
|
||||
headless. Mientras tanto..."). Ni checkout ni auth de clientes tienen
|
||||
ADR previo ni intento de implementación en el historial de git de
|
||||
ningún repo del lab — este es terreno nuevo.
|
||||
|
||||
Investigación previa a este ADR (2026-08-28, confirmado contra código
|
||||
real y documentación oficial vigente, no memoria de entrenamiento —
|
||||
misma disciplina que ADR 0006):
|
||||
|
||||
- **Pagos:** `commerce-backend/medusa-config.ts` no registra ningún
|
||||
provider de pago — el único módulo configurado hoy es
|
||||
`@medusajs/medusa/file` (storage S3).
|
||||
- **Envíos:** existe una sola región ("Colombia", COP), creada a mano
|
||||
vía Admin API durante el incidente de precios de agosto
|
||||
(`incidente-medusa-precios-region-id-2026-08.md`), no vía ningún
|
||||
script de seed — no existe ningún script de seed en el repo. **No
|
||||
hay ninguna shipping option configurada en ningún lado.** Sin esto
|
||||
el checkout no puede completarse aunque el pago ya funcione — es un
|
||||
prerequisito invisible, independiente del proveedor de pago elegido.
|
||||
- **Auth:** cero código de cliente/login en todo el storefront (grep
|
||||
sobre `lib/`, `app/`, `components/` sin resultados para
|
||||
`customer`/`login`/`useAuth`/`/store/customers`). El módulo de
|
||||
auth/customer de Medusa viene incluido en el core — falta
|
||||
enteramente el lado del storefront, no el backend. **Medusa soporta
|
||||
checkout como invitado**, así que auth no bloquea checkout y puede
|
||||
secuenciarse por separado — fuera de alcance de este ADR.
|
||||
|
||||
## 1. Flujo de checkout real en Medusa v2 (Store API)
|
||||
|
||||
Confirmado contra `docs.medusajs.com` (2026-08-28): el flujo son 7
|
||||
pasos encadenados — crear carrito → agregar items → dirección de envío
|
||||
→ **seleccionar método de envío** (`POST` a la ruta de shipping method
|
||||
del carrito, requiere que ya exista al menos una shipping option) →
|
||||
payment collection → payment session → completar orden. Ningún paso
|
||||
es opcional; el paso de método de envío es exactamente el que hoy no
|
||||
tiene ninguna shipping option que ofrecer.
|
||||
|
||||
## 2. Estado real de soporte de pago en Medusa 2.18.0
|
||||
|
||||
- **Stripe es de primera clase** (`@medusajs/medusa/payment-stripe`,
|
||||
incluido en el core, no un plugin de terceros — a diferencia de la
|
||||
situación de Meilisearch en ADR 0006). Configuración mínima
|
||||
verificada:
|
||||
|
||||
```ts
|
||||
{
|
||||
resolve: "@medusajs/medusa/payment",
|
||||
options: {
|
||||
providers: [{
|
||||
resolve: "@medusajs/medusa/payment-stripe",
|
||||
id: "stripe",
|
||||
options: { apiKey: process.env.STRIPE_API_KEY },
|
||||
}],
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
Env vars: `STRIPE_API_KEY` (siempre) y `STRIPE_WEBHOOK_SECRET`
|
||||
(obligatorio en producción). Tras configurar, hay que habilitar el
|
||||
provider **en la región** desde el Admin — un paso manual aparte,
|
||||
igual que ya pasó con la región misma.
|
||||
|
||||
- **Bloqueador real de negocio, no técnico: Stripe no acepta cuentas
|
||||
de comercio registradas en Colombia.** Confirmado contra
|
||||
`stripe.com/global` (2026-08-28) — Brasil y México sí están en la
|
||||
lista de países soportados para abrir cuenta, Colombia no aparece.
|
||||
La única vía sería registrar una entidad de negocio en un país
|
||||
soportado, fuera de alcance realista para este lab. Esto invalida a
|
||||
Stripe como opción pese a ser la integración técnicamente más
|
||||
simple y mejor documentada.
|
||||
- **Alternativas con presencia real en Colombia y algún plugin de
|
||||
Medusa existente:**
|
||||
- **PayU** (`@tax1driver/medusa-payu`): el propio repo declara
|
||||
compatibilidad explícita con Medusa `v2.4.0+` — cubre nuestra
|
||||
versión (2.18.0). Webhook auto-registrado en `/hooks/payment/payu`.
|
||||
- **Wompi** (`medusa-payment-wompi-col`, respaldado por Bancolombia,
|
||||
liquidación directa en COP): revisé el repo directamente
|
||||
(2026-08-28) y **no documenta contra qué versión de Medusa se
|
||||
probó, ni tiene releases/actividad reciente visible** — mayor
|
||||
riesgo de compatibilidad no verificada que PayU, aunque el
|
||||
encaje de negocio (banco local, moneda nativa) sea el más
|
||||
directo. Antes de elegirlo habría que repetir el nivel de
|
||||
verificación que ADR 0006 le hizo al plugin de Meilisearch: leer
|
||||
el código fuente real, no confiar en el README.
|
||||
- **Riesgo de red ya conocido, no nuevo:** cualquier webhook de pago
|
||||
entra por la misma cadena Cloudflare → NPM → Traefik que ya causó
|
||||
un incidente real con otro servicio
|
||||
(`incidente-cloudflared-504-quic-2026-08.md`). Validar la entrega de
|
||||
webhooks en vivo antes de confiar en el flujo, no asumir que
|
||||
"funciona igual que todo lo demás".
|
||||
|
||||
## 3. Decisión de proveedor — PayU
|
||||
|
||||
Dato de negocio real que decidió esto (aportado por el usuario,
|
||||
2026-08-28): las cuentas bancarias disponibles son Davivienda, Lulo
|
||||
Bank y Banco de Bogotá — **ninguna es Bancolombia ni Nequi**.
|
||||
|
||||
Verificado contra fuentes reales el mismo día (no memoria):
|
||||
|
||||
- **Wompi exige cuenta Bancolombia o, como mínimo, cuenta Nequi para
|
||||
poder registrarse como comercio** (modelo Agregador) — confirmado
|
||||
contra el reglamento de comercios de Wompi y su centro de soporte.
|
||||
La liquidación de ventas sí puede ir después a cualquier banco
|
||||
colombiano, pero la puerta de entrada al registro sigue siendo
|
||||
Bancolombia/Nequi. Con los bancos disponibles hoy, esto exigiría
|
||||
abrir una cuenta Nequi nueva solo para poder registrarse — paso
|
||||
extra evitable.
|
||||
- **PayU solo exige "cuenta bancaria colombiana a nombre del
|
||||
comercio"**, sin banco específico — Davivienda, Lulo Bank o Banco de
|
||||
Bogotá califican igual, sin pasos previos. Además ya soporta **PSE**
|
||||
(transferencia desde cualquier banco colombiano del cliente, sin
|
||||
relación con el banco del comercio), **Nequi** y **Daviplata** como
|
||||
métodos de pago para los clientes vía redirección — cubre exactamente
|
||||
los métodos que se pidieron (PSE + Nequi "y demás bancos") sin que
|
||||
la cuenta bancaria propia del comercio sea Bancolombia.
|
||||
|
||||
**Decisión:** PayU, vía el plugin comunitario `@tax1driver/medusa-payu`
|
||||
(compatibilidad declarada con Medusa 2.4.0+, cubre nuestra versión
|
||||
2.18.0). Wompi queda descartado por el requisito de registro
|
||||
Bancolombia/Nequi, no por limitación técnica del plugin en sí.
|
||||
|
||||
**Pendiente antes de implementar (no resoluble en este ADR):**
|
||||
|
||||
- Registro real de comercio en PayU (persona natural o jurídica —
|
||||
jurídica pide NIT, representante legal y estados financieros
|
||||
básicos) y credenciales reales (API keys, merchant ID, webhook
|
||||
config) — nunca generadas ni asumidas por mí.
|
||||
- Verificar el código fuente real de `@tax1driver/medusa-payu` en el
|
||||
tag exacto a instalar antes de confiar en su documentación, misma
|
||||
disciplina que ya destapó desviaciones reales en el plugin de
|
||||
Meilisearch (ADR 0006).
|
||||
|
||||
## Opciones consideradas
|
||||
|
||||
| Opción | A favor | En contra |
|
||||
|---|---|---|
|
||||
| **Stripe** | Integración core de Medusa, mejor documentada, configuración mínima | No acepta comercios registrados en Colombia — bloqueador de negocio, no técnico |
|
||||
| **PayU** (`@tax1driver/medusa-payu`) — **elegido** | Compatibilidad declarada explícitamente con Medusa 2.4.0+ (cubre 2.18.0); solo exige cuenta bancaria colombiana a nombre del comercio, sin banco específico (encaja con Davivienda/Lulo Bank/Banco de Bogotá); soporta PSE + Nequi + Daviplata para el cliente sin importar el banco del comercio | Plugin comunitario, no de primera clase; requiere la misma verificación de código fuente que ya se le hizo al plugin de Meilisearch antes de confiar en él |
|
||||
| **Wompi** (`medusa-payment-wompi-col`) | Liquidación directa en COP vía Bancolombia | Exige cuenta Bancolombia o, como mínimo, Nequi solo para **registrarse** como comercio — ninguno de los bancos disponibles (Davivienda/Lulo Bank/Banco de Bogotá) califica sin abrir una cuenta nueva; además, sin versión de Medusa documentada ni actividad reciente visible en el plugin |
|
||||
| **Seguir con WhatsApp** (no pago en línea) | Cero riesgo nuevo, cero dependencia externa | No resuelve el objetivo real (transacción completa sin intervención manual); no es checkout, es lo que ya existe hoy |
|
||||
|
||||
## Consecuencias
|
||||
|
||||
- Las shipping options son un prerequisito independiente del proveedor
|
||||
y deben configurarse primero — sin ellas ningún flujo de checkout
|
||||
completa, sea cual sea el pago.
|
||||
- Al ser `@tax1driver/medusa-payu` un plugin comunitario (no de
|
||||
primera clase como Stripe), exige la misma disciplina de
|
||||
verificación que ya destapó desviaciones reales en el plugin de
|
||||
Meilisearch (ADR 0006, nota de implementación): leer el código
|
||||
fuente en el tag exacto que se va a instalar, no el README genérico
|
||||
ni asumir que "compatibilidad declarada" significa "verificado en
|
||||
este proyecto".
|
||||
- Los webhooks de pago (registrados por el plugin en
|
||||
`/hooks/payment/payu`) deben validarse en vivo contra la cadena de
|
||||
red real del lab antes de confiar en el flujo, dado el precedente de
|
||||
`incidente-cloudflared-504-quic-2026-08.md`.
|
||||
- Se acepta como deuda: si en el futuro se abre una cuenta Bancolombia
|
||||
o Nequi, Wompi (liquidación más directa en COP) vuelve a ser una
|
||||
opción válida a reevaluar — no se descarta por limitación técnica,
|
||||
solo por el requisito de registro actual.
|
||||
- Revertir esta decisión implica deshabilitar el provider en la región
|
||||
y volver al botón de WhatsApp — el carrito y el catálogo no cambian
|
||||
de forma, solo el paso final.
|
||||
@@ -96,6 +96,7 @@ nav:
|
||||
- "0006 · Motor de búsqueda y facetas": decisiones/0006-motor-busqueda-facetas.md
|
||||
- "0007 · Identidad visual propia": decisiones/0007-identidad-visual-propia.md
|
||||
- "0008 · Identidad Navy & Coral": decisiones/0008-identidad-navy-coral.md
|
||||
- "0009 · Checkout real": decisiones/0009-checkout-real.md
|
||||
- Plantilla ADR: decisiones/plantilla-adr.md
|
||||
- Playbooks:
|
||||
- Crashloop Medusa: playbooks/incidente-crashloop-medusa.md
|
||||
|
||||
@@ -25,7 +25,7 @@ spec:
|
||||
runAsNonRoot: false
|
||||
containers:
|
||||
- name: app
|
||||
image: gitea.cruzcloud.net/devops/docs-portal:v1.0.188
|
||||
image: gitea.cruzcloud.net/devops/docs-portal:v1.0.206
|
||||
# El base saca TODAS las capabilities. Probado en vivo y
|
||||
# revertido: con drop: ALL (aunque se agregue NET_BIND_SERVICE
|
||||
# de vuelta) el propio entrypoint de nginx:1.27-alpine falla al
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { ArrowRight } from "lucide-react";
|
||||
import { CategoryTiles } from "@/components/home/category-tiles";
|
||||
@@ -17,5 +18,24 @@ export const dynamic = "force-dynamic";
|
||||
export default async function HomePage() {
|
||||
const [products, categories] = await Promise.all([getProducts(), getCategories()]);
|
||||
const treasures = products.filter((product) => product.isNew || product.featured).slice(0, 8);
|
||||
return <><HeroCarousel /><TrustBar /><div className="content-auto"><CategoryTiles categories={categories} /></div><section className="content-auto mx-auto max-w-7xl px-4 py-14"><div className="mb-8 flex items-end justify-between gap-5"><div><span className="text-xs font-black uppercase tracking-[.18em] text-fuchsia-600">Novedades</span><h2 className="mt-2 text-4xl font-black tracking-tight sm:text-5xl">Tesoros recién llegados</h2><p className="mt-3 text-slate-500">Desliza y encuentra nuevos favoritos.</p></div><Button asChild variant="outline" className="hidden sm:inline-flex"><Link href="/catalog">Ver catálogo <ArrowRight className="size-4" /></Link></Button></div><ProductCarousel products={treasures} /></section><section className="content-auto mx-auto max-w-7xl px-4 pb-20"><div className="grid overflow-hidden rounded-[2rem] bg-gradient-to-r from-cyan-500 via-blue-600 to-violet-600 text-white shadow-2xl lg:grid-cols-[1fr_.7fr]"><div className="p-8 sm:p-12"><span className="text-xs font-black uppercase tracking-[.18em] text-yellow-300">Club ARI</span><h2 className="mt-3 text-4xl font-black tracking-tight sm:text-6xl">Promociones, lanzamientos y mucha diversión.</h2><p className="mt-5 max-w-xl text-white/80">Únete a nuestra comunidad y recibe primero las novedades del catálogo.</p><Button variant="yellow" size="lg" className="mt-7">Quiero unirme</Button></div><div className="min-h-64 bg-[url('/images/promo/promo-backpacks.webp')] bg-cover bg-center" /></div></section></>;
|
||||
return <><HeroCarousel /><TrustBar /><div className="content-auto"><CategoryTiles categories={categories} /></div><section className="content-auto mx-auto max-w-7xl px-4 py-14"><div className="mb-8 flex items-end justify-between gap-5"><div><span className="text-xs font-black uppercase tracking-[.18em] text-ari-coral">Novedades</span><h2 className="mt-2 text-4xl font-black tracking-tight sm:text-5xl">Tesoros recién llegados</h2><p className="mt-3 text-slate-500">Desliza y encuentra nuevos favoritos.</p></div><Button asChild variant="outline" className="hidden sm:inline-flex"><Link href="/catalog">Ver catálogo <ArrowRight className="size-4" /></Link></Button></div><ProductCarousel products={treasures} /></section><section className="content-auto mx-auto max-w-7xl px-4 pb-20"><div className="grid overflow-hidden rounded-[2rem] bg-ari-marino text-white shadow-2xl lg:grid-cols-[1fr_.7fr]"><div className="p-8 sm:p-12"><span className="text-xs font-black uppercase tracking-[.18em] text-ari-coral-claro">Club ARI</span><h2 className="mt-3 text-4xl font-black tracking-tight sm:text-6xl">Promociones, lanzamientos y mucha diversión.</h2><p className="mt-5 max-w-xl text-white/80">Únete a nuestra comunidad y recibe primero las novedades del catálogo.</p><Button variant="yellow" size="lg" className="mt-7">Quiero unirme</Button></div>{/* No hay herramienta de generacion de imagenes disponible para crear un
|
||||
asset nuevo -- se reconstruye el mismo efecto (fondo punteado +
|
||||
fotos estilo polaroid) con CSS y fotos reales de producto ya
|
||||
existentes, en azul/amarillo de marca en vez del violeta original
|
||||
de promo-backpacks.webp. */}
|
||||
<div className="relative min-h-64 overflow-hidden bg-ari-coral-claro">
|
||||
<div className="absolute inset-0 [background-image:radial-gradient(rgba(0,85,184,0.35)_1.5px,transparent_1.5px)] [background-size:18px_18px]" />
|
||||
<div className="absolute -bottom-12 -left-12 size-52 rounded-full bg-ari-marino" />
|
||||
<div className="absolute inset-0 flex items-center justify-center gap-3 p-6">
|
||||
<div className="relative size-28 -rotate-6 overflow-hidden rounded-xl border-4 border-white bg-white shadow-xl sm:size-32">
|
||||
<Image src="/images/products/ari-011-mochila-escolar-de-spider-man-de-disney-.webp" alt="" fill sizes="128px" className="object-cover" />
|
||||
</div>
|
||||
<div className="relative size-28 rotate-3 overflow-hidden rounded-xl border-4 border-white bg-white shadow-xl sm:size-32">
|
||||
<Image src="/images/products/ari-016-disney-mochila-iron-man-de-poliester-ult.webp" alt="" fill sizes="128px" className="object-cover" />
|
||||
</div>
|
||||
<div className="relative hidden size-28 -rotate-3 overflow-hidden rounded-xl border-4 border-white bg-white shadow-xl sm:block sm:size-32">
|
||||
<Image src="/images/products/ari-009-mochilas-disney-coleccion-marvel.webp" alt="" fill sizes="128px" className="object-cover" />
|
||||
</div>
|
||||
</div>
|
||||
</div></div></section></>;
|
||||
}
|
||||
@@ -37,15 +37,14 @@ export function PromoTile({ category, className = "" }: { category: Category; cl
|
||||
href={`/catalog?category=${encodeURIComponent(category.name)}`}
|
||||
className={cn(`group relative min-h-64 overflow-hidden rounded-[2rem] ${content.color} shadow-sm ring-1 ring-slate-900/5`, className)}
|
||||
>
|
||||
{/* Patron real de Walmart (confirmado con referencia del usuario):
|
||||
la foto NO cubre la tarjeta completa -- flota, contenida, sobre
|
||||
el fondo pastel solido, igual que las tarjetas sin foto. Un
|
||||
intento anterior con la foto a pantalla completa + una franja
|
||||
de degradado abajo para el texto quedaba desconectado del resto
|
||||
de tarjetas solidas, reportado en produccion. */}
|
||||
{/* Patron Walmart: foto recortada (object-cover) llenando casi toda
|
||||
la tarjeta, con solo un margen delgado del pastel como marco --
|
||||
no flotando chica con espacio muerto alrededor (object-contain,
|
||||
intento anterior, reportado como "no aprovecha el espacio"), ni
|
||||
a pantalla completa sin marco (el intento antes de ese). */}
|
||||
{content.image && (
|
||||
<div className="absolute inset-x-6 top-6 bottom-24">
|
||||
<Image src={content.image} alt="" fill sizes="(max-width: 640px) 45vw, (max-width: 1024px) 25vw, 14vw" className="object-contain object-top drop-shadow-xl transition duration-500 group-hover:scale-105" />
|
||||
<div className="absolute inset-3 bottom-24 overflow-hidden rounded-2xl">
|
||||
<Image src={content.image} alt="" fill sizes="(max-width: 640px) 45vw, (max-width: 1024px) 25vw, 14vw" className="object-cover transition duration-500 group-hover:scale-105" />
|
||||
</div>
|
||||
)}
|
||||
<div className="absolute inset-x-0 bottom-0 flex items-end justify-between p-6 text-slate-900">
|
||||
|
||||
@@ -25,7 +25,7 @@ spec:
|
||||
runAsUser: 1001
|
||||
containers:
|
||||
- name: app
|
||||
image: gitea.cruzcloud.net/devops/ecommerce-frontend:v1.0.200
|
||||
image: gitea.cruzcloud.net/devops/ecommerce-frontend:v1.0.204
|
||||
env:
|
||||
- name: HEADLESS_PROVIDER
|
||||
value: medusa
|
||||
|
||||
Reference in new issue
Block a user