+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/configuracion/page.tsx b/almeira-store-app/src/app/admin/configuracion/page.tsx
new file mode 100644
index 0000000..0ff958a
--- /dev/null
+++ b/almeira-store-app/src/app/admin/configuracion/page.tsx
@@ -0,0 +1,352 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Store, Mail, Phone, MessageCircle, Instagram, MapPin, CreditCard, Save, CheckCircle2, DollarSign, Percent, ShieldCheck, QrCode, ExternalLink, Zap } from 'lucide-react';
+import { StoreSettings } from '@/types';
+
+export default function AdminSettingsPage() {
+ const [settings, setSettings] = useState
+
+
+
+
+ {message && (
+
+
+ + Administra las tarifas de envío, tiempos de entrega y configura si el 1er cambio de talla es gratis o si el cliente asume el flete para cada ciudad. +
+
+ {message}
+
+
+ )}
+
+ {/* Add New City Card */}
+
+
+ {/* Cities List */}
+
+
+ Ciudades y Zonas Registradas ({cities.length})
+ +
+ {cities.map((city) => (
+
+
+
+ ))}
+
+
+
+ {/* Actions & Policy Toggle */}
+
+ {city.name}
+ ({city.department})
+ {city.allowsContraentrega ? (
+
+ Contraentrega Activo
+
+ ) : (
+
+ Solo Despacho Nacional
+
+ )}
+
+
+
+ {/* 1st Exchange Free Toggle Button */}
+
+
+ {/* Shipping cost edit */}
+
+
+ Flete:
+ handleUpdateShipping(city.id, parseInt(e.target.value, 10) || 0)}
+ className="w-20 bg-transparent text-xs font-bold text-white outline-hidden text-right"
+ />
+ COP
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/feed-whatsapp/page.tsx b/almeira-store-app/src/app/admin/feed-whatsapp/page.tsx
new file mode 100644
index 0000000..a1866cb
--- /dev/null
+++ b/almeira-store-app/src/app/admin/feed-whatsapp/page.tsx
@@ -0,0 +1,365 @@
+'use client';
+
+import React, { useState } from 'react';
+import { Radio, Sparkles, Share2, AlertTriangle, ShieldCheck, Plus, Send, Layers } from 'lucide-react';
+import { SupplierPost, Product } from '@/types';
+import { INITIAL_SUPPLIER_POSTS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { checkProductDuplicate } from '@/lib/deduplication-engine';
+import { formatCOP } from '@/lib/pricing-engine';
+import { BRANDS, BrandId } from '@/config/brands';
+
+export default function SupplierFeedPage() {
+ const [posts, setPosts] = useState
+
+
+
+
+ {toast && (
+
+
+ + Configura los datos oficiales del negocio: WhatsApp oficial de atención, correo electrónico, pasarela Bold.co (Link de pago, QR y botón), Nequi, Daviplata y reglas de margen. +
+
+ {toast}
+
+
+ )}
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/grupos-whatsapp/page.tsx b/almeira-store-app/src/app/admin/grupos-whatsapp/page.tsx
new file mode 100644
index 0000000..f4a568d
--- /dev/null
+++ b/almeira-store-app/src/app/admin/grupos-whatsapp/page.tsx
@@ -0,0 +1,586 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import {
+ MessageSquare,
+ RefreshCw,
+ Search,
+ CheckCircle2,
+ XCircle,
+ ShieldCheck,
+ Zap,
+ Radio,
+ Sliders,
+ Users,
+ Sparkles,
+ ExternalLink,
+ Plus,
+ ArrowUpRight,
+ Filter,
+ CheckSquare,
+ Square,
+ X
+} from 'lucide-react';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+export default function AdminWhatsAppGroupsPage() {
+ const [groups, setGroups] = useState
+
+
+ {actionMessage && (
+
+
+
+
+
+ {/* Target Brand Selector Pill Bar */}
+
+
+ + Recepción automática con IA, prevención de duplicados y distribución hacia las 4 marcas (Almeira Store, Sneaky, Zapply, DripZone). +
+
+
+
+
+ {actionMessage}
+
+
+ )}
+
+ {/* Live Simulator for Test Messages */}
+
+
+
+ {/* Intercepted Posts Feed */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ setTestText(e.target.value)}
+ className="flex-1 bg-slate-950 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ Mensajes Procesados Recientemente
+ +
+ {posts.map((post) => {
+ const extracted = post.extractedProduct;
+ const duplicateCheck = extracted
+ ? checkProductDuplicate(
+ {
+ name: extracted.name,
+ brand: extracted.brand,
+ sizes: extracted.sizes,
+ supplierPrice: extracted.supplierPrice,
+ },
+ products
+ )
+ : null;
+
+ return (
+
+
+ {/* Header of post */}
+
+ );
+ })}
+
+
+
+ {/* Content Grid */}
+
+
+ {post.channelName || 'Canal Mayorista'}
+
+ {post.receivedAt}
+
+
+ {/* Anti-Duplicate Status Badge */}
+ {duplicateCheck && (
+
+ {duplicateCheck.isDuplicate ? (
+ <>
+
+ )}
+
+ {/* Left: Raw WhatsApp Message (5 cols) */}
+
+
+ Mensaje de Entrada:
+
+
+ {/* Right: AI Extracted & Pricing Calculation (7 cols) */}
+ + {post.rawMessage} +
+ {post.rawImages.length > 0 && ( +
+ 
+
+ )}
+
+ {extracted ? (
+
+
+
+ ) : (
+
+
+
+ {/* Pricing breakdown */}
+
+
+ {extracted.brand} • {extracted.category}
+
+
+
+ IA: {Math.round(extracted.confidence * 100)}% certeza
+
+ {extracted.name}
+
+
+
+ {/* Sizes */}
+
+ Costo Base:
+
+ {formatCOP(extracted.supplierPrice)}
+
+
+
+ Precio Venta (+ Margen):
+
+ {formatCOP(extracted.suggestedRetailPrice)}
+
+
+
+
+ Tallas extraídas:
+
+
+
+ {/* Duplicate warning note */}
+ {duplicateCheck?.isDuplicate && (
+
+ {extracted.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+
+ {duplicateCheck.message}
+
+ )}
+
+ {/* Actions */}
+
+
+
+
+
+ Extrayendo datos...
+ )} +
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/layout.tsx b/almeira-store-app/src/app/admin/layout.tsx
new file mode 100644
index 0000000..ae22bc5
--- /dev/null
+++ b/almeira-store-app/src/app/admin/layout.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import {
+ LayoutDashboard,
+ Radio,
+ Package,
+ MapPin,
+ CreditCard,
+ ShoppingBag,
+ ArrowLeft,
+ Sparkles,
+ Store,
+ Users,
+ MessageSquare,
+} from 'lucide-react';
+
+export default function AdminLayout({ children }: { children: React.ReactNode }) {
+ const pathname = usePathname();
+
+ const NAV_ITEMS = [
+ { href: '/admin', label: 'Resumen & KPIs', icon: LayoutDashboard },
+ { href: '/admin/grupos-whatsapp', label: 'Grupos WhatsApp', icon: MessageSquare, badge: 'Monitoreo 24/7' },
+ { href: '/admin/usuarios', label: 'Control de Usuarios', icon: Users, badge: 'Roles & Accesos' },
+ { href: '/admin/configuracion', label: 'Datos de la Tienda', icon: Store },
+ { href: '/admin/feed-whatsapp', label: 'Feed WhatsApp & IA', icon: Radio, badge: 'Anti-Duplicados' },
+ { href: '/admin/productos', label: 'Catálogo de Zapatillas', icon: Package },
+ { href: '/admin/ciudades', label: 'Ciudades & Fletes', icon: MapPin },
+ { href: '/admin/metodos-pago', label: 'Medios de Pago & Anticipos', icon: CreditCard },
+ { href: '/admin/pedidos', label: 'Pedidos & Logística', icon: ShoppingBag },
+ ];
+
+ return (
+
+
+
+ {/* Toast Notification */}
+ {toast && (
+
+
+
+
+
+ {/* Big Search and Select Button */}
+
+
+
+ + Busca y selecciona los grupos de proveedores que el bot de Evolution API & Gemini debe escuchar 24/7 para auto-publicar zapatillas. +
+
+ {toast}
+
+
+ )}
+
+ {/* Stats Bar */}
+
+
+
+ {/* Filter and Search Toolbar */}
+
+
+
+
+
+ Grupos en tu WhatsApp
+{groups.length}
+
+
+
+
+
+
+
+ Grupos Monitoreados (Activos)
+{monitoredCount}
+
+
+
+
+
+
+ Evolution API (WhatsApp)
++ + AutomataAlmeira (En línea) +
+
+
+
+
+
+ {/* Active Monitored Groups List */}
+
+
+
+
+
+
+
+
+
+ {isLoading ? (
+
+
+ {/* ========================================================= */}
+ {/* MODAL: Group Picker (Buscar y Seleccionar Grupos) */}
+ {/* ========================================================= */}
+ {isPickerOpen && (
+
+
+ ) : filteredGroups.length === 0 ? (
+ Cargando grupos de proveedores...
+
+
+ ) : (
+ filteredGroups.map((group) => {
+ const isMonitored = group.isMonitored;
+
+ return (
+ No tienes grupos seleccionados para monitorear.
+ +
+ {/* Header */}
+
+ );
+ })
+ )}
+
+
+
+ {/* Info Pills */}
+
+
+
+ {/* Toggle Switch */}
+
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+
+
+ {group.notes && (
+
+ Margen Aplicado
+
+ +{group.profitMarginOverride || 35}% (Redondeo a $5.000)
+
+
+
+
+ Modo de Ingreso
+
+
+ + ℹ️ {group.notes} +
+ )} + + {/* Action footer */} +
+
+ {group.participantsCount ? `👥 ${group.participantsCount} miembros` : 'Canal Mayorista'}
+
+
+
+
+
+
+ )}
+
+ {/* Modal Header */}
+
+
+
+
+ {/* Search and Action Toolbar in Modal */}
+
+
+
+
+
+
+
+ Seleccionar Grupos de WhatsApp
++ Marca los grupos que deseas monitorear con IA para auto-publicar calzado. +
+
+
+
+ {/* Groups Scrollable List */}
+
+
+
+
+
+ Mostrando {filteredPickerGroups.length} grupos encontrados
+
+
+
+
+ •
+
+
+
+ {isLoadingLive ? (
+
+
+ {/* Modal Footer */}
+
+
+ ) : filteredPickerGroups.length === 0 ? (
+ Consultando grupos en vivo desde Evolution API...
+Conectando con WhatsApp...
+
+
+ ) : (
+ filteredPickerGroups.map((group) => {
+ const isSelected = selectedJids.has(group.jid);
+
+ return (
+ No se encontraron grupos con el término "{pickerSearch}".
+ handleToggleSelectJid(group.jid)}
+ className={`p-3.5 rounded-2xl border transition-all cursor-pointer flex items-center justify-between gap-3 ${
+ isSelected
+ ? 'bg-cyan-950/30 border-cyan-500/50 shadow-md ring-1 ring-cyan-500/20'
+ : 'bg-slate-950 border-slate-800 hover:border-slate-700'
+ }`}
+ >
+
+ );
+ })
+ )}
+
+
+
+
+ {isSelected &&
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+ {isSelected ? (
+
+ Monitorear
+
+ ) : (
+
+ Ignorar
+
+ )}
+
+
+
+
+ Seleccionados:
+ {selectedJids.size}
+ grupos para monitorear
+
+
+
+
+
+
+
+ {/* Sidebar */}
+
+
+ {/* Main Content Area */}
+
+ {children}
+
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/metodos-pago/page.tsx b/almeira-store-app/src/app/admin/metodos-pago/page.tsx
new file mode 100644
index 0000000..3b61284
--- /dev/null
+++ b/almeira-store-app/src/app/admin/metodos-pago/page.tsx
@@ -0,0 +1,163 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { CreditCard, Zap, Save, Check, ShieldCheck, QrCode } from 'lucide-react';
+import { PaymentMethod } from '@/types';
+import { INITIAL_PAYMENT_METHODS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminPaymentMethodsPage() {
+ const [methods, setMethods] = useState
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/page.tsx b/almeira-store-app/src/app/admin/page.tsx
new file mode 100644
index 0000000..8d400b5
--- /dev/null
+++ b/almeira-store-app/src/app/admin/page.tsx
@@ -0,0 +1,159 @@
+'use client';
+
+import React, { useState } from 'react';
+import Link from 'next/link';
+import { Package, Radio, MapPin, Zap, CheckCircle2, ArrowUpRight, Sparkles } from 'lucide-react';
+import { INITIAL_PRODUCTS, INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_SUPPLIER_POSTS } from '@/lib/data-service';
+
+export default function AdminDashboardPage() {
+ const [productsCount] = useState(INITIAL_PRODUCTS.length);
+ const [postsCount] = useState(INITIAL_SUPPLIER_POSTS.length);
+ const [citiesCount] = useState(INITIAL_CITIES.length);
+
+ return (
+
+
+
+
+
+ {message && (
+
+
+ + Habilita métodos de pago, configura el valor de separación de $10.000 COP y personaliza los datos de Nequi / Daviplata. +
+
+ {message}
+
+
+ )}
+
+ {/* Methods Cards */}
+
+ {methods.map((method) => (
+
+
+
+ ))}
+
+
+
+
+
+
+
+ {method.type === 'contraentrega' ?
+
+
+ {method.name}
+ Tipo: {method.type} +
+
+
+
+
+
+
+
+ handleUpdateField(method.id, 'name', e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ handleUpdateField(method.id, 'description', e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+ {method.requiresDeposit && (
+
+
+ handleUpdateField(method.id, 'depositAmount', parseInt(e.target.value, 10) || 0)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden font-bold"
+ />
+
+ (El saldo restante se cobra contraentrega al recibir)
+
+
+ )}
+
+
+
+ handleUpdateField(method.id, 'accountInfo', e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ placeholder="Ej. Nequi / Daviplata: 316 745 5877"
+ />
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/pedidos/page.tsx b/almeira-store-app/src/app/admin/pedidos/page.tsx
new file mode 100644
index 0000000..82562a2
--- /dev/null
+++ b/almeira-store-app/src/app/admin/pedidos/page.tsx
@@ -0,0 +1,283 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { ShoppingBag, Truck, CheckCircle2, Clock, Phone, MapPin, Search, MessageCircle, Send, ShieldCheck, UserCheck } from 'lucide-react';
+import { Order, OrderItem } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminOrdersPage() {
+ const [orders, setOrders] = useState
+
+
+ {/* KPI Cards */}
+
+
+
+
+
+
+
+ + Automatización inteligente de calzado, publicaciones a Facebook y gestión de despachos. +
+
+
+
+
+
+
+ {/* Quick Actions & Automation Status */}
+
+
+
+
+ Zapatillas Activas
+
+ {productsCount}
+
+
+
+
+
+ Margen Promedio
+
+
+ +$30.000 COP
+
+ + (Costo: $90k ➔ Venta: $120k) +
+
+
+
+
+ Entradas Procesadas
+
+ {postsCount}
+ + IA Gemini + Anti-duplicados +
+
+
+
+ Ciudades Habilitadas
+
+ {citiesCount}
+ + Contraentrega activo en Cali +
+
+ {/* Left: WhatsApp Evolution API Status */}
+
+
+
+
+ {/* Right: Meta / Facebook Automation */}
+
+
+
+
+
+
+
+ Activo
+
+ Estado del Listener de WhatsApp
+
+
+
+
+ Ver últimos mensajes procesados
+
+ Instancia Evolution API:
+ AutomataAlmeira
+
+
+ Servidor:
+ evolution.almeira.com.co
+
+
+ Motor de Inteligencia Artificial:
+ Gemini 2.5 Flash
+
+
+ Filtro Anti-Duplicados:
+ Activo (>75% Similitud)
+
+
+
+
+
+
+ Publicador a Fanpage de Facebook
+ + Listo para Publicar + +
+
+
+
+ Publicar Producto de Prueba en Facebook
+ ✨ Plantilla de Copy Vendedor Integrada:
+
+ "✨ ALMEIRA STORE • NUEVA COLECCIÓN EXCLUSIVA ✨
+ 👟 NIKE DUNK LOW PANDA
+ 📏 Tallas: 37 a 43 | 💎 Precio: $120.000 COP
+ 🚚 ¡Entrega a Domicilio en Cali con Pago Contraentrega!"
+
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/productos/page.tsx b/almeira-store-app/src/app/admin/productos/page.tsx
new file mode 100644
index 0000000..3df1249
--- /dev/null
+++ b/almeira-store-app/src/app/admin/productos/page.tsx
@@ -0,0 +1,472 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Package, Plus, Eye, EyeOff, Check, X, Sparkles, Filter, Phone, MessageCircle, Truck } from 'lucide-react';
+import { Product, Supplier } from '@/types';
+import { INITIAL_PRODUCTS, INITIAL_SUPPLIERS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminProductsPage() {
+ const [products, setProducts] = useState
+
+
+
+
+ {/* Toolbar */}
+
+
+ + Control logístico de pedidos contraentrega, cobro de anticipos de $10.000 COP y notificación inmediata de separación al proveedor vía WhatsApp. +
+
+
+
+ {filteredOrders.length === 0 ? (
+
+
+
+
+
+
+
+
+ setSearch(e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-cyan-400"
+ />
+
+
+
+ ) : (
+
+
+ No hay pedidos en esta sección
++ Cuando los clientes hagan un pedido en la tienda web o por WhatsApp, aparecerán aquí con el botón para separar inmediatamente con el proveedor correspondiente. +
+
+ {filteredOrders.map((order) => (
+
+ )}
+
+ {/* Top Order bar */}
+
+ ))}
+
+
+
+
+ Orden #{order.id}
+ • {new Date(order.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
+
+ {getStatusBadge(order.status)}
+
+ {/* Customer Details */}
+
+
+ {/* Order Status Action Buttons */}
+
+
+ Cliente & Entrega (24 Horas)
+
+
+
+ {/* Items and Supplier Separation Action */}
+ {order.customerName}
+
+
+
+
+ Zapatillas & Proveedor Asignado:
+
+
+
+ {/* Payment Breakdown */}
+
+ {order.items.map((it, idx) => {
+ const suppName = it.supplierName || 'DIFUSION JOVIC STORE';
+ return (
+
+
+
+ );
+ })}
+
+
+
+ {/* 1-Click WhatsApp Separation Button */}
+
+
+
+
+ Prov: {suppName}
+
+ {it.productName}
++ Talla {it.size} • Cant: {it.quantity} +
+
+
+ Cobro & Pagos Contraentrega
+
+
+
+
+ + Total de la Orden: + {formatCOP(order.totalAmount)} +
+ {order.depositAmount > 0 ? ( + <> ++ Anticipo / Separación: + {formatCOP(order.depositAmount)} +
++ Saldo al Mensajero: + {formatCOP(order.balanceDue)} +
+ + ) : ( ++ 100% Contraentrega al recibir +
+ )} +
+ Método: {order.paymentMethodName}
+
+
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/admin/usuarios/page.tsx b/almeira-store-app/src/app/admin/usuarios/page.tsx
new file mode 100644
index 0000000..a90615d
--- /dev/null
+++ b/almeira-store-app/src/app/admin/usuarios/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Users, UserPlus, Shield, ShieldCheck, UserCheck, MessageCircle, Mail, Phone, MapPin, Eye, EyeOff, Trash2, Edit, Check, X } from 'lucide-react';
+import { User } from '@/types';
+
+export default function AdminUsersPage() {
+ const [users, setUsers] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Visualiza cada modelo con su proveedor asignado, costo mayorista y activa/inactiva publicaciones para la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* Filters & Search Toolbar */}
+
+ {/* Status filter pills */}
+
+
+ {/* Products Table */}
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-cyan-400"
+ />
+
+
+
+
+ {/* Modal Add Product */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado Publicación | +Producto | +Proveedor Asignado (Interno) | +Marca | +Costo Base | +Precio Venta | +Margen Ganancia | +Tallas | +
|---|---|---|---|---|---|---|---|
| + No hay zapatillas que coincidan con el filtro seleccionado. + | +|||||||
| + + | + + {/* Product Name & Image */} +
+
+
+ {prod.name} + {prod.category} + |
+
+ {/* Supplier Column */}
+
+
+
+ 🏢 {suppName}
+
+
+
+ |
+
+ {prod.brand} | +{formatCOP(prod.supplierPrice)} | +{formatCOP(prod.retailPrice)} | + ++ + +{formatCOP(margin)} + + | + +
+
+ {prod.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+ |
+
+
+ )}
+
+
+ Registrar Nueva Zapatilla
+ + +
+ {/* Header */}
+
+ );
+}
diff --git a/almeira-store-app/src/app/api/auth/login/route.ts b/almeira-store-app/src/app/api/auth/login/route.ts
new file mode 100644
index 0000000..acc7162
--- /dev/null
+++ b/almeira-store-app/src/app/api/auth/login/route.ts
@@ -0,0 +1,31 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function POST(request: Request) {
+ try {
+ const { identifier } = await request.json(); // email o teléfono
+ if (!identifier) {
+ return NextResponse.json({ success: false, error: 'Ingresa tu correo o celular' }, { status: 400 });
+ }
+ const user = dataService.authenticate(identifier);
+ if (!user) {
+ return NextResponse.json(
+ { success: false, error: 'Usuario no encontrado. Verifica tu correo o celular.' },
+ { status: 404 }
+ );
+ }
+ if (!user.isActive) {
+ return NextResponse.json(
+ { success: false, error: 'Esta cuenta se encuentra inactiva. Contacta a soporte.' },
+ { status: 403 }
+ );
+ }
+
+ // Actualizar lastLogin
+ dataService.updateUser(user.id, { lastLogin: 'Justo ahora' });
+
+ return NextResponse.json({ success: true, user });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/auth/register/route.ts b/almeira-store-app/src/app/api/auth/register/route.ts
new file mode 100644
index 0000000..62b2a63
--- /dev/null
+++ b/almeira-store-app/src/app/api/auth/register/route.ts
@@ -0,0 +1,42 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function POST(request: Request) {
+ try {
+ const { name, email, phone, city, address } = await request.json();
+ if (!name || !email || !phone) {
+ return NextResponse.json(
+ { success: false, error: 'Nombre, correo y celular son obligatorios' },
+ { status: 400 }
+ );
+ }
+
+ const existing = dataService.authenticate(email) || dataService.authenticate(phone);
+ if (existing) {
+ return NextResponse.json(
+ { success: false, error: 'Ya existe una cuenta con este correo o celular' },
+ { status: 409 }
+ );
+ }
+
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name,
+ email,
+ phone,
+ city: city || 'Cali',
+ address: address || '',
+ role: 'customer',
+ isActive: true,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ lastLogin: 'Justo ahora',
+ };
+
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/cities/route.ts b/almeira-store-app/src/app/api/cities/route.ts
new file mode 100644
index 0000000..3ecd601
--- /dev/null
+++ b/almeira-store-app/src/app/api/cities/route.ts
@@ -0,0 +1,27 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const cities = dataService.getCities();
+ return NextResponse.json({ success: true, cities });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateCity(id, updates);
+ return NextResponse.json({ success: true, city: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const created = dataService.addCity(body);
+ return NextResponse.json({ success: true, city: created });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/orders/route.ts b/almeira-store-app/src/app/api/orders/route.ts
new file mode 100644
index 0000000..9c996b6
--- /dev/null
+++ b/almeira-store-app/src/app/api/orders/route.ts
@@ -0,0 +1,30 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { sendWhatsAppMessage, buildOrderConfirmationMessage } from '@/lib/evolution-api';
+
+export async function GET() {
+ const orders = dataService.getOrders();
+ return NextResponse.json({ success: true, orders });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newOrder = dataService.createOrder(body);
+
+ // Enviar confirmación por WhatsApp en background si tiene teléfono válido
+ if (newOrder.customerPhone) {
+ try {
+ const msg = buildOrderConfirmationMessage(newOrder);
+ // Intentar enviar WhatsApp
+ await sendWhatsAppMessage(newOrder.customerPhone, msg);
+ } catch (waErr) {
+ console.warn('No se pudo enviar WhatsApp automático:', waErr);
+ }
+ }
+
+ return NextResponse.json({ success: true, order: newOrder });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/payment-methods/route.ts b/almeira-store-app/src/app/api/payment-methods/route.ts
new file mode 100644
index 0000000..b49c62d
--- /dev/null
+++ b/almeira-store-app/src/app/api/payment-methods/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const methods = dataService.getPaymentMethods();
+ return NextResponse.json({ success: true, paymentMethods: methods });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updatePaymentMethod(id, updates);
+ return NextResponse.json({ success: true, paymentMethod: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/products/route.ts b/almeira-store-app/src/app/api/products/route.ts
new file mode 100644
index 0000000..98e5b1e
--- /dev/null
+++ b/almeira-store-app/src/app/api/products/route.ts
@@ -0,0 +1,47 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET(request: Request) {
+ const { searchParams } = new URL(request.url);
+ const includeAll = searchParams.get('all') === 'true';
+
+ let products = dataService.getProducts();
+ if (!includeAll) {
+ // Para la tienda pública, solo mostrar productos activos (isActive !== false)
+ products = products.filter((p) => p.isActive !== false);
+ }
+
+ return NextResponse.json({ success: true, products });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newProduct = dataService.addProduct({
+ ...body,
+ isActive: body.isActive !== undefined ? body.isActive : true,
+ });
+ return NextResponse.json({ success: true, product: newProduct });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const { id, updates } = body;
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID de producto requerido' }, { status: 400 });
+ }
+
+ const updated = dataService.updateProduct(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Producto no encontrado' }, { status: 404 });
+ }
+
+ return NextResponse.json({ success: true, product: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/publish/facebook/route.ts b/almeira-store-app/src/app/api/publish/facebook/route.ts
new file mode 100644
index 0000000..d2db7a3
--- /dev/null
+++ b/almeira-store-app/src/app/api/publish/facebook/route.ts
@@ -0,0 +1,12 @@
+import { NextResponse } from 'next/server';
+import { publishToFacebookPage } from '@/lib/facebook-publisher';
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const result = await publishToFacebookPage(body);
+ return NextResponse.json(result);
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/settings/route.ts b/almeira-store-app/src/app/api/settings/route.ts
new file mode 100644
index 0000000..6073d91
--- /dev/null
+++ b/almeira-store-app/src/app/api/settings/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const settings = dataService.getSettings();
+ return NextResponse.json({ success: true, settings });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const updated = dataService.updateSettings(body);
+ return NextResponse.json({ success: true, settings: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/users/route.ts b/almeira-store-app/src/app/api/users/route.ts
new file mode 100644
index 0000000..8b62fad
--- /dev/null
+++ b/almeira-store-app/src/app/api/users/route.ts
@@ -0,0 +1,57 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function GET() {
+ const users = dataService.getUsers();
+ return NextResponse.json({ success: true, users });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name: body.name,
+ email: body.email,
+ phone: body.phone,
+ city: body.city || 'Cali',
+ address: body.address || '',
+ role: body.role || 'customer',
+ isActive: body.isActive !== false,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ };
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateUser(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Usuario no encontrado' }, { status: 404 });
+ }
+ return NextResponse.json({ success: true, user: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function DELETE(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const id = searchParams.get('id');
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID requerido' }, { status: 400 });
+ }
+ const deleted = dataService.deleteUser(id);
+ return NextResponse.json({ success: deleted });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/webhook/whatsapp/route.ts b/almeira-store-app/src/app/api/webhook/whatsapp/route.ts
new file mode 100644
index 0000000..ae1555b
--- /dev/null
+++ b/almeira-store-app/src/app/api/webhook/whatsapp/route.ts
@@ -0,0 +1,163 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { parseSupplierMessage } from '@/lib/gemini-parser';
+import { SupplierPost, Product } from '@/types';
+import { calculateRetailPrice } from '@/lib/pricing-engine';
+
+export async function GET() {
+ const posts = dataService.getSupplierPosts();
+ const settings = dataService.getSettings();
+ return NextResponse.json({
+ success: true,
+ autoPublishEnabled: settings.autoPublishSupplierPosts ?? true,
+ postsCount: posts.length,
+ posts,
+ });
+}
+
+export async function POST(request: Request) {
+ try {
+ const payload = await request.json();
+ console.log('📥 [WhatsApp Webhook] Mensaje recibido:', JSON.stringify(payload).slice(0, 300));
+
+ const data = payload.data || payload;
+ const settings = dataService.getSettings();
+
+ // 1. Extraer texto del mensaje de WhatsApp
+ const messageContent =
+ data.message?.conversation ||
+ data.message?.extendedTextMessage?.text ||
+ data.message?.imageMessage?.caption ||
+ data.text ||
+ '';
+
+ // 2. Extraer nombre del canal o grupo
+ const senderPhone = data.key?.remoteJid?.replace(/\D/g, '') || '';
+ const isGroup = data.key?.remoteJid?.includes('g.us');
+ const channelName =
+ data.groupInfo?.subject ||
+ data.pushName ||
+ (isGroup ? 'Grupo Mayorista WhatsApp' : 'Chat Proveedor Directo');
+
+ if (!messageContent || messageContent.trim().length < 6) {
+ return NextResponse.json({
+ success: true,
+ ignored: 'Mensaje sin texto suficiente para extraer calzado.',
+ });
+ }
+
+ // 3. Buscar proveedor asociado por teléfono o grupo
+ const suppliers = dataService.getSuppliers();
+ const matchedSupplier = suppliers.find(
+ (s) =>
+ s.phone.includes(senderPhone) ||
+ (channelName && s.name.toLowerCase().includes(channelName.toLowerCase())) ||
+ (channelName && channelName.toLowerCase().includes(s.name.toLowerCase()))
+ );
+
+ const supplierName = matchedSupplier?.name || channelName;
+ const supplierPhone = matchedSupplier?.phone || senderPhone || '573167455877';
+
+ // 4. Procesar y extraer información con Gemini AI
+ const extracted = await parseSupplierMessage(messageContent);
+
+ // Recalcular precio con el margen y redondeo al $5.000 oficial
+ const finalRetailPrice = calculateRetailPrice(
+ extracted.supplierPrice,
+ settings.defaultProfitMargin || 35
+ );
+
+ // Extraer imágenes (si Evolution API envió imagen adjunta o usar fotos de alta resolución)
+ const images: string[] = [];
+ if (data.message?.imageMessage?.url) {
+ images.push(data.message.imageMessage.url);
+ } else {
+ images.push(
+ 'https://images.unsplash.com/photo-1595950653106-6c9ebd614d3a?auto=format&fit=crop&w=800&q=80'
+ );
+ }
+
+ // 5. Verificar Anti-Duplicados en el Catálogo
+ const existingProducts = dataService.getProducts();
+ const duplicateProduct = existingProducts.find(
+ (p) => p.name.toLowerCase() === extracted.name.toLowerCase()
+ );
+
+ let registeredProduct: Product | null = null;
+ const autoPublish = settings.autoPublishSupplierPosts ?? true;
+
+ if (autoPublish) {
+ if (duplicateProduct) {
+ // Actualizar stock y tallas existentes sin duplicar
+ const mergedSizes = Array.from(new Set([...duplicateProduct.sizes, ...extracted.sizes]));
+ registeredProduct = dataService.updateProduct(duplicateProduct.id, {
+ supplierPrice: extracted.supplierPrice,
+ retailPrice: finalRetailPrice,
+ sizes: mergedSizes,
+ inStock: true,
+ isActive: true,
+ supplierName,
+ supplierPhone,
+ });
+ console.log(`🔄 [Auto-Sync] Zapatilla "${extracted.name}" actualizada en catálogo (Anti-Duplicados).`);
+ } else {
+ // Registrar y publicar automáticamente
+ registeredProduct = dataService.addProduct({
+ name: extracted.name,
+ brand: extracted.brand,
+ supplierPrice: extracted.supplierPrice,
+ retailPrice: finalRetailPrice,
+ originalPrice: Math.round(finalRetailPrice * 1.35),
+ sizes: extracted.sizes,
+ images,
+ description: `Zapatillas ${extracted.brand} ${extracted.name} garantizadas. Calidad seleccionada con horma nacional y suela antideslizante.`,
+ category: extracted.category || 'Sneakers / Urbano',
+ inStock: true,
+ isActive: true,
+ isFlashDeal: true,
+ rating: 4.9,
+ reviewsCount: 15,
+ salesCount: 30,
+ originBadge: 'Bodega Mayorista',
+ supplierId: matchedSupplier?.id || 'sup-auto',
+ supplierName,
+ supplierPhone,
+ });
+ console.log(`✨ [Auto-Publish] Nueva zapatilla "${extracted.name}" publicada automáticamente en tienda.`);
+ }
+ }
+
+ // 6. Registrar en el historial de publicaciones recibidas
+ const newPost: SupplierPost = {
+ id: `post-${Date.now()}`,
+ channelName,
+ supplierName,
+ supplierPhone,
+ rawMessage: messageContent,
+ rawImages: images,
+ extractedProduct: {
+ ...extracted,
+ suggestedRetailPrice: finalRetailPrice,
+ supplierName,
+ supplierPhone,
+ },
+ status: autoPublish ? 'published_store' : 'pending_review',
+ receivedAt: 'Justo ahora',
+ };
+
+ dataService.addSupplierPost(newPost);
+
+ return NextResponse.json({
+ success: true,
+ autoPublished: autoPublish,
+ product: registeredProduct,
+ post: newPost,
+ message: autoPublish
+ ? `🔥 ¡Zapatilla "${extracted.name}" procesada y publicada AUTOMÁTICAMENTE en la tienda!`
+ : `Mensaje ingresado al feed para aprobación manual.`,
+ });
+ } catch (error: any) {
+ console.error('Error procesando webhook de WhatsApp:', error);
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/almeira-store-app/src/app/api/whatsapp-groups/route.ts b/almeira-store-app/src/app/api/whatsapp-groups/route.ts
new file mode 100644
index 0000000..6f78a1c
--- /dev/null
+++ b/almeira-store-app/src/app/api/whatsapp-groups/route.ts
@@ -0,0 +1,104 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+const EVOLUTION_API_URL = process.env.EVOLUTION_API_URL || 'https://evolution.almeira.com.co';
+const EVOLUTION_API_KEY = process.env.EVOLUTION_API_KEY || 'EE49029EEB85-4568-8F81-C9FDFC6E2943';
+const EVOLUTION_INSTANCE_NAME = process.env.EVOLUTION_INSTANCE_NAME || 'AutomataAlmeira';
+
+export async function GET(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const fetchLive = searchParams.get('fetchLive') === 'true';
+
+ const localGroups = dataService.getMonitoredGroups();
+
+ if (!fetchLive) {
+ return NextResponse.json({
+ success: true,
+ groups: localGroups,
+ });
+ }
+
+ // Consultar grupos en vivo desde Evolution API
+ try {
+ const response = await fetch(
+ `${EVOLUTION_API_URL}/group/fetchAllGroups/${EVOLUTION_INSTANCE_NAME}?getParticipants=false`,
+ {
+ headers: {
+ apikey: EVOLUTION_API_KEY,
+ 'Content-Type': 'application/json',
+ },
+ }
+ );
+
+ const liveGroups = await response.json();
+
+ if (Array.isArray(liveGroups)) {
+ const merged: MonitoredWhatsAppGroup[] = liveGroups.map((lg: any) => {
+ const jid = lg.id || lg.jid;
+ const name = lg.subject || lg.name || 'Grupo Sin Nombre';
+ const existing = localGroups.find((g) => g.jid === jid || g.name.toLowerCase() === name.toLowerCase());
+
+ return {
+ id: existing?.id || `grp-${jid.replace(/\D/g, '').slice(-6)}`,
+ jid,
+ name,
+ isMonitored: existing ? existing.isMonitored : false,
+ supplierId: existing?.supplierId,
+ supplierName: existing?.supplierName || name,
+ profitMarginOverride: existing?.profitMarginOverride || 35,
+ autoPublish: existing?.autoPublish ?? true,
+ participantsCount: lg.size || (lg.participants ? lg.participants.length : undefined),
+ notes: existing?.notes || '',
+ };
+ });
+
+ // Asegurar que los locales que no vinieron en live sigan presentes
+ localGroups.forEach((lg) => {
+ if (!merged.some((m) => m.jid === lg.jid || m.id === lg.id)) {
+ merged.unshift(lg);
+ }
+ });
+
+ return NextResponse.json({
+ success: true,
+ isLive: true,
+ totalLive: liveGroups.length,
+ groups: merged,
+ });
+ }
+ } catch (err: any) {
+ console.warn('No se pudo conectar con Evolution API en vivo:', err.message);
+ }
+
+ return NextResponse.json({
+ success: true,
+ isLive: false,
+ groups: localGroups,
+ });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+
+ if (body.action === 'toggle') {
+ const { idOrJid, isMonitored } = body;
+ const updated = dataService.toggleGroupMonitoring(idOrJid, isMonitored);
+ return NextResponse.json({ success: true, group: updated });
+ }
+
+ if (Array.isArray(body.groups)) {
+ const saved = dataService.saveMonitoredGroups(body.groups);
+ return NextResponse.json({ success: true, groups: saved });
+ }
+
+ return NextResponse.json({ success: false, error: 'Datos no válidos' }, { status: 400 });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/almeira-store-app/src/app/checkout/page.tsx b/almeira-store-app/src/app/checkout/page.tsx
new file mode 100644
index 0000000..241fd16
--- /dev/null
+++ b/almeira-store-app/src/app/checkout/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { ArrowLeft, CheckCircle2, ShieldCheck, Truck, Zap, QrCode, Phone, MapPin, User, MessageCircle, ExternalLink, CreditCard } from 'lucide-react';
+import { City, PaymentMethod, Order, StoreSettings } from '@/types';
+import { INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+import confetti from 'canvas-confetti';
+
+export default function CheckoutPage() {
+ const { currentBrand } = useBrand();
+
+ const [customerName, setCustomerName] = useState('');
+ const [customerPhone, setCustomerPhone] = useState('');
+ const [address, setAddress] = useState('');
+ const [neighborhood, setNeighborhood] = useState('');
+ const [notes, setNotes] = useState('');
+
+ const [cities, setCities] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Administra los accesos de administradores, operadores de logística y clientes registrados de la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* KPI Stats Cards */}
+
+
+
+ {/* Filters Toolbar */}
+
+
+
+
+
+
+
+ Administradores
+{adminsCount}
+
+
+
+
+
+
+
+ Operadores Logísticos
+{operatorsCount}
+
+
+
+
+
+
+ Clientes Registrados
+{customersCount}
+
+ {/* Role Pills */}
+
+
+ {/* Users Table */}
+
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-cyan-400"
+ />
+
+
+
+
+ {/* Modal Create User */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado | +Usuario | +Contacto Directo | +Ciudad / Dirección | +Rol & Permisos | +Último Acceso | +Acciones | +
|---|---|---|---|---|---|---|
| + No se encontraron usuarios con el filtro seleccionado. + | +||||||
| + + | + + {/* User Avatar & Name */} +
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+ {user.name} + {user.email} + |
+
+ {/* Contact */}
+
+
+
+
+ |
+
+ {/* City */}
+
+
+ {user.city || 'Cali'}
+ {user.address &&
+ {user.address} } + |
+
+ {/* Role Dropdown */}
+ + + | + + {/* Last Login */} ++ {user.lastLogin || user.createdAt} + | + + {/* Actions */} ++ + | +
+
+ )}
+
+
+ Registrar Nuevo Usuario / Operador
+ + +
+
+ );
+ }
+
+ return (
+
+
+
+
+
+
+
+ ¡Pedido Registrado con Éxito!
+
+
+
+ {/* Bold.co or Nequi Separation Box */}
+ {orderCompleted.depositAmount > 0 ? (
+ Orden #{orderCompleted.id}
++ Hemos recibido tu solicitud para entrega en {orderCompleted.cityName} con {currentBrand.name}. +
+
+
+ ) : (
+
+
+ + Paga de inmediato con Link de Pago Bold.co (PSE / Tarjeta / Nequi) o transfiere a nuestra cuenta oficial: +
+ + {boldLink && ( + +
+ 📱 Nequi / Daviplata: {storeSettings?.nequiAccount || '316 745 5877'} ({storeSettings?.accountHolder || 'Carlos Andrés Lasso'})
+
+ + 🤝 Cancelas el saldo de {formatCOP(orderCompleted.balanceDue)} al recibir el paquete en tu casa. +
+
+
+ )}
+
+ + Tu pedido quedó programado para entrega contraentrega en 24 horas. ¡Nos pondremos en contacto contigo por WhatsApp! +
+
+
+
+
+ Volver a la Tienda
+
+
+
+
+ );
+}
diff --git a/almeira-store-app/src/app/favicon.ico b/almeira-store-app/src/app/favicon.ico
new file mode 100644
index 0000000..718d6fe
Binary files /dev/null and b/almeira-store-app/src/app/favicon.ico differ
diff --git a/almeira-store-app/src/app/globals.css b/almeira-store-app/src/app/globals.css
new file mode 100644
index 0000000..a2dc41e
--- /dev/null
+++ b/almeira-store-app/src/app/globals.css
@@ -0,0 +1,26 @@
+@import "tailwindcss";
+
+:root {
+ --background: #ffffff;
+ --foreground: #171717;
+}
+
+@theme inline {
+ --color-background: var(--background);
+ --color-foreground: var(--foreground);
+ --font-sans: var(--font-geist-sans);
+ --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ --background: #0a0a0a;
+ --foreground: #ededed;
+ }
+}
+
+body {
+ background: var(--background);
+ color: var(--foreground);
+ font-family: Arial, Helvetica, sans-serif;
+}
diff --git a/almeira-store-app/src/app/layout.tsx b/almeira-store-app/src/app/layout.tsx
new file mode 100644
index 0000000..badf73c
--- /dev/null
+++ b/almeira-store-app/src/app/layout.tsx
@@ -0,0 +1,61 @@
+import type { Metadata, Viewport } from 'next';
+import { Geist, Geist_Mono } from 'next/font/google';
+import './globals.css';
+import { BrandProvider } from '@/context/BrandContext';
+import { AuthProvider } from '@/context/AuthContext';
+
+const geistSans = Geist({
+ variable: '--font-geist-sans',
+ subsets: ['latin'],
+});
+
+const geistMono = Geist_Mono({
+ variable: '--font-geist-mono',
+ subsets: ['latin'],
+});
+
+export const viewport: Viewport = {
+ themeColor: '#06b6d4',
+ width: 'device-width',
+ initialScale: 1,
+ maximumScale: 1,
+ userScalable: false,
+ viewportFit: 'cover',
+};
+
+export const metadata: Metadata = {
+ title: 'Almeira Store • Sneakers & Moda Urbana',
+ description: 'Tienda oficial de calzado y zapatillas con entregas contraentrega en 24 horas.',
+ manifest: '/manifest.json',
+ appleWebApp: {
+ capable: true,
+ statusBarStyle: 'black-translucent',
+ title: 'Almeira Store',
+ },
+ icons: {
+ icon: '/icon.svg',
+ apple: '/icon.svg',
+ },
+};
+
+export default function RootLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+
+
+
+
+
+
+
+ {/* Header */}
+
+
+
+
+
+
+
+
+
+ {/* Navigation Header */}
+ setIsCartOpen(true)}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => setIsCityModalOpen(true)}
+ searchQuery={searchQuery}
+ onSearchChange={setSearchQuery}
+ />
+
+ {/* Main Container */}
+
+ {/* Flash Deals Hero Banner */}
+
+
+ {/* Footer */}
+
+
+ {/* Modals & Drawers */}
+ setSelectedProduct(null)}
+ onAddToCart={handleAddToCart}
+ selectedCity={selectedCity}
+ />
+
+ setIsCartOpen(false)}
+ cartItems={cartItems}
+ onRemoveItem={handleRemoveFromCart}
+ onUpdateQuantity={handleUpdateQuantity}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => {
+ setIsCartOpen(false);
+ setIsCityModalOpen(true);
+ }}
+ />
+
+ setIsCityModalOpen(false)}
+ cities={cities}
+ selectedCity={selectedCity}
+ onSelectCity={setSelectedCity}
+ />
+
+ {/* Mobile App Dock & Install Banner */}
+ setIsCartOpen(true)}
+ onOpenInstallModal={() => setIsInstallModalOpen(true)}
+ />
+
+ setIsInstallModalOpen(false)}
+ />
+
+ {/* User Auth Modal */}
+
+ );
+}
diff --git a/almeira-store-app/src/components/auth/AuthModal.tsx b/almeira-store-app/src/components/auth/AuthModal.tsx
new file mode 100644
index 0000000..8a39a9f
--- /dev/null
+++ b/almeira-store-app/src/components/auth/AuthModal.tsx
@@ -0,0 +1,255 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, User, Lock, Mail, Phone, MapPin, Sparkles, LogIn, UserPlus, Shield, LogOut } from 'lucide-react';
+import { useAuth } from '@/context/AuthContext';
+import { useBrand } from '@/context/BrandContext';
+import Link from 'next/link';
+
+export const AuthModal: React.FC = () => {
+ const { user, login, register, logout, isAuthModalOpen, closeAuthModal } = useAuth();
+ const { currentBrand } = useBrand();
+
+ const [mode, setMode] = useState<'login' | 'register'>('login');
+ const [identifier, setIdentifier] = useState('');
+ const [name, setName] = useState('');
+ const [email, setEmail] = useState('');
+ const [phone, setPhone] = useState('');
+ const [city, setCity] = useState('Cali');
+ const [address, setAddress] = useState('');
+ const [error, setError] = useState
+
+
+ {/* Category & Brand Filters */}
+
+
+
+
+
+
+
+ Entrega en 24 Horas
+Directo en Cali
+
+
+
+
+
+
+
+ Pago Contraentrega
+Cancelas al recibir
+
+
+
+
+
+
+
+ Separa con $10.000
+Aparta tu talla
+
+
+
+
+
+
+ Garantía Total
+Cambio asegurado
+
+
+
+ {/* Product Grid */}
+ {filteredProducts.length === 0 ? (
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+ ) : (
+
+
+ No encontramos zapatillas con ese criterio
+Intenta buscar otra marca o restablecer los filtros.
+ +
+ {filteredProducts.map((product) => (
+ handleAddToCart(p, size)}
+ />
+ ))}
+
+ )}
+
+
+ );
+};
diff --git a/almeira-store-app/src/components/mobile/MobileBottomDock.tsx b/almeira-store-app/src/components/mobile/MobileBottomDock.tsx
new file mode 100644
index 0000000..ce0db6c
--- /dev/null
+++ b/almeira-store-app/src/components/mobile/MobileBottomDock.tsx
@@ -0,0 +1,104 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { Home, Search, ShoppingBag, MessageCircle, Download, Check } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileBottomDockProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ onOpenSearch?: () => void;
+ onOpenInstallModal: () => void;
+}
+
+export const MobileBottomDock: React.FC
+
+
+ {/* If user is already logged in: View Profile */}
+ {user ? (
+
+
+
+ ) : (
+ /* Login or Register */
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+
+ {user.name}
+{user.email}
+
+
+ {user.role === 'admin' ? '👑 Administrador' : user.role === 'operator' ? '📦 Operador Logística' : '🛍️ Cliente Registrado'}
+
+
+
+
+
+ {user.role === 'admin' || user.role === 'operator' ? (
+
+ 📱 Celular: {user.phone}
+📍 Ciudad: {user.city || 'Cali'}
+ {user.address &&🏠 Dirección: {user.address}
} +
+
+ )}
+
+
+
+ {/* Mode Switch Tabs */}
+
+ {currentBrand.shortName[0]}
+
+
+
+ + {mode === 'login' ? 'Iniciar Sesión' : 'Crear Cuenta'} +
++ {mode === 'login' + ? 'Accede para gestionar pedidos o entrar como admin' + : 'Regístrate para compras rápidas y seguimiento'} +
+
+
+
+
+
+ {error && (
+
+ {error}
+
+ )}
+
+ {mode === 'login' ? (
+
+ ) : (
+
+ )}
+
+
+ );
+};
diff --git a/almeira-store-app/src/components/mobile/MobileInstallBanner.tsx b/almeira-store-app/src/components/mobile/MobileInstallBanner.tsx
new file mode 100644
index 0000000..f6e1fdd
--- /dev/null
+++ b/almeira-store-app/src/components/mobile/MobileInstallBanner.tsx
@@ -0,0 +1,130 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Download, Sparkles, X, Smartphone, CheckCircle, Share2, PlusSquare } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileInstallBannerProps {
+ isOpen: boolean;
+ onClose: () => void;
+}
+
+export const MobileInstallBanner: React.FC
+ {/* 1. Inicio */}
+ setActiveTab('home')}
+ className={`flex flex-col items-center gap-0.5 cursor-pointer transition-all ${
+ activeTab === 'home' ? 'text-white' : 'text-slate-400 hover:text-slate-200'
+ }`}
+ >
+
+
+
+ );
+};
diff --git a/almeira-store-app/src/components/store/CartDrawer.tsx b/almeira-store-app/src/components/store/CartDrawer.tsx
new file mode 100644
index 0000000..bca5a6d
--- /dev/null
+++ b/almeira-store-app/src/components/store/CartDrawer.tsx
@@ -0,0 +1,254 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { X, Trash2, ShoppingBag, ArrowRight, Zap, Truck, MessageCircle } from 'lucide-react';
+import { CartItem, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface CartDrawerProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cartItems: CartItem[];
+ onRemoveItem: (productId: string, size: string) => void;
+ onUpdateQuantity: (productId: string, size: string, delta: number) => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+}
+
+export const CartDrawer: React.FC
+
+
+
+
+
+
+ {/* Benefits list */}
+
+ {currentBrand.shortName[0]}
+
+
+
+ Instalar {currentBrand.name}
+Aplicación Móvil para Android & iPhone
+
+
+
+ {/* Action / Platform Instructions */}
+ {isIOS ? (
+
+
+
+
+
+
+
+
+ ) : deferredPrompt ? (
+
+ ) : (
+
+
-
+
- Toca el botón Compartir
abajo en Safari.
+ - Desliza hacia abajo y selecciona "Agregar a Inicio
".
+ - ¡Listo! El icono de {currentBrand.shortName} aparecerá en tu teléfono. +
+
+ )}
+
+
+
+ Para instalar en tu navegador:
++ Abre el menú de opciones del navegador (los 3 puntos arriba a la derecha) y toca "Instalar aplicación" o "Agregar a pantalla principal". +
+
+ {/* Backdrop */}
+
+
+
+ );
+};
diff --git a/almeira-store-app/src/components/store/CategoryPills.tsx b/almeira-store-app/src/components/store/CategoryPills.tsx
new file mode 100644
index 0000000..be49b4b
--- /dev/null
+++ b/almeira-store-app/src/components/store/CategoryPills.tsx
@@ -0,0 +1,48 @@
+'use client';
+
+import React from 'react';
+import { useBrand } from '@/context/BrandContext';
+
+interface CategoryPillsProps {
+ activeCategory: string;
+ onSelectCategory: (category: string) => void;
+}
+
+const CATEGORIES = [
+ { id: 'all', label: '🔥 Todas las Zapatillas' },
+ { id: 'Nike', label: '👟 Nike' },
+ { id: 'Jordan', label: '🏀 Air Jordan' },
+ { id: 'Adidas', label: '🛹 Adidas' },
+ { id: 'New Balance', label: '🌿 New Balance' },
+ { id: 'Puma', label: '🐆 Puma' },
+ { id: 'flash', label: '⚡ Ofertas Flash' },
+ { id: 'under120', label: '💰 Menos de $120k' },
+];
+
+export const CategoryPills: React.FC
+
+
+ {/* Header */}
+
+
+
+
+ {/* Items List */}
+
+
+
+
+
+
+
+ Tu Carrito • {currentBrand.shortName}
+{cartItems.length} {cartItems.length === 1 ? 'artículo' : 'artículos'}
+
+ {cartItems.length === 0 ? (
+
+
+ {/* Footer & Checkout Breakdown */}
+ {cartItems.length > 0 && (
+
+
+ ) : (
+ cartItems.map((item, idx) => (
+
+
+ Tu carrito está vacío
++ Aprovecha las ofertas de calzado con pago contraentrega en Cali y despachos nacionales. +
+ +
+ 
+
+ ))
+ )}
+
+
+
+
+
+
+
+ + {item.product.name} +
+ +
+
+ Talla {item.selectedSize}
+
+
+ {item.product.brand}
+
+
+
+
+ {formatCOP(item.product.retailPrice * item.quantity)}
+
+
+
+
+ {item.quantity}
+
+
+
+ {/* City Delivery selector pill */}
+
+ )}
+
+
+
+ {/* Price Calculations */}
+
+
+
+
+
+
+ {/* Separation Highlight Banner */}
+
+ Subtotal:
+ {formatCOP(subtotal)}
+
+
+ Costo de Envío:
+
+ {shippingCost === 0 ? Gratis : formatCOP(shippingCost)}
+
+
+
+ Total de la Orden:
+
+ {formatCOP(totalAmount)}
+
+
+
+
+
+ {/* Action Buttons */}
+
+
+ Separas con {formatCOP(separation.depositAmount)} y pagas {formatCOP(separation.balanceDue)} al recibir contraentrega en tu casa. +
++ 🛡️ {selectedCity.firstExchangeFree + ? `1er Cambio de Talla 100% GRATIS en ${selectedCity.name}` + : `Garantía de cambio en ${selectedCity.name} (flete asumido por cliente)`} +
+
+
+ Proceder al Pago Contraentrega
+
+
+ {CATEGORIES.map((cat) => {
+ const isActive = activeCategory === cat.id;
+ return (
+
+ );
+ })}
+
+ );
+};
diff --git a/almeira-store-app/src/components/store/CitySelectorModal.tsx b/almeira-store-app/src/components/store/CitySelectorModal.tsx
new file mode 100644
index 0000000..1ff580b
--- /dev/null
+++ b/almeira-store-app/src/components/store/CitySelectorModal.tsx
@@ -0,0 +1,109 @@
+'use client';
+
+import React from 'react';
+import { X, MapPin, Check, Truck } from 'lucide-react';
+import { City } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+interface CitySelectorModalProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cities: City[];
+ selectedCity: City;
+ onSelectCity: (city: City) => void;
+}
+
+export const CitySelectorModal: React.FC
+
+ );
+};
diff --git a/almeira-store-app/src/components/store/FlashDealsBanner.tsx b/almeira-store-app/src/components/store/FlashDealsBanner.tsx
new file mode 100644
index 0000000..e26b007
--- /dev/null
+++ b/almeira-store-app/src/components/store/FlashDealsBanner.tsx
@@ -0,0 +1,83 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Zap, Clock, Gift } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+export const FlashDealsBanner: React.FC = () => {
+ const { currentBrand } = useBrand();
+ const [timeLeft, setTimeLeft] = useState({ hours: 4, minutes: 27, seconds: 15 });
+
+ useEffect(() => {
+ const timer = setInterval(() => {
+ setTimeLeft((prev) => {
+ if (prev.seconds > 0) {
+ return { ...prev, seconds: prev.seconds - 1 };
+ } else if (prev.minutes > 0) {
+ return { ...prev, minutes: 59, seconds: 59 };
+ } else if (prev.hours > 0) {
+ return { hours: prev.hours - 1, minutes: 59, seconds: 59 };
+ }
+ return { hours: 5, minutes: 59, seconds: 59 };
+ });
+ }, 1000);
+ return () => clearInterval(timer);
+ }, []);
+
+ const pad = (n: number) => n.toString().padStart(2, '0');
+
+ return (
+
+ {/* Header */}
+
+
+
+
+ {/* City list */}
+
+
+
+
+
+
+
+ Selecciona tu Ciudad
+Calculamos tiempos y tarifas oficiales
+
+ {cities
+ .filter((c) => c.isActive !== false)
+ .map((city) => {
+ const isSelected = selectedCity.id === city.id;
+ const hasCod = city.allowsContraentrega || city.allowCod;
+
+ return (
+
+
+ {/* Info footer */}
+ {
+ onSelectCity(city);
+ onClose();
+ }}
+ className={`p-3 rounded-2xl border transition-all cursor-pointer flex items-center justify-between ${
+ isSelected
+ ? 'border-cyan-400 bg-cyan-950/50 shadow-[0_0_15px_rgba(6,182,212,0.2)]'
+ : 'border-slate-800 hover:border-slate-700 bg-slate-950'
+ }`}
+ >
+
+ );
+ })}
+
+
+
+
+ {city.name}
+ {hasCod && (
+
+ Contraentrega
+
+ )}
+
+
+
+
+ {city.shippingCost === 0 ? (
+ Gratis
+ ) : (
+ formatCOP(city.shippingCost)
+ )}
+
+ {isSelected && (
+
+
+
+ )}
+
+ 💡 En Cali y zona metropolitana: entregas el mismo día con mensajería directa y pago contraentrega.
+
+
+ {/* Background glow meshes */}
+
+
+
+
+ );
+};
diff --git a/almeira-store-app/src/components/store/Navbar.tsx b/almeira-store-app/src/components/store/Navbar.tsx
new file mode 100644
index 0000000..4412286
--- /dev/null
+++ b/almeira-store-app/src/components/store/Navbar.tsx
@@ -0,0 +1,153 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { ShoppingBag, Search, MapPin, Zap, Sparkles, ShieldCheck, Store, User as UserIcon } from 'lucide-react';
+import { City } from '@/types';
+import { useBrand } from '@/context/BrandContext';
+import { useAuth } from '@/context/AuthContext';
+
+interface NavbarProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+ searchQuery: string;
+ onSearchChange: (q: string) => void;
+}
+
+export const Navbar: React.FC
+ {/* Left text */}
+
+
+
+
+ {/* Right Countdown Box */}
+
+
+ + Zapatillas Premium hasta con{' '} + + 35% OFF + +
++ Lanzamientos exclusivos directos de bodega. Separa tu par con $10.000 COP y paga el saldo en efectivo o transferencia con Pago Contraentrega en tu casa. +
+
+
+
+
+
+
+
+ {pad(timeLeft.hours)}
+ Horas
+
+ :
+
+ {pad(timeLeft.minutes)}
+ Min
+
+ :
+
+ {pad(timeLeft.seconds)}
+ Seg
+
+
+
+
+
+
+ {/* Main Navbar */}
+
+
+
+
+
+
+
+
+ {/* Brand Logo */}
+
+
+
+
+
+
+ {currentBrand.logo.iconText}
+
+
+
+
+
+
+ {/* City Selector Pill */}
+
+
+ {/* Search Bar */}
+
+ {currentBrand.logo.mainText}
+
+ {currentBrand.logo.accentText}
+
+
+ {currentBrand.tagline}
+
+
+
+ {/* Right Actions */}
+
+ onSearchChange(e.target.value)}
+ className="w-full bg-slate-900/90 text-white placeholder-slate-400 text-xs sm:text-sm rounded-full pl-10 pr-4 py-2 border border-slate-700 focus:border-cyan-400 focus:ring-2 focus:ring-cyan-500/20 transition-all outline-hidden"
+ />
+
+
+ {/* User Auth Button */}
+
+
+ {/* Admin Link */}
+
+
+ onOpenDetail(product)}
+ className={`group rounded-2xl border transition-all duration-300 flex flex-col cursor-pointer overflow-hidden ${currentBrand.colors.cardBg}`}
+ >
+ {/* Image Container */}
+
+ );
+};
diff --git a/almeira-store-app/src/components/store/ProductModal.tsx b/almeira-store-app/src/components/store/ProductModal.tsx
new file mode 100644
index 0000000..d50aa74
--- /dev/null
+++ b/almeira-store-app/src/components/store/ProductModal.tsx
@@ -0,0 +1,222 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, Star, Truck, ShieldCheck, Zap, MessageCircle, ShoppingBag, Check } from 'lucide-react';
+import { Product, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface ProductModalProps {
+ product: Product | null;
+ onClose: () => void;
+ onAddToCart: (product: Product, size: string) => void;
+ selectedCity: City;
+}
+
+export const ProductModal: React.FC
+ 
+
+ {/* Badges */}
+
+
+ {/* Product Info */}
+
+
+ -{discountPercent}% OFF
+
+ {product.isFlashDeal && (
+
+
+
+
+
+
+
+
+
+ {/* Rating and Sales */}
+
+
+ {/* Pricing & Separation terms */}
+
+
+
+ {/* Product Title */}
+
+
+
+ +{product.salesCount || 150} pedidos
+
+ + {product.name} +
+ + {/* Available Sizes Pills */} +
+ Tallas:
+ {product.sizes.slice(0, 5).map((size) => (
+
+ {size}
+
+ ))}
+ {product.sizes.length > 5 && (
+ +{product.sizes.length - 5}
+ )}
+
+
+
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ + ⚡ Separa con {formatCOP(separation.depositAmount)} y cancelas {formatCOP(separation.balanceDue)} al recibir. +
+ + {/* Quick Action Button */} +
+
+
+
+
+ );
+};
diff --git a/almeira-store-app/src/config/brands.ts b/almeira-store-app/src/config/brands.ts
new file mode 100644
index 0000000..fe598a2
--- /dev/null
+++ b/almeira-store-app/src/config/brands.ts
@@ -0,0 +1,151 @@
+export type BrandId = 'almeira' | 'sneaky' | 'zapply' | 'dripzone';
+
+export interface BrandTheme {
+ id: BrandId;
+ name: string;
+ shortName: string;
+ tagline: string;
+ badge: string;
+ couponCode: string;
+ whatsappNumber: string;
+
+ // Clases y colores de diseño personalizados para cada una de las 4 marcas
+ colors: {
+ primaryGradient: string;
+ secondaryGradient: string;
+ heroGradient: string;
+ accentGlow: string;
+ headerBg: string;
+ bodyBg: string;
+ cardBg: string;
+ border: string;
+ textAccent: string;
+ badgeBg: string;
+ badgeText: string;
+ cartBadge: string;
+ };
+
+ logo: {
+ iconText: string;
+ mainText: string;
+ accentText: string;
+ };
+}
+
+export const BRANDS: Record
+ {/* Close Button */}
+
+
+ {/* Left: Images */}
+
+
+
+
+ {/* Right: Product Details & Actions */}
+
+ 
+
+ -{Math.round(((product.originalPrice || 170000) - product.retailPrice) / (product.originalPrice || 170000) * 100)}% OFF
+
+
+
+ {/* Thumbnails */}
+ {product.images.length > 1 && (
+
+ {product.images.map((img, i) => (
+
+ ))}
+
+ )}
+
+ {/* Trust note */}
+
+
+
+
+
+
+
+ {/* Action Buttons */}
+
+ {product.brand}
+
+
+ {/* Price Box */}
+ {product.name}
+
+
+
+
+ •
+ +{product.salesCount || 200} pares entregados
+
+
+
+ {/* Size Selector */}
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ {/* Separation breakdown banner */}
+
+
+
+
+ Separas con solo {formatCOP(separation.depositAmount)} y pagas los {formatCOP(separation.balanceDue)} al recibir en tu puerta. +
+
+
+
+ {/* Description */}
+
+ Selecciona tu Talla (Nacional CO):
+ Guía de Tallas
+
+
+ {product.sizes.map((size) => (
+
+ ))}
+
+
+
+
+ {/* Shipping note */}
+ {product.description}
+
+
+
+ {selectedCity.name}:
+ {selectedCity.deliveryTime} ({selectedCity.shippingCost === 0 ? 'Envío Gratis' : formatCOP(selectedCity.shippingCost)})
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/configuracion/page.tsx b/dripzone-app/src/app/admin/configuracion/page.tsx
new file mode 100644
index 0000000..8afa8fe
--- /dev/null
+++ b/dripzone-app/src/app/admin/configuracion/page.tsx
@@ -0,0 +1,352 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Store, Mail, Phone, MessageCircle, Instagram, MapPin, CreditCard, Save, CheckCircle2, DollarSign, Percent, ShieldCheck, QrCode, ExternalLink, Zap } from 'lucide-react';
+import { StoreSettings } from '@/types';
+
+export default function AdminSettingsPage() {
+ const [settings, setSettings] = useState
+
+
+
+
+ {message && (
+
+
+ + Administra las tarifas de envío, tiempos de entrega y configura si el 1er cambio de talla es gratis o si el cliente asume el flete para cada ciudad. +
+
+ {message}
+
+
+ )}
+
+ {/* Add New City Card */}
+
+
+ {/* Cities List */}
+
+
+ Ciudades y Zonas Registradas ({cities.length})
+ +
+ {cities.map((city) => (
+
+
+
+ ))}
+
+
+
+ {/* Actions & Policy Toggle */}
+
+ {city.name}
+ ({city.department})
+ {city.allowsContraentrega ? (
+
+ Contraentrega Activo
+
+ ) : (
+
+ Solo Despacho Nacional
+
+ )}
+
+
+
+ {/* 1st Exchange Free Toggle Button */}
+
+
+ {/* Shipping cost edit */}
+
+
+ Flete:
+ handleUpdateShipping(city.id, parseInt(e.target.value, 10) || 0)}
+ className="w-20 bg-transparent text-xs font-bold text-white outline-hidden text-right"
+ />
+ COP
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/feed-whatsapp/page.tsx b/dripzone-app/src/app/admin/feed-whatsapp/page.tsx
new file mode 100644
index 0000000..a1866cb
--- /dev/null
+++ b/dripzone-app/src/app/admin/feed-whatsapp/page.tsx
@@ -0,0 +1,365 @@
+'use client';
+
+import React, { useState } from 'react';
+import { Radio, Sparkles, Share2, AlertTriangle, ShieldCheck, Plus, Send, Layers } from 'lucide-react';
+import { SupplierPost, Product } from '@/types';
+import { INITIAL_SUPPLIER_POSTS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { checkProductDuplicate } from '@/lib/deduplication-engine';
+import { formatCOP } from '@/lib/pricing-engine';
+import { BRANDS, BrandId } from '@/config/brands';
+
+export default function SupplierFeedPage() {
+ const [posts, setPosts] = useState
+
+
+
+
+ {toast && (
+
+
+ + Configura los datos oficiales del negocio: WhatsApp oficial de atención, correo electrónico, pasarela Bold.co (Link de pago, QR y botón), Nequi, Daviplata y reglas de margen. +
+
+ {toast}
+
+
+ )}
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/grupos-whatsapp/page.tsx b/dripzone-app/src/app/admin/grupos-whatsapp/page.tsx
new file mode 100644
index 0000000..db9b690
--- /dev/null
+++ b/dripzone-app/src/app/admin/grupos-whatsapp/page.tsx
@@ -0,0 +1,585 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import {
+ MessageSquare,
+ RefreshCw,
+ Search,
+ CheckCircle2,
+ XCircle,
+ ShieldCheck,
+ Zap,
+ Radio,
+ Sliders,
+ Users,
+ Sparkles,
+ ExternalLink,
+ Plus,
+ ArrowUpRight,
+ Filter,
+ CheckSquare,
+ Square,
+ X
+} from 'lucide-react';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+export default function AdminWhatsAppGroupsPage() {
+ const [groups, setGroups] = useState
+
+
+ {actionMessage && (
+
+
+
+
+
+ {/* Target Brand Selector Pill Bar */}
+
+
+ + Recepción automática con IA, prevención de duplicados y distribución hacia las 4 marcas (Almeira Store, Sneaky, Zapply, DripZone). +
+
+
+
+
+ {actionMessage}
+
+
+ )}
+
+ {/* Live Simulator for Test Messages */}
+
+
+
+ {/* Intercepted Posts Feed */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ setTestText(e.target.value)}
+ className="flex-1 bg-slate-950 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ Mensajes Procesados Recientemente
+ +
+ {posts.map((post) => {
+ const extracted = post.extractedProduct;
+ const duplicateCheck = extracted
+ ? checkProductDuplicate(
+ {
+ name: extracted.name,
+ brand: extracted.brand,
+ sizes: extracted.sizes,
+ supplierPrice: extracted.supplierPrice,
+ },
+ products
+ )
+ : null;
+
+ return (
+
+
+ {/* Header of post */}
+
+ );
+ })}
+
+
+
+ {/* Content Grid */}
+
+
+ {post.channelName || 'Canal Mayorista'}
+
+ {post.receivedAt}
+
+
+ {/* Anti-Duplicate Status Badge */}
+ {duplicateCheck && (
+
+ {duplicateCheck.isDuplicate ? (
+ <>
+
+ )}
+
+ {/* Left: Raw WhatsApp Message (5 cols) */}
+
+
+ Mensaje de Entrada:
+
+
+ {/* Right: AI Extracted & Pricing Calculation (7 cols) */}
+ + {post.rawMessage} +
+ {post.rawImages.length > 0 && ( +
+
+
+ )}
+
+ {extracted ? (
+
+
+
+ ) : (
+
+
+
+ {/* Pricing breakdown */}
+
+
+ {extracted.brand} • {extracted.category}
+
+
+
+ IA: {Math.round(extracted.confidence * 100)}% certeza
+
+ {extracted.name}
+
+
+
+ {/* Sizes */}
+
+ Costo Base:
+
+ {formatCOP(extracted.supplierPrice)}
+
+
+
+ Precio Venta (+ Margen):
+
+ {formatCOP(extracted.suggestedRetailPrice)}
+
+
+
+
+ Tallas extraídas:
+
+
+
+ {/* Duplicate warning note */}
+ {duplicateCheck?.isDuplicate && (
+
+ {extracted.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+
+ {duplicateCheck.message}
+
+ )}
+
+ {/* Actions */}
+
+
+
+
+
+ Extrayendo datos...
+ )} +
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/layout.tsx b/dripzone-app/src/app/admin/layout.tsx
new file mode 100644
index 0000000..3b2802a
--- /dev/null
+++ b/dripzone-app/src/app/admin/layout.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import {
+ LayoutDashboard,
+ Radio,
+ Package,
+ MapPin,
+ CreditCard,
+ ShoppingBag,
+ ArrowLeft,
+ Sparkles,
+ Store,
+ Users,
+ MessageSquare,
+} from 'lucide-react';
+
+export default function AdminLayout({ children }: { children: React.ReactNode }) {
+ const pathname = usePathname();
+
+ const NAV_ITEMS = [
+ { href: '/admin', label: 'Resumen & KPIs', icon: LayoutDashboard },
+ { href: '/admin/grupos-whatsapp', label: 'Grupos WhatsApp', icon: MessageSquare, badge: 'Monitoreo 24/7' },
+ { href: '/admin/usuarios', label: 'Control de Usuarios', icon: Users, badge: 'Roles & Accesos' },
+ { href: '/admin/configuracion', label: 'Datos de la Tienda', icon: Store },
+ { href: '/admin/feed-whatsapp', label: 'Feed WhatsApp & IA', icon: Radio, badge: 'Anti-Duplicados' },
+ { href: '/admin/productos', label: 'Catálogo de Zapatillas', icon: Package },
+ { href: '/admin/ciudades', label: 'Ciudades & Fletes', icon: MapPin },
+ { href: '/admin/metodos-pago', label: 'Medios de Pago & Anticipos', icon: CreditCard },
+ { href: '/admin/pedidos', label: 'Pedidos & Logística', icon: ShoppingBag },
+ ];
+
+ return (
+
+
+
+ {/* Toast Notification */}
+ {toast && (
+
+
+
+
+
+ {/* Big Search and Select Button */}
+
+
+
+ + Busca y selecciona los grupos de proveedores que el bot de Evolution API & Gemini debe escuchar 24/7 para auto-publicar zapatillas. +
+
+ {toast}
+
+
+ )}
+
+ {/* Stats Bar */}
+
+
+
+ {/* Filter and Search Toolbar */}
+
+
+
+
+
+ Grupos en tu WhatsApp
+{groups.length}
+
+
+
+
+
+
+
+ Grupos Monitoreados (Activos)
+{monitoredCount}
+
+
+
+
+
+
+ Evolution API (WhatsApp)
++ + AutomataAlmeira (En línea) +
+
+
+
+
+
+ {/* Active Monitored Groups List */}
+
+
+
+
+
+
+
+
+
+ {isLoading ? (
+
+
+ {/* ========================================================= */}
+ {/* MODAL: Group Picker (Buscar y Seleccionar Grupos) */}
+ {/* ========================================================= */}
+ {isPickerOpen && (
+
+
+ ) : filteredGroups.length === 0 ? (
+ Cargando grupos de proveedores...
+
+
+ ) : (
+ filteredGroups.map((group) => {
+ const isMonitored = group.isMonitored;
+
+ return (
+ No tienes grupos seleccionados para monitorear.
+ +
+ {/* Header */}
+
+ );
+ })
+ )}
+
+
+
+ {/* Info Pills */}
+
+
+
+ {/* Toggle Switch */}
+
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+
+
+ {group.notes && (
+
+ Margen Aplicado
+
+ +{group.profitMarginOverride || 35}% (Redondeo a $5.000)
+
+
+
+
+ Modo de Ingreso
+
+
+ + ℹ️ {group.notes} +
+ )} + + {/* Action footer */} +
+
+ {group.participantsCount ? `👥 ${group.participantsCount} miembros` : 'Canal Mayorista'}
+
+
+
+
+
+
+ )}
+
+ {/* Modal Header */}
+
+
+
+
+ {/* Search and Action Toolbar in Modal */}
+
+
+
+
+
+
+
+ Seleccionar Grupos de WhatsApp
++ Marca los grupos que deseas monitorear con IA para auto-publicar calzado. +
+
+
+
+ {/* Groups Scrollable List */}
+
+
+
+
+
+ Mostrando {filteredPickerGroups.length} grupos encontrados
+
+
+
+
+ •
+
+
+
+ {isLoadingLive ? (
+
+
+ {/* Modal Footer */}
+
+
+ ) : filteredPickerGroups.length === 0 ? (
+ Consultando grupos en vivo desde Evolution API...
+Conectando con WhatsApp...
+
+
+ ) : (
+ filteredPickerGroups.map((group) => {
+ const isSelected = selectedJids.has(group.jid);
+
+ return (
+ No se encontraron grupos con el término "{pickerSearch}".
+ handleToggleSelectJid(group.jid)}
+ className={`p-3.5 rounded-2xl border transition-all cursor-pointer flex items-center justify-between gap-3 ${
+ isSelected
+ ? 'bg-purple-950/30 border-purple-500/50 shadow-md ring-1 ring-purple-500/20'
+ : 'bg-neutral-950 border-neutral-800 hover:border-neutral-700'
+ }`}
+ >
+
+ );
+ })
+ )}
+
+
+
+
+ {isSelected &&
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+ {isSelected ? (
+
+ Monitorear
+
+ ) : (
+
+ Ignorar
+
+ )}
+
+
+
+
+ Seleccionados:
+ {selectedJids.size}
+ grupos para monitorear
+
+
+
+
+
+
+
+ {/* Sidebar */}
+
+
+ {/* Main Content Area */}
+
+ {children}
+
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/metodos-pago/page.tsx b/dripzone-app/src/app/admin/metodos-pago/page.tsx
new file mode 100644
index 0000000..f80adad
--- /dev/null
+++ b/dripzone-app/src/app/admin/metodos-pago/page.tsx
@@ -0,0 +1,163 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { CreditCard, Zap, Save, Check, ShieldCheck, QrCode } from 'lucide-react';
+import { PaymentMethod } from '@/types';
+import { INITIAL_PAYMENT_METHODS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminPaymentMethodsPage() {
+ const [methods, setMethods] = useState
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/page.tsx b/dripzone-app/src/app/admin/page.tsx
new file mode 100644
index 0000000..8d400b5
--- /dev/null
+++ b/dripzone-app/src/app/admin/page.tsx
@@ -0,0 +1,159 @@
+'use client';
+
+import React, { useState } from 'react';
+import Link from 'next/link';
+import { Package, Radio, MapPin, Zap, CheckCircle2, ArrowUpRight, Sparkles } from 'lucide-react';
+import { INITIAL_PRODUCTS, INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_SUPPLIER_POSTS } from '@/lib/data-service';
+
+export default function AdminDashboardPage() {
+ const [productsCount] = useState(INITIAL_PRODUCTS.length);
+ const [postsCount] = useState(INITIAL_SUPPLIER_POSTS.length);
+ const [citiesCount] = useState(INITIAL_CITIES.length);
+
+ return (
+
+
+
+
+
+ {message && (
+
+
+ + Habilita métodos de pago, configura el valor de separación de $10.000 COP y personaliza los datos de Nequi / Daviplata. +
+
+ {message}
+
+
+ )}
+
+ {/* Methods Cards */}
+
+ {methods.map((method) => (
+
+
+
+ ))}
+
+
+
+
+
+
+
+ {method.type === 'contraentrega' ?
+
+
+ {method.name}
+ Tipo: {method.type} +
+
+
+
+
+
+
+
+ handleUpdateField(method.id, 'name', e.target.value)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ handleUpdateField(method.id, 'description', e.target.value)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+ {method.requiresDeposit && (
+
+
+ handleUpdateField(method.id, 'depositAmount', parseInt(e.target.value, 10) || 0)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden font-bold"
+ />
+
+ (El saldo restante se cobra contraentrega al recibir)
+
+
+ )}
+
+
+
+ handleUpdateField(method.id, 'accountInfo', e.target.value)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ placeholder="Ej. Nequi / Daviplata: 316 745 5877"
+ />
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/pedidos/page.tsx b/dripzone-app/src/app/admin/pedidos/page.tsx
new file mode 100644
index 0000000..25ca97f
--- /dev/null
+++ b/dripzone-app/src/app/admin/pedidos/page.tsx
@@ -0,0 +1,275 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { ShoppingBag, Truck, CheckCircle2, Clock, Phone, MapPin, Search, MessageCircle, Send, ShieldCheck, UserCheck } from 'lucide-react';
+import { Order, OrderItem } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminOrdersPage() {
+ const [orders, setOrders] = useState
+
+
+ {/* KPI Cards */}
+
+
+
+
+
+
+
+ + Automatización inteligente de calzado, publicaciones a Facebook y gestión de despachos. +
+
+
+
+
+
+
+ {/* Quick Actions & Automation Status */}
+
+
+
+
+ Zapatillas Activas
+
+ {productsCount}
+
+
+
+
+
+ Margen Promedio
+
+
+ +$30.000 COP
+
+ + (Costo: $90k ➔ Venta: $120k) +
+
+
+
+
+ Entradas Procesadas
+
+ {postsCount}
+ + IA Gemini + Anti-duplicados +
+
+
+
+ Ciudades Habilitadas
+
+ {citiesCount}
+ + Contraentrega activo en Cali +
+
+ {/* Left: WhatsApp Evolution API Status */}
+
+
+
+
+ {/* Right: Meta / Facebook Automation */}
+
+
+
+
+
+
+
+ Activo
+
+ Estado del Listener de WhatsApp
+
+
+
+
+ Ver últimos mensajes procesados
+
+ Instancia Evolution API:
+ AutomataAlmeira
+
+
+ Servidor:
+ evolution.almeira.com.co
+
+
+ Motor de Inteligencia Artificial:
+ Gemini 2.5 Flash
+
+
+ Filtro Anti-Duplicados:
+ Activo (>75% Similitud)
+
+
+
+
+
+
+ Publicador a Fanpage de Facebook
+ + Listo para Publicar + +
+
+
+
+ Publicar Producto de Prueba en Facebook
+ ✨ Plantilla de Copy Vendedor Integrada:
+
+ "✨ ALMEIRA STORE • NUEVA COLECCIÓN EXCLUSIVA ✨
+ 👟 NIKE DUNK LOW PANDA
+ 📏 Tallas: 37 a 43 | 💎 Precio: $120.000 COP
+ 🚚 ¡Entrega a Domicilio en Cali con Pago Contraentrega!"
+
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/productos/page.tsx b/dripzone-app/src/app/admin/productos/page.tsx
new file mode 100644
index 0000000..01e38fc
--- /dev/null
+++ b/dripzone-app/src/app/admin/productos/page.tsx
@@ -0,0 +1,472 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Package, Plus, Eye, EyeOff, Check, X, Sparkles, Filter, Phone, MessageCircle, Truck } from 'lucide-react';
+import { Product, Supplier } from '@/types';
+import { INITIAL_PRODUCTS, INITIAL_SUPPLIERS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminProductsPage() {
+ const [products, setProducts] = useState
+
+
+
+
+ {/* Toolbar */}
+
+
+ + Control logístico de pedidos contraentrega, cobro de anticipos de $10.000 COP y notificación inmediata de separación al proveedor vía WhatsApp. +
+
+
+
+ {filteredOrders.length === 0 ? (
+
+
+
+
+
+
+
+
+ setSearch(e.target.value)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-purple-400"
+ />
+
+
+
+ ) : (
+
+
+ No hay pedidos en esta sección
++ Cuando los clientes hagan un pedido en la tienda web o por WhatsApp, aparecerán aquí con el botón para separar inmediatamente con el proveedor correspondiente. +
+
+ {filteredOrders.map((order) => (
+
+ )}
+
+
+ ))}
+
+
+
+
+ Orden #{order.id}
+ • {new Date(order.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
+
+ {getStatusBadge(order.status)}
+
+
+
+
+
+ Cliente & Entrega (24 Horas)
+
+
+
+ {order.customerName}
+
+
+
+
+ Zapatillas & Proveedor Asignado:
+
+
+
+
+ {order.items.map((it, idx) => {
+ const suppName = it.supplierName || 'DIFUSION JOVIC STORE';
+ return (
+
+
+
+ );
+ })}
+
+
+
+
+
+
+
+ Prov: {suppName}
+
+ {it.productName}
++ Talla {it.size} • Cant: {it.quantity} +
+
+
+ Cobro & Pagos Contraentrega
+
+
+
+
+ + Total de la Orden: + {formatCOP(order.totalAmount)} +
+ {order.depositAmount > 0 ? ( + <> ++ Anticipo / Separación: + {formatCOP(order.depositAmount)} +
++ Saldo al Mensajero: + {formatCOP(order.balanceDue)} +
+ + ) : ( ++ 100% Contraentrega al recibir +
+ )} +
+ Método: {order.paymentMethodName}
+
+
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/admin/usuarios/page.tsx b/dripzone-app/src/app/admin/usuarios/page.tsx
new file mode 100644
index 0000000..9d07cdd
--- /dev/null
+++ b/dripzone-app/src/app/admin/usuarios/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Users, UserPlus, Shield, ShieldCheck, UserCheck, MessageCircle, Mail, Phone, MapPin, Eye, EyeOff, Trash2, Edit, Check, X } from 'lucide-react';
+import { User } from '@/types';
+
+export default function AdminUsersPage() {
+ const [users, setUsers] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Visualiza cada modelo con su proveedor asignado, costo mayorista y activa/inactiva publicaciones para la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* Filters & Search Toolbar */}
+
+ {/* Status filter pills */}
+
+
+ {/* Products Table */}
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-purple-400"
+ />
+
+
+
+
+ {/* Modal Add Product */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado Publicación | +Producto | +Proveedor Asignado (Interno) | +Marca | +Costo Base | +Precio Venta | +Margen Ganancia | +Tallas | +
|---|---|---|---|---|---|---|---|
| + No hay zapatillas que coincidan con el filtro seleccionado. + | +|||||||
| + + | + + {/* Product Name & Image */} +
+
+
+ {prod.name} + {prod.category} + |
+
+ {/* Supplier Column */}
+
+
+
+ 🏢 {suppName}
+
+
+
+ |
+
+ {prod.brand} | +{formatCOP(prod.supplierPrice)} | +{formatCOP(prod.retailPrice)} | + ++ + +{formatCOP(margin)} + + | + +
+
+ {prod.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+ |
+
+
+ )}
+
+
+ Registrar Nueva Zapatilla
+ + +
+ {/* Header */}
+
+ );
+}
diff --git a/dripzone-app/src/app/api/auth/login/route.ts b/dripzone-app/src/app/api/auth/login/route.ts
new file mode 100644
index 0000000..a2ae66e
--- /dev/null
+++ b/dripzone-app/src/app/api/auth/login/route.ts
@@ -0,0 +1,29 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function POST(request: Request) {
+ try {
+ const { identifier } = await request.json();
+ if (!identifier) {
+ return NextResponse.json({ success: false, error: 'Ingresa tu correo o celular' }, { status: 400 });
+ }
+ const user = dataService.authenticate(identifier);
+ if (!user) {
+ return NextResponse.json(
+ { success: false, error: 'Usuario no encontrado. Verifica tu correo o celular.' },
+ { status: 404 }
+ );
+ }
+ if (!user.isActive) {
+ return NextResponse.json(
+ { success: false, error: 'Esta cuenta se encuentra inactiva. Contacta a soporte.' },
+ { status: 403 }
+ );
+ }
+
+ dataService.updateUser(user.id, { lastLogin: 'Justo ahora' });
+ return NextResponse.json({ success: true, user });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/auth/register/route.ts b/dripzone-app/src/app/api/auth/register/route.ts
new file mode 100644
index 0000000..62b2a63
--- /dev/null
+++ b/dripzone-app/src/app/api/auth/register/route.ts
@@ -0,0 +1,42 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function POST(request: Request) {
+ try {
+ const { name, email, phone, city, address } = await request.json();
+ if (!name || !email || !phone) {
+ return NextResponse.json(
+ { success: false, error: 'Nombre, correo y celular son obligatorios' },
+ { status: 400 }
+ );
+ }
+
+ const existing = dataService.authenticate(email) || dataService.authenticate(phone);
+ if (existing) {
+ return NextResponse.json(
+ { success: false, error: 'Ya existe una cuenta con este correo o celular' },
+ { status: 409 }
+ );
+ }
+
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name,
+ email,
+ phone,
+ city: city || 'Cali',
+ address: address || '',
+ role: 'customer',
+ isActive: true,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ lastLogin: 'Justo ahora',
+ };
+
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/cities/route.ts b/dripzone-app/src/app/api/cities/route.ts
new file mode 100644
index 0000000..3ecd601
--- /dev/null
+++ b/dripzone-app/src/app/api/cities/route.ts
@@ -0,0 +1,27 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const cities = dataService.getCities();
+ return NextResponse.json({ success: true, cities });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateCity(id, updates);
+ return NextResponse.json({ success: true, city: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const created = dataService.addCity(body);
+ return NextResponse.json({ success: true, city: created });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/orders/route.ts b/dripzone-app/src/app/api/orders/route.ts
new file mode 100644
index 0000000..9c996b6
--- /dev/null
+++ b/dripzone-app/src/app/api/orders/route.ts
@@ -0,0 +1,30 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { sendWhatsAppMessage, buildOrderConfirmationMessage } from '@/lib/evolution-api';
+
+export async function GET() {
+ const orders = dataService.getOrders();
+ return NextResponse.json({ success: true, orders });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newOrder = dataService.createOrder(body);
+
+ // Enviar confirmación por WhatsApp en background si tiene teléfono válido
+ if (newOrder.customerPhone) {
+ try {
+ const msg = buildOrderConfirmationMessage(newOrder);
+ // Intentar enviar WhatsApp
+ await sendWhatsAppMessage(newOrder.customerPhone, msg);
+ } catch (waErr) {
+ console.warn('No se pudo enviar WhatsApp automático:', waErr);
+ }
+ }
+
+ return NextResponse.json({ success: true, order: newOrder });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/payment-methods/route.ts b/dripzone-app/src/app/api/payment-methods/route.ts
new file mode 100644
index 0000000..b49c62d
--- /dev/null
+++ b/dripzone-app/src/app/api/payment-methods/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const methods = dataService.getPaymentMethods();
+ return NextResponse.json({ success: true, paymentMethods: methods });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updatePaymentMethod(id, updates);
+ return NextResponse.json({ success: true, paymentMethod: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/products/route.ts b/dripzone-app/src/app/api/products/route.ts
new file mode 100644
index 0000000..9ebf898
--- /dev/null
+++ b/dripzone-app/src/app/api/products/route.ts
@@ -0,0 +1,46 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET(request: Request) {
+ const { searchParams } = new URL(request.url);
+ const includeAll = searchParams.get('all') === 'true';
+
+ let products = dataService.getProducts();
+ if (!includeAll) {
+ products = products.filter((p) => p.isActive !== false);
+ }
+
+ return NextResponse.json({ success: true, products });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newProduct = dataService.addProduct({
+ ...body,
+ isActive: body.isActive !== undefined ? body.isActive : true,
+ });
+ return NextResponse.json({ success: true, product: newProduct });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const { id, updates } = body;
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID de producto requerido' }, { status: 400 });
+ }
+
+ const updated = dataService.updateProduct(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Producto no encontrado' }, { status: 404 });
+ }
+
+ return NextResponse.json({ success: true, product: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/publish/facebook/route.ts b/dripzone-app/src/app/api/publish/facebook/route.ts
new file mode 100644
index 0000000..d2db7a3
--- /dev/null
+++ b/dripzone-app/src/app/api/publish/facebook/route.ts
@@ -0,0 +1,12 @@
+import { NextResponse } from 'next/server';
+import { publishToFacebookPage } from '@/lib/facebook-publisher';
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const result = await publishToFacebookPage(body);
+ return NextResponse.json(result);
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/dripzone-app/src/app/api/settings/route.ts b/dripzone-app/src/app/api/settings/route.ts
new file mode 100644
index 0000000..6073d91
--- /dev/null
+++ b/dripzone-app/src/app/api/settings/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const settings = dataService.getSettings();
+ return NextResponse.json({ success: true, settings });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const updated = dataService.updateSettings(body);
+ return NextResponse.json({ success: true, settings: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/users/route.ts b/dripzone-app/src/app/api/users/route.ts
new file mode 100644
index 0000000..8b62fad
--- /dev/null
+++ b/dripzone-app/src/app/api/users/route.ts
@@ -0,0 +1,57 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function GET() {
+ const users = dataService.getUsers();
+ return NextResponse.json({ success: true, users });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name: body.name,
+ email: body.email,
+ phone: body.phone,
+ city: body.city || 'Cali',
+ address: body.address || '',
+ role: body.role || 'customer',
+ isActive: body.isActive !== false,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ };
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateUser(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Usuario no encontrado' }, { status: 404 });
+ }
+ return NextResponse.json({ success: true, user: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function DELETE(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const id = searchParams.get('id');
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID requerido' }, { status: 400 });
+ }
+ const deleted = dataService.deleteUser(id);
+ return NextResponse.json({ success: deleted });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/dripzone-app/src/app/api/webhook/whatsapp/route.ts b/dripzone-app/src/app/api/webhook/whatsapp/route.ts
new file mode 100644
index 0000000..3227db1
--- /dev/null
+++ b/dripzone-app/src/app/api/webhook/whatsapp/route.ts
@@ -0,0 +1,60 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { parseSupplierMessage } from '@/lib/gemini-parser';
+import { SupplierPost } from '@/types';
+
+export async function GET() {
+ const posts = dataService.getSupplierPosts();
+ return NextResponse.json({ success: true, posts });
+}
+
+export async function POST(request: Request) {
+ try {
+ const payload = await request.json();
+ console.log('📥 Webhook Evolution API recibido:', JSON.stringify(payload).slice(0, 300));
+
+ const data = payload.data || payload;
+
+ const messageContent =
+ data.message?.conversation ||
+ data.message?.extendedTextMessage?.text ||
+ data.message?.imageMessage?.caption ||
+ data.text ||
+ '';
+
+ const channelName =
+ data.pushName ||
+ data.groupInfo?.subject ||
+ (data.key?.remoteJid?.includes('g.us') ? 'Canal Mayorista Entrada' : 'Recepción Directa');
+
+ if (!messageContent || messageContent.trim().length < 5) {
+ return NextResponse.json({ success: true, ignored: 'Mensaje vacío o sin texto relevante' });
+ }
+
+ // Parsear con Gemini AI
+ const extracted = await parseSupplierMessage(messageContent);
+
+ const newPost: SupplierPost = {
+ id: `post-${Date.now()}`,
+ channelName: data.groupInfo?.subject || channelName,
+ rawMessage: messageContent,
+ rawImages: [
+ 'https://images.unsplash.com/photo-1595950653106-6c9ebd614d3a?auto=format&fit=crop&w=800&q=80',
+ ],
+ extractedProduct: extracted,
+ status: 'pending_review',
+ receivedAt: 'Justo ahora',
+ };
+
+ dataService.addSupplierPost(newPost);
+
+ return NextResponse.json({
+ success: true,
+ message: 'Mensaje procesado con IA e ingresado al feed interno',
+ post: newPost,
+ });
+ } catch (error: any) {
+ console.error('Error procesando webhook de WhatsApp:', error);
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/dripzone-app/src/app/api/whatsapp-groups/route.ts b/dripzone-app/src/app/api/whatsapp-groups/route.ts
new file mode 100644
index 0000000..6f78a1c
--- /dev/null
+++ b/dripzone-app/src/app/api/whatsapp-groups/route.ts
@@ -0,0 +1,104 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+const EVOLUTION_API_URL = process.env.EVOLUTION_API_URL || 'https://evolution.almeira.com.co';
+const EVOLUTION_API_KEY = process.env.EVOLUTION_API_KEY || 'EE49029EEB85-4568-8F81-C9FDFC6E2943';
+const EVOLUTION_INSTANCE_NAME = process.env.EVOLUTION_INSTANCE_NAME || 'AutomataAlmeira';
+
+export async function GET(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const fetchLive = searchParams.get('fetchLive') === 'true';
+
+ const localGroups = dataService.getMonitoredGroups();
+
+ if (!fetchLive) {
+ return NextResponse.json({
+ success: true,
+ groups: localGroups,
+ });
+ }
+
+ // Consultar grupos en vivo desde Evolution API
+ try {
+ const response = await fetch(
+ `${EVOLUTION_API_URL}/group/fetchAllGroups/${EVOLUTION_INSTANCE_NAME}?getParticipants=false`,
+ {
+ headers: {
+ apikey: EVOLUTION_API_KEY,
+ 'Content-Type': 'application/json',
+ },
+ }
+ );
+
+ const liveGroups = await response.json();
+
+ if (Array.isArray(liveGroups)) {
+ const merged: MonitoredWhatsAppGroup[] = liveGroups.map((lg: any) => {
+ const jid = lg.id || lg.jid;
+ const name = lg.subject || lg.name || 'Grupo Sin Nombre';
+ const existing = localGroups.find((g) => g.jid === jid || g.name.toLowerCase() === name.toLowerCase());
+
+ return {
+ id: existing?.id || `grp-${jid.replace(/\D/g, '').slice(-6)}`,
+ jid,
+ name,
+ isMonitored: existing ? existing.isMonitored : false,
+ supplierId: existing?.supplierId,
+ supplierName: existing?.supplierName || name,
+ profitMarginOverride: existing?.profitMarginOverride || 35,
+ autoPublish: existing?.autoPublish ?? true,
+ participantsCount: lg.size || (lg.participants ? lg.participants.length : undefined),
+ notes: existing?.notes || '',
+ };
+ });
+
+ // Asegurar que los locales que no vinieron en live sigan presentes
+ localGroups.forEach((lg) => {
+ if (!merged.some((m) => m.jid === lg.jid || m.id === lg.id)) {
+ merged.unshift(lg);
+ }
+ });
+
+ return NextResponse.json({
+ success: true,
+ isLive: true,
+ totalLive: liveGroups.length,
+ groups: merged,
+ });
+ }
+ } catch (err: any) {
+ console.warn('No se pudo conectar con Evolution API en vivo:', err.message);
+ }
+
+ return NextResponse.json({
+ success: true,
+ isLive: false,
+ groups: localGroups,
+ });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+
+ if (body.action === 'toggle') {
+ const { idOrJid, isMonitored } = body;
+ const updated = dataService.toggleGroupMonitoring(idOrJid, isMonitored);
+ return NextResponse.json({ success: true, group: updated });
+ }
+
+ if (Array.isArray(body.groups)) {
+ const saved = dataService.saveMonitoredGroups(body.groups);
+ return NextResponse.json({ success: true, groups: saved });
+ }
+
+ return NextResponse.json({ success: false, error: 'Datos no válidos' }, { status: 400 });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/dripzone-app/src/app/checkout/page.tsx b/dripzone-app/src/app/checkout/page.tsx
new file mode 100644
index 0000000..45c7980
--- /dev/null
+++ b/dripzone-app/src/app/checkout/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { ArrowLeft, CheckCircle2, ShieldCheck, Truck, Zap, QrCode, Phone, MapPin, User, MessageCircle, ExternalLink, CreditCard } from 'lucide-react';
+import { City, PaymentMethod, Order, StoreSettings } from '@/types';
+import { INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+import confetti from 'canvas-confetti';
+
+export default function CheckoutPage() {
+ const { currentBrand } = useBrand();
+
+ const [customerName, setCustomerName] = useState('');
+ const [customerPhone, setCustomerPhone] = useState('');
+ const [address, setAddress] = useState('');
+ const [neighborhood, setNeighborhood] = useState('');
+ const [notes, setNotes] = useState('');
+
+ const [cities, setCities] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Administra los accesos de administradores, operadores de logística y clientes registrados de la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* KPI Stats Cards */}
+
+
+
+ {/* Filters Toolbar */}
+
+
+
+
+
+
+
+ Administradores
+{adminsCount}
+
+
+
+
+
+
+
+ Operadores Logísticos
+{operatorsCount}
+
+
+
+
+
+
+ Clientes Registrados
+{customersCount}
+
+ {/* Role Pills */}
+
+
+ {/* Users Table */}
+
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-neutral-900 border border-neutral-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-purple-400"
+ />
+
+
+
+
+ {/* Modal Create User */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado | +Usuario | +Contacto Directo | +Ciudad / Dirección | +Rol & Permisos | +Último Acceso | +Acciones | +
|---|---|---|---|---|---|---|
| + No se encontraron usuarios con el filtro seleccionado. + | +||||||
| + + | + + {/* User Avatar & Name */} +
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+ {user.name} + {user.email} + |
+
+ {/* Contact */}
+
+
+
+
+ |
+
+ {/* City */}
+
+
+ {user.city || 'Cali'}
+ {user.address &&
+ {user.address} } + |
+
+ {/* Role Dropdown */}
+ + + | + + {/* Last Login */} ++ {user.lastLogin || user.createdAt} + | + + {/* Actions */} ++ + | +
+
+ )}
+
+
+ Registrar Nuevo Usuario / Operador
+ + +
+
+ );
+ }
+
+ return (
+
+
+
+
+
+
+
+ ¡Pedido Registrado con Éxito!
+
+
+
+ {/* Bold.co or Nequi Separation Box */}
+ {orderCompleted.depositAmount > 0 ? (
+ Orden #{orderCompleted.id}
++ Hemos recibido tu solicitud para entrega en {orderCompleted.cityName} con {currentBrand.name}. +
+
+
+ ) : (
+
+
+ + Paga de inmediato con Link de Pago Bold.co (PSE / Tarjeta / Nequi) o transfiere a nuestra cuenta oficial: +
+ + {boldLink && ( + +
+ 📱 Nequi / Daviplata: {storeSettings?.nequiAccount || '316 745 5877'} ({storeSettings?.accountHolder || 'Carlos Andrés Lasso'})
+
+ + 🤝 Cancelas el saldo de {formatCOP(orderCompleted.balanceDue)} al recibir el paquete en tu casa. +
+
+
+ )}
+
+ + Tu pedido quedó programado para entrega contraentrega en 24 horas. ¡Nos pondremos en contacto contigo por WhatsApp! +
+
+
+
+
+ Volver a la Tienda
+
+
+
+
+ );
+}
diff --git a/dripzone-app/src/app/favicon.ico b/dripzone-app/src/app/favicon.ico
new file mode 100644
index 0000000..718d6fe
Binary files /dev/null and b/dripzone-app/src/app/favicon.ico differ
diff --git a/dripzone-app/src/app/globals.css b/dripzone-app/src/app/globals.css
new file mode 100644
index 0000000..a2dc41e
--- /dev/null
+++ b/dripzone-app/src/app/globals.css
@@ -0,0 +1,26 @@
+@import "tailwindcss";
+
+:root {
+ --background: #ffffff;
+ --foreground: #171717;
+}
+
+@theme inline {
+ --color-background: var(--background);
+ --color-foreground: var(--foreground);
+ --font-sans: var(--font-geist-sans);
+ --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ --background: #0a0a0a;
+ --foreground: #ededed;
+ }
+}
+
+body {
+ background: var(--background);
+ color: var(--foreground);
+ font-family: Arial, Helvetica, sans-serif;
+}
diff --git a/dripzone-app/src/app/layout.tsx b/dripzone-app/src/app/layout.tsx
new file mode 100644
index 0000000..6e94495
--- /dev/null
+++ b/dripzone-app/src/app/layout.tsx
@@ -0,0 +1,61 @@
+import type { Metadata, Viewport } from 'next';
+import { Geist, Geist_Mono } from 'next/font/google';
+import './globals.css';
+import { BrandProvider } from '@/context/BrandContext';
+import { AuthProvider } from '@/context/AuthContext';
+
+const geistSans = Geist({
+ variable: '--font-geist-sans',
+ subsets: ['latin'],
+});
+
+const geistMono = Geist_Mono({
+ variable: '--font-geist-mono',
+ subsets: ['latin'],
+});
+
+export const viewport: Viewport = {
+ themeColor: '#8b5cf6',
+ width: 'device-width',
+ initialScale: 1,
+ maximumScale: 1,
+ userScalable: false,
+ viewportFit: 'cover',
+};
+
+export const metadata: Metadata = {
+ title: 'DripZone • Luxury Streetwear',
+ description: 'Zapatillas exclusivas y calzado de colección con despacho contraentrega en 24 horas.',
+ manifest: '/manifest.json',
+ appleWebApp: {
+ capable: true,
+ statusBarStyle: 'black-translucent',
+ title: 'DripZone',
+ },
+ icons: {
+ icon: '/icon.svg',
+ apple: '/icon.svg',
+ },
+};
+
+export default function RootLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+
+
+
+
+
+
+
+ {/* Header */}
+
+
+
+
+
+
+
+
+
+ {/* Navigation Header */}
+ setIsCartOpen(true)}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => setIsCityModalOpen(true)}
+ searchQuery={searchQuery}
+ onSearchChange={setSearchQuery}
+ />
+
+ {/* Main Container */}
+
+ {/* Flash Deals Hero Banner */}
+
+
+ {/* Footer */}
+
+
+ {/* Modals & Drawers */}
+ setSelectedProduct(null)}
+ onAddToCart={handleAddToCart}
+ selectedCity={selectedCity}
+ />
+
+ setIsCartOpen(false)}
+ cartItems={cartItems}
+ onRemoveItem={handleRemoveFromCart}
+ onUpdateQuantity={handleUpdateQuantity}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => {
+ setIsCartOpen(false);
+ setIsCityModalOpen(true);
+ }}
+ />
+
+ setIsCityModalOpen(false)}
+ cities={cities}
+ selectedCity={selectedCity}
+ onSelectCity={setSelectedCity}
+ />
+
+ {/* Mobile App Dock & Install Banner */}
+ setIsCartOpen(true)}
+ onOpenInstallModal={() => setIsInstallModalOpen(true)}
+ />
+
+ setIsInstallModalOpen(false)}
+ />
+
+ {/* User Auth Modal */}
+
+ );
+}
diff --git a/dripzone-app/src/components/auth/AuthModal.tsx b/dripzone-app/src/components/auth/AuthModal.tsx
new file mode 100644
index 0000000..d0a6fa7
--- /dev/null
+++ b/dripzone-app/src/components/auth/AuthModal.tsx
@@ -0,0 +1,255 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, User, Lock, Mail, Phone, MapPin, Sparkles, LogIn, UserPlus, Shield, LogOut } from 'lucide-react';
+import { useAuth } from '@/context/AuthContext';
+import { useBrand } from '@/context/BrandContext';
+import Link from 'next/link';
+
+export const AuthModal: React.FC = () => {
+ const { user, login, register, logout, isAuthModalOpen, closeAuthModal } = useAuth();
+ const { currentBrand } = useBrand();
+
+ const [mode, setMode] = useState<'login' | 'register'>('login');
+ const [identifier, setIdentifier] = useState('');
+ const [name, setName] = useState('');
+ const [email, setEmail] = useState('');
+ const [phone, setPhone] = useState('');
+ const [city, setCity] = useState('Cali');
+ const [address, setAddress] = useState('');
+ const [error, setError] = useState
+
+
+ {/* Category & Brand Filters */}
+
+
+
+
+
+
+
+ Entrega en 24 Horas
+Directo en Cali
+
+
+
+
+
+
+
+ Pago Contraentrega
+Cancelas al recibir
+
+
+
+
+
+
+
+ Separa con $10.000
+Aparta tu talla
+
+
+
+
+
+
+ Garantía Total
+Cambio asegurado
+
+
+
+ {/* Product Grid */}
+ {filteredProducts.length === 0 ? (
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+ ) : (
+
+
+ No encontramos zapatillas con ese criterio
+Intenta buscar otra marca o restablecer los filtros.
+ +
+ {filteredProducts.map((product) => (
+ handleAddToCart(p, size)}
+ />
+ ))}
+
+ )}
+
+
+ );
+};
diff --git a/dripzone-app/src/components/mobile/MobileBottomDock.tsx b/dripzone-app/src/components/mobile/MobileBottomDock.tsx
new file mode 100644
index 0000000..059a3ba
--- /dev/null
+++ b/dripzone-app/src/components/mobile/MobileBottomDock.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { Home, Search, ShoppingBag, MessageCircle, Download, Check } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileBottomDockProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ onOpenSearch?: () => void;
+ onOpenInstallModal: () => void;
+}
+
+export const MobileBottomDock: React.FC
+
+
+ {/* If user is already logged in: View Profile */}
+ {user ? (
+
+
+
+ ) : (
+ /* Login or Register */
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+
+ {user.name}
+{user.email}
+
+
+ {user.role === 'admin' ? '👑 Administrador' : user.role === 'operator' ? '📦 Operador Logística' : '🛍️ Cliente Registrado'}
+
+
+
+
+
+ {user.role === 'admin' || user.role === 'operator' ? (
+
+ 📱 Celular: {user.phone}
+📍 Ciudad: {user.city || 'Cali'}
+ {user.address &&🏠 Dirección: {user.address}
} +
+
+ )}
+
+
+
+ {/* Mode Switch Tabs */}
+
+ {currentBrand.shortName[0]}
+
+
+
+ + {mode === 'login' ? 'Iniciar Sesión' : 'Crear Cuenta'} +
++ {mode === 'login' + ? 'Accede para gestionar pedidos o entrar como admin' + : 'Regístrate para compras rápidas y seguimiento'} +
+
+
+
+
+
+ {error && (
+
+ {error}
+
+ )}
+
+ {mode === 'login' ? (
+
+ ) : (
+
+ )}
+
+
+ );
+};
diff --git a/dripzone-app/src/components/mobile/MobileInstallBanner.tsx b/dripzone-app/src/components/mobile/MobileInstallBanner.tsx
new file mode 100644
index 0000000..1c64ca5
--- /dev/null
+++ b/dripzone-app/src/components/mobile/MobileInstallBanner.tsx
@@ -0,0 +1,125 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Download, Sparkles, X, Smartphone, CheckCircle, Share2, PlusSquare } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileInstallBannerProps {
+ isOpen: boolean;
+ onClose: () => void;
+}
+
+export const MobileInstallBanner: React.FC
+ setActiveTab('home')}
+ className={`flex flex-col items-center gap-0.5 cursor-pointer transition-all ${
+ activeTab === 'home' ? 'text-white' : 'text-neutral-400 hover:text-neutral-200'
+ }`}
+ >
+
+
+
+ );
+};
diff --git a/dripzone-app/src/components/store/CartDrawer.tsx b/dripzone-app/src/components/store/CartDrawer.tsx
new file mode 100644
index 0000000..bca5a6d
--- /dev/null
+++ b/dripzone-app/src/components/store/CartDrawer.tsx
@@ -0,0 +1,254 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { X, Trash2, ShoppingBag, ArrowRight, Zap, Truck, MessageCircle } from 'lucide-react';
+import { CartItem, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface CartDrawerProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cartItems: CartItem[];
+ onRemoveItem: (productId: string, size: string) => void;
+ onUpdateQuantity: (productId: string, size: string, delta: number) => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+}
+
+export const CartDrawer: React.FC
+
+
+
+
+
+
+
+ {currentBrand.shortName[0]}
+
+
+
+ Instalar {currentBrand.name}
+Aplicación Móvil para Android & iPhone
+
+
+
+ {isIOS ? (
+
+
+
+
+
+
+
+
+ ) : deferredPrompt ? (
+
+ ) : (
+
+
-
+
- Toca el botón Compartir
abajo en Safari.
+ - Desliza hacia abajo y selecciona "Agregar a Inicio
".
+ - ¡Listo! El icono de {currentBrand.shortName} aparecerá en tu teléfono. +
+
+ )}
+
+
+
+ Para instalar en tu navegador:
++ Abre el menú de opciones del navegador (los 3 puntos arriba a la derecha) y toca "Instalar aplicación" o "Agregar a pantalla principal". +
+
+ {/* Backdrop */}
+
+
+
+ );
+};
diff --git a/dripzone-app/src/components/store/CategoryPills.tsx b/dripzone-app/src/components/store/CategoryPills.tsx
new file mode 100644
index 0000000..be49b4b
--- /dev/null
+++ b/dripzone-app/src/components/store/CategoryPills.tsx
@@ -0,0 +1,48 @@
+'use client';
+
+import React from 'react';
+import { useBrand } from '@/context/BrandContext';
+
+interface CategoryPillsProps {
+ activeCategory: string;
+ onSelectCategory: (category: string) => void;
+}
+
+const CATEGORIES = [
+ { id: 'all', label: '🔥 Todas las Zapatillas' },
+ { id: 'Nike', label: '👟 Nike' },
+ { id: 'Jordan', label: '🏀 Air Jordan' },
+ { id: 'Adidas', label: '🛹 Adidas' },
+ { id: 'New Balance', label: '🌿 New Balance' },
+ { id: 'Puma', label: '🐆 Puma' },
+ { id: 'flash', label: '⚡ Ofertas Flash' },
+ { id: 'under120', label: '💰 Menos de $120k' },
+];
+
+export const CategoryPills: React.FC
+
+
+ {/* Header */}
+
+
+
+
+ {/* Items List */}
+
+
+
+
+
+
+
+ Tu Carrito • {currentBrand.shortName}
+{cartItems.length} {cartItems.length === 1 ? 'artículo' : 'artículos'}
+
+ {cartItems.length === 0 ? (
+
+
+ {/* Footer & Checkout Breakdown */}
+ {cartItems.length > 0 && (
+
+
+ ) : (
+ cartItems.map((item, idx) => (
+
+
+ Tu carrito está vacío
++ Aprovecha las ofertas de calzado con pago contraentrega en Cali y despachos nacionales. +
+ +
+
+
+ ))
+ )}
+
+
+
+
+
+
+
+ + {item.product.name} +
+ +
+
+ Talla {item.selectedSize}
+
+
+ {item.product.brand}
+
+
+
+
+ {formatCOP(item.product.retailPrice * item.quantity)}
+
+
+
+
+ {item.quantity}
+
+
+
+ {/* City Delivery selector pill */}
+
+ )}
+
+
+
+ {/* Price Calculations */}
+
+
+
+
+
+
+ {/* Separation Highlight Banner */}
+
+ Subtotal:
+ {formatCOP(subtotal)}
+
+
+ Costo de Envío:
+
+ {shippingCost === 0 ? Gratis : formatCOP(shippingCost)}
+
+
+
+ Total de la Orden:
+
+ {formatCOP(totalAmount)}
+
+
+
+
+
+ {/* Action Buttons */}
+
+
+ Separas con {formatCOP(separation.depositAmount)} y pagas {formatCOP(separation.balanceDue)} al recibir contraentrega en tu casa. +
++ 🛡️ {selectedCity.firstExchangeFree + ? `1er Cambio de Talla 100% GRATIS en ${selectedCity.name}` + : `Garantía de cambio en ${selectedCity.name} (flete asumido por cliente)`} +
+
+
+ Proceder al Pago Contraentrega
+
+
+ {CATEGORIES.map((cat) => {
+ const isActive = activeCategory === cat.id;
+ return (
+
+ );
+ })}
+
+ );
+};
diff --git a/dripzone-app/src/components/store/CitySelectorModal.tsx b/dripzone-app/src/components/store/CitySelectorModal.tsx
new file mode 100644
index 0000000..200d468
--- /dev/null
+++ b/dripzone-app/src/components/store/CitySelectorModal.tsx
@@ -0,0 +1,109 @@
+'use client';
+
+import React from 'react';
+import { X, MapPin, Check, Truck } from 'lucide-react';
+import { City } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+interface CitySelectorModalProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cities: City[];
+ selectedCity: City;
+ onSelectCity: (city: City) => void;
+}
+
+export const CitySelectorModal: React.FC
+
+ );
+};
diff --git a/dripzone-app/src/components/store/FlashDealsBanner.tsx b/dripzone-app/src/components/store/FlashDealsBanner.tsx
new file mode 100644
index 0000000..e26b007
--- /dev/null
+++ b/dripzone-app/src/components/store/FlashDealsBanner.tsx
@@ -0,0 +1,83 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Zap, Clock, Gift } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+export const FlashDealsBanner: React.FC = () => {
+ const { currentBrand } = useBrand();
+ const [timeLeft, setTimeLeft] = useState({ hours: 4, minutes: 27, seconds: 15 });
+
+ useEffect(() => {
+ const timer = setInterval(() => {
+ setTimeLeft((prev) => {
+ if (prev.seconds > 0) {
+ return { ...prev, seconds: prev.seconds - 1 };
+ } else if (prev.minutes > 0) {
+ return { ...prev, minutes: 59, seconds: 59 };
+ } else if (prev.hours > 0) {
+ return { hours: prev.hours - 1, minutes: 59, seconds: 59 };
+ }
+ return { hours: 5, minutes: 59, seconds: 59 };
+ });
+ }, 1000);
+ return () => clearInterval(timer);
+ }, []);
+
+ const pad = (n: number) => n.toString().padStart(2, '0');
+
+ return (
+
+ {/* Header */}
+
+
+
+
+ {/* City list */}
+
+
+
+
+
+
+
+ Selecciona tu Ciudad
+Calculamos tiempos y tarifas oficiales
+
+ {cities
+ .filter((c) => c.isActive !== false)
+ .map((city) => {
+ const isSelected = selectedCity.id === city.id;
+ const hasCod = city.allowsContraentrega || city.allowCod;
+
+ return (
+
+
+ {/* Info footer */}
+ {
+ onSelectCity(city);
+ onClose();
+ }}
+ className={`p-3 rounded-2xl border transition-all cursor-pointer flex items-center justify-between ${
+ isSelected
+ ? 'border-purple-400 bg-purple-950/50 shadow-[0_0_15px_rgba(168,85,247,0.2)]'
+ : 'border-neutral-800 hover:border-neutral-700 bg-neutral-950'
+ }`}
+ >
+
+ );
+ })}
+
+
+
+
+ {city.name}
+ {hasCod && (
+
+ Contraentrega
+
+ )}
+
+
+
+
+ {city.shippingCost === 0 ? (
+ Gratis
+ ) : (
+ formatCOP(city.shippingCost)
+ )}
+
+ {isSelected && (
+
+
+
+ )}
+
+ 💡 En Cali y zona metropolitana: entregas el mismo día con mensajería directa y pago contraentrega.
+
+
+ {/* Background glow meshes */}
+
+
+
+
+ );
+};
diff --git a/dripzone-app/src/components/store/Navbar.tsx b/dripzone-app/src/components/store/Navbar.tsx
new file mode 100644
index 0000000..67afae7
--- /dev/null
+++ b/dripzone-app/src/components/store/Navbar.tsx
@@ -0,0 +1,152 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { ShoppingBag, Search, MapPin, Zap, Sparkles, ShieldCheck, Store, User as UserIcon } from 'lucide-react';
+import { City } from '@/types';
+import { useBrand } from '@/context/BrandContext';
+import { useAuth } from '@/context/AuthContext';
+
+interface NavbarProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+ searchQuery: string;
+ onSearchChange: (q: string) => void;
+}
+
+export const Navbar: React.FC
+ {/* Left text */}
+
+
+
+
+ {/* Right Countdown Box */}
+
+
+ + Zapatillas Premium hasta con{' '} + + 35% OFF + +
++ Lanzamientos exclusivos directos de bodega. Separa tu par con $10.000 COP y paga el saldo en efectivo o transferencia con Pago Contraentrega en tu casa. +
+
+
+
+
+
+
+
+ {pad(timeLeft.hours)}
+ Horas
+
+ :
+
+ {pad(timeLeft.minutes)}
+ Min
+
+ :
+
+ {pad(timeLeft.seconds)}
+ Seg
+
+
+
+
+
+
+ {/* Main Navbar */}
+
+
+
+
+
+
+
+
+ {/* Brand Logo */}
+
+
+
+
+
+
+ {currentBrand.logo.iconText}
+
+
+
+
+
+
+ {/* City Selector Pill */}
+
+
+ {/* Search Bar */}
+
+ {currentBrand.logo.mainText}
+
+ {currentBrand.logo.accentText}
+
+
+ {currentBrand.tagline}
+
+
+
+ {/* Right Actions */}
+
+ onSearchChange(e.target.value)}
+ className="w-full bg-neutral-900/90 text-white placeholder-neutral-400 text-xs sm:text-sm rounded-full pl-10 pr-4 py-2 border border-neutral-700 focus:border-purple-400 focus:ring-2 focus:ring-purple-500/20 transition-all outline-hidden"
+ />
+
+
+ {/* User Auth Button */}
+
+
+ {/* Admin Link */}
+
+
+ onOpenDetail(product)}
+ className={`group rounded-2xl border transition-all duration-300 flex flex-col cursor-pointer overflow-hidden ${currentBrand.colors.cardBg}`}
+ >
+ {/* Image Container */}
+
+ );
+};
diff --git a/dripzone-app/src/components/store/ProductModal.tsx b/dripzone-app/src/components/store/ProductModal.tsx
new file mode 100644
index 0000000..3228c6e
--- /dev/null
+++ b/dripzone-app/src/components/store/ProductModal.tsx
@@ -0,0 +1,222 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, Star, Truck, ShieldCheck, Zap, MessageCircle, ShoppingBag, Check } from 'lucide-react';
+import { Product, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface ProductModalProps {
+ product: Product | null;
+ onClose: () => void;
+ onAddToCart: (product: Product, size: string) => void;
+ selectedCity: City;
+}
+
+export const ProductModal: React.FC
+
+
+ {/* Badges */}
+
+
+ {/* Product Info */}
+
+
+ -{discountPercent}% OFF
+
+ {product.isFlashDeal && (
+
+
+
+
+
+
+
+
+
+ {/* Rating and Sales */}
+
+
+ {/* Pricing & Separation terms */}
+
+
+
+ {/* Product Title */}
+
+
+
+ +{product.salesCount || 150} pedidos
+
+ + {product.name} +
+ + {/* Available Sizes Pills */} +
+ Tallas:
+ {product.sizes.slice(0, 5).map((size) => (
+
+ {size}
+
+ ))}
+ {product.sizes.length > 5 && (
+ +{product.sizes.length - 5}
+ )}
+
+
+
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ + ⚡ Separa con {formatCOP(separation.depositAmount)} y cancelas {formatCOP(separation.balanceDue)} al recibir. +
+ + {/* Quick Action Button */} +
+
+
+
+
+ );
+};
diff --git a/dripzone-app/src/config/brands.ts b/dripzone-app/src/config/brands.ts
new file mode 100644
index 0000000..570a2f5
--- /dev/null
+++ b/dripzone-app/src/config/brands.ts
@@ -0,0 +1,151 @@
+export type BrandId = 'almeira' | 'sneaky' | 'zapply' | 'dripzone';
+
+export interface BrandTheme {
+ id: BrandId;
+ name: string;
+ shortName: string;
+ tagline: string;
+ badge: string;
+ couponCode: string;
+ whatsappNumber: string;
+
+ // Clases y colores de diseño personalizados para cada una de las 4 marcas
+ colors: {
+ primaryGradient: string;
+ secondaryGradient: string;
+ heroGradient: string;
+ accentGlow: string;
+ headerBg: string;
+ bodyBg: string;
+ cardBg: string;
+ border: string;
+ textAccent: string;
+ badgeBg: string;
+ badgeText: string;
+ cartBadge: string;
+ };
+
+ logo: {
+ iconText: string;
+ mainText: string;
+ accentText: string;
+ };
+}
+
+export const BRANDS: Record
+ {/* Close Button */}
+
+
+ {/* Left: Images */}
+
+
+
+
+ {/* Right: Product Details & Actions */}
+
+
+
+ -{Math.round(((product.originalPrice || 170000) - product.retailPrice) / (product.originalPrice || 170000) * 100)}% OFF
+
+
+
+ {/* Thumbnails */}
+ {product.images.length > 1 && (
+
+ {product.images.map((img, i) => (
+
+ ))}
+
+ )}
+
+ {/* Trust note */}
+
+
+
+
+
+
+
+ {/* Action Buttons */}
+
+ {product.brand}
+
+
+ {/* Price Box */}
+ {product.name}
+
+
+
+
+ •
+ +{product.salesCount || 200} pares entregados
+
+
+
+ {/* Size Selector */}
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ {/* Separation breakdown banner */}
+
+
+
+
+ Separas con solo {formatCOP(separation.depositAmount)} y pagas los {formatCOP(separation.balanceDue)} al recibir en tu puerta. +
+
+
+
+ {/* Description */}
+
+ Selecciona tu Talla (Nacional CO):
+ Guía de Tallas
+
+
+ {product.sizes.map((size) => (
+
+ ))}
+
+
+
+
+ {/* Shipping note */}
+ {product.description}
+
+
+
+ {selectedCity.name}:
+ {selectedCity.deliveryTime} ({selectedCity.shippingCost === 0 ? 'Envío Gratis' : formatCOP(selectedCity.shippingCost)})
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/configuracion/page.tsx b/sneaky-app/src/app/admin/configuracion/page.tsx
new file mode 100644
index 0000000..d3a2a8f
--- /dev/null
+++ b/sneaky-app/src/app/admin/configuracion/page.tsx
@@ -0,0 +1,352 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Store, Mail, Phone, MessageCircle, Instagram, MapPin, CreditCard, Save, CheckCircle2, DollarSign, Percent, ShieldCheck, QrCode, ExternalLink, Zap } from 'lucide-react';
+import { StoreSettings } from '@/types';
+
+export default function AdminSettingsPage() {
+ const [settings, setSettings] = useState
+
+
+
+
+ {message && (
+
+
+ + Administra las tarifas de envío, tiempos de entrega y configura si el 1er cambio de talla es gratis o si el cliente asume el flete para cada ciudad. +
+
+ {message}
+
+
+ )}
+
+ {/* Add New City Card */}
+
+
+ {/* Cities List */}
+
+
+ Ciudades y Zonas Registradas ({cities.length})
+ +
+ {cities.map((city) => (
+
+
+
+ ))}
+
+
+
+ {/* Actions & Policy Toggle */}
+
+ {city.name}
+ ({city.department})
+ {city.allowsContraentrega ? (
+
+ Contraentrega Activo
+
+ ) : (
+
+ Solo Despacho Nacional
+
+ )}
+
+
+
+ {/* 1st Exchange Free Toggle Button */}
+
+
+ {/* Shipping cost edit */}
+
+
+ Flete:
+ handleUpdateShipping(city.id, parseInt(e.target.value, 10) || 0)}
+ className="w-20 bg-transparent text-xs font-bold text-white outline-hidden text-right"
+ />
+ COP
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/feed-whatsapp/page.tsx b/sneaky-app/src/app/admin/feed-whatsapp/page.tsx
new file mode 100644
index 0000000..a1866cb
--- /dev/null
+++ b/sneaky-app/src/app/admin/feed-whatsapp/page.tsx
@@ -0,0 +1,365 @@
+'use client';
+
+import React, { useState } from 'react';
+import { Radio, Sparkles, Share2, AlertTriangle, ShieldCheck, Plus, Send, Layers } from 'lucide-react';
+import { SupplierPost, Product } from '@/types';
+import { INITIAL_SUPPLIER_POSTS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { checkProductDuplicate } from '@/lib/deduplication-engine';
+import { formatCOP } from '@/lib/pricing-engine';
+import { BRANDS, BrandId } from '@/config/brands';
+
+export default function SupplierFeedPage() {
+ const [posts, setPosts] = useState
+
+
+
+
+ {toast && (
+
+
+ + Configura los datos oficiales del negocio: WhatsApp oficial de atención, correo electrónico, pasarela Bold.co (Link de pago, QR y botón), Nequi, Daviplata y reglas de margen. +
+
+ {toast}
+
+
+ )}
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/grupos-whatsapp/page.tsx b/sneaky-app/src/app/admin/grupos-whatsapp/page.tsx
new file mode 100644
index 0000000..63914e2
--- /dev/null
+++ b/sneaky-app/src/app/admin/grupos-whatsapp/page.tsx
@@ -0,0 +1,585 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import {
+ MessageSquare,
+ RefreshCw,
+ Search,
+ CheckCircle2,
+ XCircle,
+ ShieldCheck,
+ Zap,
+ Radio,
+ Sliders,
+ Users,
+ Sparkles,
+ ExternalLink,
+ Plus,
+ ArrowUpRight,
+ Filter,
+ CheckSquare,
+ Square,
+ X
+} from 'lucide-react';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+export default function AdminWhatsAppGroupsPage() {
+ const [groups, setGroups] = useState
+
+
+ {actionMessage && (
+
+
+
+
+
+ {/* Target Brand Selector Pill Bar */}
+
+
+ + Recepción automática con IA, prevención de duplicados y distribución hacia las 4 marcas (Almeira Store, Sneaky, Zapply, DripZone). +
+
+
+
+
+ {actionMessage}
+
+
+ )}
+
+ {/* Live Simulator for Test Messages */}
+
+
+
+ {/* Intercepted Posts Feed */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ setTestText(e.target.value)}
+ className="flex-1 bg-slate-950 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ Mensajes Procesados Recientemente
+ +
+ {posts.map((post) => {
+ const extracted = post.extractedProduct;
+ const duplicateCheck = extracted
+ ? checkProductDuplicate(
+ {
+ name: extracted.name,
+ brand: extracted.brand,
+ sizes: extracted.sizes,
+ supplierPrice: extracted.supplierPrice,
+ },
+ products
+ )
+ : null;
+
+ return (
+
+
+ {/* Header of post */}
+
+ );
+ })}
+
+
+
+ {/* Content Grid */}
+
+
+ {post.channelName || 'Canal Mayorista'}
+
+ {post.receivedAt}
+
+
+ {/* Anti-Duplicate Status Badge */}
+ {duplicateCheck && (
+
+ {duplicateCheck.isDuplicate ? (
+ <>
+
+ )}
+
+ {/* Left: Raw WhatsApp Message (5 cols) */}
+
+
+ Mensaje de Entrada:
+
+
+ {/* Right: AI Extracted & Pricing Calculation (7 cols) */}
+ + {post.rawMessage} +
+ {post.rawImages.length > 0 && ( +
+
+
+ )}
+
+ {extracted ? (
+
+
+
+ ) : (
+
+
+
+ {/* Pricing breakdown */}
+
+
+ {extracted.brand} • {extracted.category}
+
+
+
+ IA: {Math.round(extracted.confidence * 100)}% certeza
+
+ {extracted.name}
+
+
+
+ {/* Sizes */}
+
+ Costo Base:
+
+ {formatCOP(extracted.supplierPrice)}
+
+
+
+ Precio Venta (+ Margen):
+
+ {formatCOP(extracted.suggestedRetailPrice)}
+
+
+
+
+ Tallas extraídas:
+
+
+
+ {/* Duplicate warning note */}
+ {duplicateCheck?.isDuplicate && (
+
+ {extracted.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+
+ {duplicateCheck.message}
+
+ )}
+
+ {/* Actions */}
+
+
+
+
+
+ Extrayendo datos...
+ )} +
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/layout.tsx b/sneaky-app/src/app/admin/layout.tsx
new file mode 100644
index 0000000..34e4e73
--- /dev/null
+++ b/sneaky-app/src/app/admin/layout.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import {
+ LayoutDashboard,
+ Radio,
+ Package,
+ MapPin,
+ CreditCard,
+ ShoppingBag,
+ ArrowLeft,
+ Sparkles,
+ Store,
+ Users,
+ MessageSquare,
+} from 'lucide-react';
+
+export default function AdminLayout({ children }: { children: React.ReactNode }) {
+ const pathname = usePathname();
+
+ const NAV_ITEMS = [
+ { href: '/admin', label: 'Resumen & KPIs', icon: LayoutDashboard },
+ { href: '/admin/grupos-whatsapp', label: 'Grupos WhatsApp', icon: MessageSquare, badge: 'Monitoreo 24/7' },
+ { href: '/admin/usuarios', label: 'Control de Usuarios', icon: Users, badge: 'Roles & Accesos' },
+ { href: '/admin/configuracion', label: 'Datos de la Tienda', icon: Store },
+ { href: '/admin/feed-whatsapp', label: 'Feed WhatsApp & IA', icon: Radio, badge: 'Anti-Duplicados' },
+ { href: '/admin/productos', label: 'Catálogo de Zapatillas', icon: Package },
+ { href: '/admin/ciudades', label: 'Ciudades & Fletes', icon: MapPin },
+ { href: '/admin/metodos-pago', label: 'Medios de Pago & Anticipos', icon: CreditCard },
+ { href: '/admin/pedidos', label: 'Pedidos & Logística', icon: ShoppingBag },
+ ];
+
+ return (
+
+
+
+ {/* Toast Notification */}
+ {toast && (
+
+
+
+
+
+ {/* Big Search and Select Button */}
+
+
+
+ + Busca y selecciona los grupos de proveedores que el bot de Evolution API & Gemini debe escuchar 24/7 para auto-publicar zapatillas. +
+
+ {toast}
+
+
+ )}
+
+ {/* Stats Bar */}
+
+
+
+ {/* Filter and Search Toolbar */}
+
+
+
+
+
+ Grupos en tu WhatsApp
+{groups.length}
+
+
+
+
+
+
+
+ Grupos Monitoreados (Activos)
+{monitoredCount}
+
+
+
+
+
+
+ Evolution API (WhatsApp)
++ + AutomataAlmeira (En línea) +
+
+
+
+
+
+ {/* Active Monitored Groups List */}
+
+
+
+
+
+
+
+
+
+ {isLoading ? (
+
+
+ {/* ========================================================= */}
+ {/* MODAL: Group Picker (Buscar y Seleccionar Grupos) */}
+ {/* ========================================================= */}
+ {isPickerOpen && (
+
+
+ ) : filteredGroups.length === 0 ? (
+ Cargando grupos de proveedores...
+
+
+ ) : (
+ filteredGroups.map((group) => {
+ const isMonitored = group.isMonitored;
+
+ return (
+ No tienes grupos seleccionados para monitorear.
+ +
+ {/* Header */}
+
+ );
+ })
+ )}
+
+
+
+ {/* Info Pills */}
+
+
+
+ {/* Toggle Switch */}
+
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+
+
+ {group.notes && (
+
+ Margen Aplicado
+
+ +{group.profitMarginOverride || 35}% (Redondeo a $5.000)
+
+
+
+
+ Modo de Ingreso
+
+
+ + ℹ️ {group.notes} +
+ )} + + {/* Action footer */} +
+
+ {group.participantsCount ? `👥 ${group.participantsCount} miembros` : 'Canal Mayorista'}
+
+
+
+
+
+
+ )}
+
+ {/* Modal Header */}
+
+
+
+
+ {/* Search and Action Toolbar in Modal */}
+
+
+
+
+
+
+
+ Seleccionar Grupos de WhatsApp
++ Marca los grupos que deseas monitorear con IA para auto-publicar calzado. +
+
+
+
+ {/* Groups Scrollable List */}
+
+
+
+
+
+ Mostrando {filteredPickerGroups.length} grupos encontrados
+
+
+
+
+ •
+
+
+
+ {isLoadingLive ? (
+
+
+ {/* Modal Footer */}
+
+
+ ) : filteredPickerGroups.length === 0 ? (
+ Consultando grupos en vivo desde Evolution API...
+Conectando con WhatsApp...
+
+
+ ) : (
+ filteredPickerGroups.map((group) => {
+ const isSelected = selectedJids.has(group.jid);
+
+ return (
+ No se encontraron grupos con el término "{pickerSearch}".
+ handleToggleSelectJid(group.jid)}
+ className={`p-3.5 rounded-2xl border transition-all cursor-pointer flex items-center justify-between gap-3 ${
+ isSelected
+ ? 'bg-orange-950/30 border-orange-500/50 shadow-md ring-1 ring-orange-500/20'
+ : 'bg-zinc-950 border-zinc-800 hover:border-zinc-700'
+ }`}
+ >
+
+ );
+ })
+ )}
+
+
+
+
+ {isSelected &&
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+ {isSelected ? (
+
+ Monitorear
+
+ ) : (
+
+ Ignorar
+
+ )}
+
+
+
+
+ Seleccionados:
+ {selectedJids.size}
+ grupos para monitorear
+
+
+
+
+
+
+
+ {/* Sidebar */}
+
+
+ {/* Main Content Area */}
+
+ {children}
+
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/metodos-pago/page.tsx b/sneaky-app/src/app/admin/metodos-pago/page.tsx
new file mode 100644
index 0000000..5f02d93
--- /dev/null
+++ b/sneaky-app/src/app/admin/metodos-pago/page.tsx
@@ -0,0 +1,163 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { CreditCard, Zap, Save, Check, ShieldCheck, QrCode } from 'lucide-react';
+import { PaymentMethod } from '@/types';
+import { INITIAL_PAYMENT_METHODS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminPaymentMethodsPage() {
+ const [methods, setMethods] = useState
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/page.tsx b/sneaky-app/src/app/admin/page.tsx
new file mode 100644
index 0000000..8d400b5
--- /dev/null
+++ b/sneaky-app/src/app/admin/page.tsx
@@ -0,0 +1,159 @@
+'use client';
+
+import React, { useState } from 'react';
+import Link from 'next/link';
+import { Package, Radio, MapPin, Zap, CheckCircle2, ArrowUpRight, Sparkles } from 'lucide-react';
+import { INITIAL_PRODUCTS, INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_SUPPLIER_POSTS } from '@/lib/data-service';
+
+export default function AdminDashboardPage() {
+ const [productsCount] = useState(INITIAL_PRODUCTS.length);
+ const [postsCount] = useState(INITIAL_SUPPLIER_POSTS.length);
+ const [citiesCount] = useState(INITIAL_CITIES.length);
+
+ return (
+
+
+
+
+
+ {message && (
+
+
+ + Habilita métodos de pago, configura el valor de separación de $10.000 COP y personaliza los datos de Nequi / Daviplata. +
+
+ {message}
+
+
+ )}
+
+ {/* Methods Cards */}
+
+ {methods.map((method) => (
+
+
+
+ ))}
+
+
+
+
+
+
+
+ {method.type === 'contraentrega' ?
+
+
+ {method.name}
+ Tipo: {method.type} +
+
+
+
+
+
+
+
+ handleUpdateField(method.id, 'name', e.target.value)}
+ className="w-full bg-zinc-900 border border-zinc-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ handleUpdateField(method.id, 'description', e.target.value)}
+ className="w-full bg-zinc-900 border border-zinc-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+ {method.requiresDeposit && (
+
+
+ handleUpdateField(method.id, 'depositAmount', parseInt(e.target.value, 10) || 0)}
+ className="w-full bg-zinc-900 border border-zinc-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden font-bold"
+ />
+
+ (El saldo restante se cobra contraentrega al recibir)
+
+
+ )}
+
+
+
+ handleUpdateField(method.id, 'accountInfo', e.target.value)}
+ className="w-full bg-zinc-900 border border-zinc-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ placeholder="Ej. Nequi / Daviplata: 316 745 5877"
+ />
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/pedidos/page.tsx b/sneaky-app/src/app/admin/pedidos/page.tsx
new file mode 100644
index 0000000..f28a975
--- /dev/null
+++ b/sneaky-app/src/app/admin/pedidos/page.tsx
@@ -0,0 +1,275 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { ShoppingBag, Truck, CheckCircle2, Clock, Phone, MapPin, Search, MessageCircle, Send, ShieldCheck, UserCheck } from 'lucide-react';
+import { Order, OrderItem } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminOrdersPage() {
+ const [orders, setOrders] = useState
+
+
+ {/* KPI Cards */}
+
+
+
+
+
+
+
+ + Automatización inteligente de calzado, publicaciones a Facebook y gestión de despachos. +
+
+
+
+
+
+
+ {/* Quick Actions & Automation Status */}
+
+
+
+
+ Zapatillas Activas
+
+ {productsCount}
+
+
+
+
+
+ Margen Promedio
+
+
+ +$30.000 COP
+
+ + (Costo: $90k ➔ Venta: $120k) +
+
+
+
+
+ Entradas Procesadas
+
+ {postsCount}
+ + IA Gemini + Anti-duplicados +
+
+
+
+ Ciudades Habilitadas
+
+ {citiesCount}
+ + Contraentrega activo en Cali +
+
+ {/* Left: WhatsApp Evolution API Status */}
+
+
+
+
+ {/* Right: Meta / Facebook Automation */}
+
+
+
+
+
+
+
+ Activo
+
+ Estado del Listener de WhatsApp
+
+
+
+
+ Ver últimos mensajes procesados
+
+ Instancia Evolution API:
+ AutomataAlmeira
+
+
+ Servidor:
+ evolution.almeira.com.co
+
+
+ Motor de Inteligencia Artificial:
+ Gemini 2.5 Flash
+
+
+ Filtro Anti-Duplicados:
+ Activo (>75% Similitud)
+
+
+
+
+
+
+ Publicador a Fanpage de Facebook
+ + Listo para Publicar + +
+
+
+
+ Publicar Producto de Prueba en Facebook
+ ✨ Plantilla de Copy Vendedor Integrada:
+
+ "✨ ALMEIRA STORE • NUEVA COLECCIÓN EXCLUSIVA ✨
+ 👟 NIKE DUNK LOW PANDA
+ 📏 Tallas: 37 a 43 | 💎 Precio: $120.000 COP
+ 🚚 ¡Entrega a Domicilio en Cali con Pago Contraentrega!"
+
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/productos/page.tsx b/sneaky-app/src/app/admin/productos/page.tsx
new file mode 100644
index 0000000..ae3a0de
--- /dev/null
+++ b/sneaky-app/src/app/admin/productos/page.tsx
@@ -0,0 +1,472 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Package, Plus, Eye, EyeOff, Check, X, Sparkles, Filter, Phone, MessageCircle, Truck } from 'lucide-react';
+import { Product, Supplier } from '@/types';
+import { INITIAL_PRODUCTS, INITIAL_SUPPLIERS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminProductsPage() {
+ const [products, setProducts] = useState
+
+
+
+
+ {/* Toolbar */}
+
+
+ + Control logístico de pedidos contraentrega, cobro de anticipos de $10.000 COP y notificación inmediata de separación al proveedor vía WhatsApp. +
+
+
+
+ {filteredOrders.length === 0 ? (
+
+
+
+
+
+
+
+
+ setSearch(e.target.value)}
+ className="w-full bg-gray-900 border border-gray-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-orange-500"
+ />
+
+
+
+ ) : (
+
+
+ No hay pedidos en esta sección
++ Cuando los clientes hagan un pedido en la tienda web o por WhatsApp, aparecerán aquí con el botón para separar inmediatamente con el proveedor correspondiente. +
+
+ {filteredOrders.map((order) => (
+
+ )}
+
+
+ ))}
+
+
+
+
+ Orden #{order.id}
+ • {new Date(order.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
+
+ {getStatusBadge(order.status)}
+
+
+
+
+
+ Cliente & Entrega (24 Horas)
+
+
+
+ {order.customerName}
+
+
+
+
+ Zapatillas & Proveedor Asignado:
+
+
+
+
+ {order.items.map((it, idx) => {
+ const suppName = it.supplierName || 'DIFUSION JOVIC STORE';
+ return (
+
+
+
+ );
+ })}
+
+
+
+
+
+
+
+ Prov: {suppName}
+
+ {it.productName}
++ Talla {it.size} • Cant: {it.quantity} +
+
+
+ Cobro & Pagos Contraentrega
+
+
+
+
+ + Total de la Orden: + {formatCOP(order.totalAmount)} +
+ {order.depositAmount > 0 ? ( + <> ++ Anticipo / Separación: + {formatCOP(order.depositAmount)} +
++ Saldo al Mensajero: + {formatCOP(order.balanceDue)} +
+ + ) : ( ++ 100% Contraentrega al recibir +
+ )} +
+ Método: {order.paymentMethodName}
+
+
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/admin/usuarios/page.tsx b/sneaky-app/src/app/admin/usuarios/page.tsx
new file mode 100644
index 0000000..3de18ca
--- /dev/null
+++ b/sneaky-app/src/app/admin/usuarios/page.tsx
@@ -0,0 +1,469 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Users, UserPlus, Shield, ShieldCheck, UserCheck, MessageCircle, Mail, Phone, MapPin, Eye, EyeOff, Trash2, Edit, Check, X } from 'lucide-react';
+import { User } from '@/types';
+
+export default function AdminUsersPage() {
+ const [users, setUsers] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Visualiza cada modelo con su proveedor asignado, costo mayorista y activa/inactiva publicaciones para la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* Filters & Search Toolbar */}
+
+ {/* Status filter pills */}
+
+
+ {/* Products Table */}
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-gray-900 border border-gray-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-orange-500"
+ />
+
+
+
+
+ {/* Modal Add Product */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado Publicación | +Producto | +Proveedor Asignado (Interno) | +Marca | +Costo Base | +Precio Venta | +Margen Ganancia | +Tallas | +
|---|---|---|---|---|---|---|---|
| + No hay zapatillas que coincidan con el filtro seleccionado. + | +|||||||
| + + | + + {/* Product Name & Image */} +
+
+
+ {prod.name} + {prod.category} + |
+
+ {/* Supplier Column */}
+
+
+
+ 🏢 {suppName}
+
+
+
+ |
+
+ {prod.brand} | +{formatCOP(prod.supplierPrice)} | +{formatCOP(prod.retailPrice)} | + ++ + +{formatCOP(margin)} + + | + +
+
+ {prod.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+ |
+
+
+ )}
+
+
+ Registrar Nueva Zapatilla
+ + +
+ {/* Header */}
+
+ );
+}
diff --git a/sneaky-app/src/app/api/auth/login/route.ts b/sneaky-app/src/app/api/auth/login/route.ts
new file mode 100644
index 0000000..a2ae66e
--- /dev/null
+++ b/sneaky-app/src/app/api/auth/login/route.ts
@@ -0,0 +1,29 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function POST(request: Request) {
+ try {
+ const { identifier } = await request.json();
+ if (!identifier) {
+ return NextResponse.json({ success: false, error: 'Ingresa tu correo o celular' }, { status: 400 });
+ }
+ const user = dataService.authenticate(identifier);
+ if (!user) {
+ return NextResponse.json(
+ { success: false, error: 'Usuario no encontrado. Verifica tu correo o celular.' },
+ { status: 404 }
+ );
+ }
+ if (!user.isActive) {
+ return NextResponse.json(
+ { success: false, error: 'Esta cuenta se encuentra inactiva. Contacta a soporte.' },
+ { status: 403 }
+ );
+ }
+
+ dataService.updateUser(user.id, { lastLogin: 'Justo ahora' });
+ return NextResponse.json({ success: true, user });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/auth/register/route.ts b/sneaky-app/src/app/api/auth/register/route.ts
new file mode 100644
index 0000000..62b2a63
--- /dev/null
+++ b/sneaky-app/src/app/api/auth/register/route.ts
@@ -0,0 +1,42 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function POST(request: Request) {
+ try {
+ const { name, email, phone, city, address } = await request.json();
+ if (!name || !email || !phone) {
+ return NextResponse.json(
+ { success: false, error: 'Nombre, correo y celular son obligatorios' },
+ { status: 400 }
+ );
+ }
+
+ const existing = dataService.authenticate(email) || dataService.authenticate(phone);
+ if (existing) {
+ return NextResponse.json(
+ { success: false, error: 'Ya existe una cuenta con este correo o celular' },
+ { status: 409 }
+ );
+ }
+
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name,
+ email,
+ phone,
+ city: city || 'Cali',
+ address: address || '',
+ role: 'customer',
+ isActive: true,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ lastLogin: 'Justo ahora',
+ };
+
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/cities/route.ts b/sneaky-app/src/app/api/cities/route.ts
new file mode 100644
index 0000000..3ecd601
--- /dev/null
+++ b/sneaky-app/src/app/api/cities/route.ts
@@ -0,0 +1,27 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const cities = dataService.getCities();
+ return NextResponse.json({ success: true, cities });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateCity(id, updates);
+ return NextResponse.json({ success: true, city: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const created = dataService.addCity(body);
+ return NextResponse.json({ success: true, city: created });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/orders/route.ts b/sneaky-app/src/app/api/orders/route.ts
new file mode 100644
index 0000000..9c996b6
--- /dev/null
+++ b/sneaky-app/src/app/api/orders/route.ts
@@ -0,0 +1,30 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { sendWhatsAppMessage, buildOrderConfirmationMessage } from '@/lib/evolution-api';
+
+export async function GET() {
+ const orders = dataService.getOrders();
+ return NextResponse.json({ success: true, orders });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newOrder = dataService.createOrder(body);
+
+ // Enviar confirmación por WhatsApp en background si tiene teléfono válido
+ if (newOrder.customerPhone) {
+ try {
+ const msg = buildOrderConfirmationMessage(newOrder);
+ // Intentar enviar WhatsApp
+ await sendWhatsAppMessage(newOrder.customerPhone, msg);
+ } catch (waErr) {
+ console.warn('No se pudo enviar WhatsApp automático:', waErr);
+ }
+ }
+
+ return NextResponse.json({ success: true, order: newOrder });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/payment-methods/route.ts b/sneaky-app/src/app/api/payment-methods/route.ts
new file mode 100644
index 0000000..b49c62d
--- /dev/null
+++ b/sneaky-app/src/app/api/payment-methods/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const methods = dataService.getPaymentMethods();
+ return NextResponse.json({ success: true, paymentMethods: methods });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updatePaymentMethod(id, updates);
+ return NextResponse.json({ success: true, paymentMethod: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/products/route.ts b/sneaky-app/src/app/api/products/route.ts
new file mode 100644
index 0000000..9ebf898
--- /dev/null
+++ b/sneaky-app/src/app/api/products/route.ts
@@ -0,0 +1,46 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET(request: Request) {
+ const { searchParams } = new URL(request.url);
+ const includeAll = searchParams.get('all') === 'true';
+
+ let products = dataService.getProducts();
+ if (!includeAll) {
+ products = products.filter((p) => p.isActive !== false);
+ }
+
+ return NextResponse.json({ success: true, products });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newProduct = dataService.addProduct({
+ ...body,
+ isActive: body.isActive !== undefined ? body.isActive : true,
+ });
+ return NextResponse.json({ success: true, product: newProduct });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const { id, updates } = body;
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID de producto requerido' }, { status: 400 });
+ }
+
+ const updated = dataService.updateProduct(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Producto no encontrado' }, { status: 404 });
+ }
+
+ return NextResponse.json({ success: true, product: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/publish/facebook/route.ts b/sneaky-app/src/app/api/publish/facebook/route.ts
new file mode 100644
index 0000000..d2db7a3
--- /dev/null
+++ b/sneaky-app/src/app/api/publish/facebook/route.ts
@@ -0,0 +1,12 @@
+import { NextResponse } from 'next/server';
+import { publishToFacebookPage } from '@/lib/facebook-publisher';
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const result = await publishToFacebookPage(body);
+ return NextResponse.json(result);
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/sneaky-app/src/app/api/settings/route.ts b/sneaky-app/src/app/api/settings/route.ts
new file mode 100644
index 0000000..6073d91
--- /dev/null
+++ b/sneaky-app/src/app/api/settings/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const settings = dataService.getSettings();
+ return NextResponse.json({ success: true, settings });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const updated = dataService.updateSettings(body);
+ return NextResponse.json({ success: true, settings: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/users/route.ts b/sneaky-app/src/app/api/users/route.ts
new file mode 100644
index 0000000..8b62fad
--- /dev/null
+++ b/sneaky-app/src/app/api/users/route.ts
@@ -0,0 +1,57 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function GET() {
+ const users = dataService.getUsers();
+ return NextResponse.json({ success: true, users });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name: body.name,
+ email: body.email,
+ phone: body.phone,
+ city: body.city || 'Cali',
+ address: body.address || '',
+ role: body.role || 'customer',
+ isActive: body.isActive !== false,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ };
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateUser(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Usuario no encontrado' }, { status: 404 });
+ }
+ return NextResponse.json({ success: true, user: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function DELETE(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const id = searchParams.get('id');
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID requerido' }, { status: 400 });
+ }
+ const deleted = dataService.deleteUser(id);
+ return NextResponse.json({ success: deleted });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/sneaky-app/src/app/api/webhook/whatsapp/route.ts b/sneaky-app/src/app/api/webhook/whatsapp/route.ts
new file mode 100644
index 0000000..ae1555b
--- /dev/null
+++ b/sneaky-app/src/app/api/webhook/whatsapp/route.ts
@@ -0,0 +1,163 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { parseSupplierMessage } from '@/lib/gemini-parser';
+import { SupplierPost, Product } from '@/types';
+import { calculateRetailPrice } from '@/lib/pricing-engine';
+
+export async function GET() {
+ const posts = dataService.getSupplierPosts();
+ const settings = dataService.getSettings();
+ return NextResponse.json({
+ success: true,
+ autoPublishEnabled: settings.autoPublishSupplierPosts ?? true,
+ postsCount: posts.length,
+ posts,
+ });
+}
+
+export async function POST(request: Request) {
+ try {
+ const payload = await request.json();
+ console.log('📥 [WhatsApp Webhook] Mensaje recibido:', JSON.stringify(payload).slice(0, 300));
+
+ const data = payload.data || payload;
+ const settings = dataService.getSettings();
+
+ // 1. Extraer texto del mensaje de WhatsApp
+ const messageContent =
+ data.message?.conversation ||
+ data.message?.extendedTextMessage?.text ||
+ data.message?.imageMessage?.caption ||
+ data.text ||
+ '';
+
+ // 2. Extraer nombre del canal o grupo
+ const senderPhone = data.key?.remoteJid?.replace(/\D/g, '') || '';
+ const isGroup = data.key?.remoteJid?.includes('g.us');
+ const channelName =
+ data.groupInfo?.subject ||
+ data.pushName ||
+ (isGroup ? 'Grupo Mayorista WhatsApp' : 'Chat Proveedor Directo');
+
+ if (!messageContent || messageContent.trim().length < 6) {
+ return NextResponse.json({
+ success: true,
+ ignored: 'Mensaje sin texto suficiente para extraer calzado.',
+ });
+ }
+
+ // 3. Buscar proveedor asociado por teléfono o grupo
+ const suppliers = dataService.getSuppliers();
+ const matchedSupplier = suppliers.find(
+ (s) =>
+ s.phone.includes(senderPhone) ||
+ (channelName && s.name.toLowerCase().includes(channelName.toLowerCase())) ||
+ (channelName && channelName.toLowerCase().includes(s.name.toLowerCase()))
+ );
+
+ const supplierName = matchedSupplier?.name || channelName;
+ const supplierPhone = matchedSupplier?.phone || senderPhone || '573167455877';
+
+ // 4. Procesar y extraer información con Gemini AI
+ const extracted = await parseSupplierMessage(messageContent);
+
+ // Recalcular precio con el margen y redondeo al $5.000 oficial
+ const finalRetailPrice = calculateRetailPrice(
+ extracted.supplierPrice,
+ settings.defaultProfitMargin || 35
+ );
+
+ // Extraer imágenes (si Evolution API envió imagen adjunta o usar fotos de alta resolución)
+ const images: string[] = [];
+ if (data.message?.imageMessage?.url) {
+ images.push(data.message.imageMessage.url);
+ } else {
+ images.push(
+ 'https://images.unsplash.com/photo-1595950653106-6c9ebd614d3a?auto=format&fit=crop&w=800&q=80'
+ );
+ }
+
+ // 5. Verificar Anti-Duplicados en el Catálogo
+ const existingProducts = dataService.getProducts();
+ const duplicateProduct = existingProducts.find(
+ (p) => p.name.toLowerCase() === extracted.name.toLowerCase()
+ );
+
+ let registeredProduct: Product | null = null;
+ const autoPublish = settings.autoPublishSupplierPosts ?? true;
+
+ if (autoPublish) {
+ if (duplicateProduct) {
+ // Actualizar stock y tallas existentes sin duplicar
+ const mergedSizes = Array.from(new Set([...duplicateProduct.sizes, ...extracted.sizes]));
+ registeredProduct = dataService.updateProduct(duplicateProduct.id, {
+ supplierPrice: extracted.supplierPrice,
+ retailPrice: finalRetailPrice,
+ sizes: mergedSizes,
+ inStock: true,
+ isActive: true,
+ supplierName,
+ supplierPhone,
+ });
+ console.log(`🔄 [Auto-Sync] Zapatilla "${extracted.name}" actualizada en catálogo (Anti-Duplicados).`);
+ } else {
+ // Registrar y publicar automáticamente
+ registeredProduct = dataService.addProduct({
+ name: extracted.name,
+ brand: extracted.brand,
+ supplierPrice: extracted.supplierPrice,
+ retailPrice: finalRetailPrice,
+ originalPrice: Math.round(finalRetailPrice * 1.35),
+ sizes: extracted.sizes,
+ images,
+ description: `Zapatillas ${extracted.brand} ${extracted.name} garantizadas. Calidad seleccionada con horma nacional y suela antideslizante.`,
+ category: extracted.category || 'Sneakers / Urbano',
+ inStock: true,
+ isActive: true,
+ isFlashDeal: true,
+ rating: 4.9,
+ reviewsCount: 15,
+ salesCount: 30,
+ originBadge: 'Bodega Mayorista',
+ supplierId: matchedSupplier?.id || 'sup-auto',
+ supplierName,
+ supplierPhone,
+ });
+ console.log(`✨ [Auto-Publish] Nueva zapatilla "${extracted.name}" publicada automáticamente en tienda.`);
+ }
+ }
+
+ // 6. Registrar en el historial de publicaciones recibidas
+ const newPost: SupplierPost = {
+ id: `post-${Date.now()}`,
+ channelName,
+ supplierName,
+ supplierPhone,
+ rawMessage: messageContent,
+ rawImages: images,
+ extractedProduct: {
+ ...extracted,
+ suggestedRetailPrice: finalRetailPrice,
+ supplierName,
+ supplierPhone,
+ },
+ status: autoPublish ? 'published_store' : 'pending_review',
+ receivedAt: 'Justo ahora',
+ };
+
+ dataService.addSupplierPost(newPost);
+
+ return NextResponse.json({
+ success: true,
+ autoPublished: autoPublish,
+ product: registeredProduct,
+ post: newPost,
+ message: autoPublish
+ ? `🔥 ¡Zapatilla "${extracted.name}" procesada y publicada AUTOMÁTICAMENTE en la tienda!`
+ : `Mensaje ingresado al feed para aprobación manual.`,
+ });
+ } catch (error: any) {
+ console.error('Error procesando webhook de WhatsApp:', error);
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/sneaky-app/src/app/api/whatsapp-groups/route.ts b/sneaky-app/src/app/api/whatsapp-groups/route.ts
new file mode 100644
index 0000000..6f78a1c
--- /dev/null
+++ b/sneaky-app/src/app/api/whatsapp-groups/route.ts
@@ -0,0 +1,104 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+const EVOLUTION_API_URL = process.env.EVOLUTION_API_URL || 'https://evolution.almeira.com.co';
+const EVOLUTION_API_KEY = process.env.EVOLUTION_API_KEY || 'EE49029EEB85-4568-8F81-C9FDFC6E2943';
+const EVOLUTION_INSTANCE_NAME = process.env.EVOLUTION_INSTANCE_NAME || 'AutomataAlmeira';
+
+export async function GET(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const fetchLive = searchParams.get('fetchLive') === 'true';
+
+ const localGroups = dataService.getMonitoredGroups();
+
+ if (!fetchLive) {
+ return NextResponse.json({
+ success: true,
+ groups: localGroups,
+ });
+ }
+
+ // Consultar grupos en vivo desde Evolution API
+ try {
+ const response = await fetch(
+ `${EVOLUTION_API_URL}/group/fetchAllGroups/${EVOLUTION_INSTANCE_NAME}?getParticipants=false`,
+ {
+ headers: {
+ apikey: EVOLUTION_API_KEY,
+ 'Content-Type': 'application/json',
+ },
+ }
+ );
+
+ const liveGroups = await response.json();
+
+ if (Array.isArray(liveGroups)) {
+ const merged: MonitoredWhatsAppGroup[] = liveGroups.map((lg: any) => {
+ const jid = lg.id || lg.jid;
+ const name = lg.subject || lg.name || 'Grupo Sin Nombre';
+ const existing = localGroups.find((g) => g.jid === jid || g.name.toLowerCase() === name.toLowerCase());
+
+ return {
+ id: existing?.id || `grp-${jid.replace(/\D/g, '').slice(-6)}`,
+ jid,
+ name,
+ isMonitored: existing ? existing.isMonitored : false,
+ supplierId: existing?.supplierId,
+ supplierName: existing?.supplierName || name,
+ profitMarginOverride: existing?.profitMarginOverride || 35,
+ autoPublish: existing?.autoPublish ?? true,
+ participantsCount: lg.size || (lg.participants ? lg.participants.length : undefined),
+ notes: existing?.notes || '',
+ };
+ });
+
+ // Asegurar que los locales que no vinieron en live sigan presentes
+ localGroups.forEach((lg) => {
+ if (!merged.some((m) => m.jid === lg.jid || m.id === lg.id)) {
+ merged.unshift(lg);
+ }
+ });
+
+ return NextResponse.json({
+ success: true,
+ isLive: true,
+ totalLive: liveGroups.length,
+ groups: merged,
+ });
+ }
+ } catch (err: any) {
+ console.warn('No se pudo conectar con Evolution API en vivo:', err.message);
+ }
+
+ return NextResponse.json({
+ success: true,
+ isLive: false,
+ groups: localGroups,
+ });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+
+ if (body.action === 'toggle') {
+ const { idOrJid, isMonitored } = body;
+ const updated = dataService.toggleGroupMonitoring(idOrJid, isMonitored);
+ return NextResponse.json({ success: true, group: updated });
+ }
+
+ if (Array.isArray(body.groups)) {
+ const saved = dataService.saveMonitoredGroups(body.groups);
+ return NextResponse.json({ success: true, groups: saved });
+ }
+
+ return NextResponse.json({ success: false, error: 'Datos no válidos' }, { status: 400 });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/sneaky-app/src/app/checkout/page.tsx b/sneaky-app/src/app/checkout/page.tsx
new file mode 100644
index 0000000..bad0bc6
--- /dev/null
+++ b/sneaky-app/src/app/checkout/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { ArrowLeft, CheckCircle2, ShieldCheck, Truck, Zap, QrCode, Phone, MapPin, User, MessageCircle, ExternalLink, CreditCard } from 'lucide-react';
+import { City, PaymentMethod, Order, StoreSettings } from '@/types';
+import { INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+import confetti from 'canvas-confetti';
+
+export default function CheckoutPage() {
+ const { currentBrand } = useBrand();
+
+ const [customerName, setCustomerName] = useState('');
+ const [customerPhone, setCustomerPhone] = useState('');
+ const [address, setAddress] = useState('');
+ const [neighborhood, setNeighborhood] = useState('');
+ const [notes, setNotes] = useState('');
+
+ const [cities, setCities] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Administra los accesos de administradores, operadores de logística y clientes registrados de la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* KPI Stats Cards */}
+
+
+
+ {/* Filters Toolbar */}
+
+
+
+
+
+
+
+ Administradores
+{adminsCount}
+
+
+
+
+
+
+
+ Operadores Logísticos
+{operatorsCount}
+
+
+
+
+
+
+ Clientes Registrados
+{customersCount}
+
+ {/* Role Pills */}
+
+
+ {/* Users Table */}
+
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-zinc-900 border border-zinc-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-orange-500"
+ />
+
+
+
+
+ {/* Modal Create User */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado | +Usuario | +Contacto Directo | +Ciudad / Dirección | +Rol & Permisos | +Último Acceso | +Acciones | +
|---|---|---|---|---|---|---|
| + No se encontraron usuarios con el filtro seleccionado. + | +||||||
| + + | + + {/* User Avatar & Name */} +
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+ {user.name} + {user.email} + |
+
+ {/* Contact */}
+
+
+
+
+ |
+
+ {/* City */}
+
+
+ {user.city || 'Cali'}
+ {user.address &&
+ {user.address} } + |
+
+ {/* Role Dropdown */}
+ + + | + + {/* Last Login */} ++ {user.lastLogin || user.createdAt} + | + + {/* Actions */} ++ + | +
+
+ )}
+
+
+ Registrar Nuevo Usuario / Operador
+ + +
+
+ );
+ }
+
+ return (
+
+
+
+
+
+
+
+ ¡Pedido Registrado con Éxito!
+
+
+
+ {/* Bold.co or Nequi Separation Box */}
+ {orderCompleted.depositAmount > 0 ? (
+ Orden #{orderCompleted.id}
++ Hemos recibido tu solicitud para entrega en {orderCompleted.cityName} con {currentBrand.name}. +
+
+
+ ) : (
+
+
+ + Paga de inmediato con Link de Pago Bold.co (PSE / Tarjeta / Nequi) o transfiere a nuestra cuenta oficial: +
+ + {boldLink && ( + +
+ 📱 Nequi / Daviplata: {storeSettings?.nequiAccount || '316 745 5877'} ({storeSettings?.accountHolder || 'Carlos Andrés Lasso'})
+
+ + 🤝 Cancelas el saldo de {formatCOP(orderCompleted.balanceDue)} al recibir el paquete en tu casa. +
+
+
+ )}
+
+ + Tu pedido quedó programado para entrega contraentrega en 24 horas. ¡Nos pondremos en contacto contigo por WhatsApp! +
+
+
+
+
+ Volver a la Tienda
+
+
+
+
+ );
+}
diff --git a/sneaky-app/src/app/favicon.ico b/sneaky-app/src/app/favicon.ico
new file mode 100644
index 0000000..718d6fe
Binary files /dev/null and b/sneaky-app/src/app/favicon.ico differ
diff --git a/sneaky-app/src/app/globals.css b/sneaky-app/src/app/globals.css
new file mode 100644
index 0000000..a2dc41e
--- /dev/null
+++ b/sneaky-app/src/app/globals.css
@@ -0,0 +1,26 @@
+@import "tailwindcss";
+
+:root {
+ --background: #ffffff;
+ --foreground: #171717;
+}
+
+@theme inline {
+ --color-background: var(--background);
+ --color-foreground: var(--foreground);
+ --font-sans: var(--font-geist-sans);
+ --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ --background: #0a0a0a;
+ --foreground: #ededed;
+ }
+}
+
+body {
+ background: var(--background);
+ color: var(--foreground);
+ font-family: Arial, Helvetica, sans-serif;
+}
diff --git a/sneaky-app/src/app/layout.tsx b/sneaky-app/src/app/layout.tsx
new file mode 100644
index 0000000..c752081
--- /dev/null
+++ b/sneaky-app/src/app/layout.tsx
@@ -0,0 +1,61 @@
+import type { Metadata, Viewport } from 'next';
+import { Geist, Geist_Mono } from 'next/font/google';
+import './globals.css';
+import { BrandProvider } from '@/context/BrandContext';
+import { AuthProvider } from '@/context/AuthContext';
+
+const geistSans = Geist({
+ variable: '--font-geist-sans',
+ subsets: ['latin'],
+});
+
+const geistMono = Geist_Mono({
+ variable: '--font-geist-mono',
+ subsets: ['latin'],
+});
+
+export const viewport: Viewport = {
+ themeColor: '#dc2626',
+ width: 'device-width',
+ initialScale: 1,
+ maximumScale: 1,
+ userScalable: false,
+ viewportFit: 'cover',
+};
+
+export const metadata: Metadata = {
+ title: 'Sneaky Drops • Viral Sneakers',
+ description: 'Zapatillas virales en tendencia, drops exclusivos y pago contraentrega en 24 horas.',
+ manifest: '/manifest.json',
+ appleWebApp: {
+ capable: true,
+ statusBarStyle: 'black-translucent',
+ title: 'Sneaky Drops',
+ },
+ icons: {
+ icon: '/icon.svg',
+ apple: '/icon.svg',
+ },
+};
+
+export default function RootLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+
+
+
+
+
+
+
+ {/* Header */}
+
+
+
+
+
+
+
+
+
+ {/* Navigation Header */}
+ setIsCartOpen(true)}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => setIsCityModalOpen(true)}
+ searchQuery={searchQuery}
+ onSearchChange={setSearchQuery}
+ />
+
+ {/* Main Container */}
+
+ {/* Flash Deals Hero Banner */}
+
+
+ {/* Footer */}
+
+
+ {/* Modals & Drawers */}
+ setSelectedProduct(null)}
+ onAddToCart={handleAddToCart}
+ selectedCity={selectedCity}
+ />
+
+ setIsCartOpen(false)}
+ cartItems={cartItems}
+ onRemoveItem={handleRemoveFromCart}
+ onUpdateQuantity={handleUpdateQuantity}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => {
+ setIsCartOpen(false);
+ setIsCityModalOpen(true);
+ }}
+ />
+
+ setIsCityModalOpen(false)}
+ cities={cities}
+ selectedCity={selectedCity}
+ onSelectCity={setSelectedCity}
+ />
+
+ {/* Mobile App Dock & Install Banner */}
+ setIsCartOpen(true)}
+ onOpenInstallModal={() => setIsInstallModalOpen(true)}
+ />
+
+ setIsInstallModalOpen(false)}
+ />
+
+ {/* User Auth Modal */}
+
+ );
+}
diff --git a/sneaky-app/src/components/auth/AuthModal.tsx b/sneaky-app/src/components/auth/AuthModal.tsx
new file mode 100644
index 0000000..ae140ae
--- /dev/null
+++ b/sneaky-app/src/components/auth/AuthModal.tsx
@@ -0,0 +1,255 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, User, Lock, Mail, Phone, MapPin, Sparkles, LogIn, UserPlus, Shield, LogOut } from 'lucide-react';
+import { useAuth } from '@/context/AuthContext';
+import { useBrand } from '@/context/BrandContext';
+import Link from 'next/link';
+
+export const AuthModal: React.FC = () => {
+ const { user, login, register, logout, isAuthModalOpen, closeAuthModal } = useAuth();
+ const { currentBrand } = useBrand();
+
+ const [mode, setMode] = useState<'login' | 'register'>('login');
+ const [identifier, setIdentifier] = useState('');
+ const [name, setName] = useState('');
+ const [email, setEmail] = useState('');
+ const [phone, setPhone] = useState('');
+ const [city, setCity] = useState('Cali');
+ const [address, setAddress] = useState('');
+ const [error, setError] = useState
+
+
+ {/* Category & Brand Filters */}
+
+
+
+
+
+
+
+ Entrega en 24 Horas
+Directo en Cali
+
+
+
+
+
+
+
+ Pago Contraentrega
+Cancelas al recibir
+
+
+
+
+
+
+
+ Separa con $10.000
+Aparta tu talla
+
+
+
+
+
+
+ Garantía Total
+Cambio asegurado
+
+
+
+ {/* Product Grid */}
+ {filteredProducts.length === 0 ? (
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+ ) : (
+
+
+ No encontramos zapatillas con ese criterio
+Intenta buscar otra marca o restablecer los filtros.
+ +
+ {filteredProducts.map((product) => (
+ handleAddToCart(p, size)}
+ />
+ ))}
+
+ )}
+
+
+ );
+};
diff --git a/sneaky-app/src/components/mobile/MobileBottomDock.tsx b/sneaky-app/src/components/mobile/MobileBottomDock.tsx
new file mode 100644
index 0000000..2518255
--- /dev/null
+++ b/sneaky-app/src/components/mobile/MobileBottomDock.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { Home, Search, ShoppingBag, MessageCircle, Download, Check } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileBottomDockProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ onOpenSearch?: () => void;
+ onOpenInstallModal: () => void;
+}
+
+export const MobileBottomDock: React.FC
+
+
+ {/* If user is already logged in: View Profile */}
+ {user ? (
+
+
+
+ ) : (
+ /* Login or Register */
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+
+ {user.name}
+{user.email}
+
+
+ {user.role === 'admin' ? '👑 Administrador' : user.role === 'operator' ? '📦 Operador Logística' : '🛍️ Cliente Registrado'}
+
+
+
+
+
+ {user.role === 'admin' || user.role === 'operator' ? (
+
+ 📱 Celular: {user.phone}
+📍 Ciudad: {user.city || 'Cali'}
+ {user.address &&🏠 Dirección: {user.address}
} +
+
+ )}
+
+
+
+ {/* Mode Switch Tabs */}
+
+ {currentBrand.shortName[0]}
+
+
+
+ + {mode === 'login' ? 'Iniciar Sesión' : 'Crear Cuenta'} +
++ {mode === 'login' + ? 'Accede para gestionar pedidos o entrar como admin' + : 'Regístrate para compras rápidas y seguimiento'} +
+
+
+
+
+
+ {error && (
+
+ {error}
+
+ )}
+
+ {mode === 'login' ? (
+
+ ) : (
+
+ )}
+
+
+ );
+};
diff --git a/sneaky-app/src/components/mobile/MobileInstallBanner.tsx b/sneaky-app/src/components/mobile/MobileInstallBanner.tsx
new file mode 100644
index 0000000..8322c52
--- /dev/null
+++ b/sneaky-app/src/components/mobile/MobileInstallBanner.tsx
@@ -0,0 +1,125 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Download, Sparkles, X, Smartphone, CheckCircle, Share2, PlusSquare } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileInstallBannerProps {
+ isOpen: boolean;
+ onClose: () => void;
+}
+
+export const MobileInstallBanner: React.FC
+ setActiveTab('home')}
+ className={`flex flex-col items-center gap-0.5 cursor-pointer transition-all ${
+ activeTab === 'home' ? 'text-white' : 'text-zinc-400 hover:text-zinc-200'
+ }`}
+ >
+
+
+
+ );
+};
diff --git a/sneaky-app/src/components/store/CartDrawer.tsx b/sneaky-app/src/components/store/CartDrawer.tsx
new file mode 100644
index 0000000..bca5a6d
--- /dev/null
+++ b/sneaky-app/src/components/store/CartDrawer.tsx
@@ -0,0 +1,254 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { X, Trash2, ShoppingBag, ArrowRight, Zap, Truck, MessageCircle } from 'lucide-react';
+import { CartItem, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface CartDrawerProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cartItems: CartItem[];
+ onRemoveItem: (productId: string, size: string) => void;
+ onUpdateQuantity: (productId: string, size: string, delta: number) => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+}
+
+export const CartDrawer: React.FC
+
+
+
+
+
+
+
+ {currentBrand.shortName[0]}
+
+
+
+ Instalar {currentBrand.name}
+Aplicación Móvil para Android & iPhone
+
+
+
+ {isIOS ? (
+
+
+
+
+
+
+
+
+ ) : deferredPrompt ? (
+
+ ) : (
+
+
-
+
- Toca el botón Compartir
abajo en Safari.
+ - Desliza hacia abajo y selecciona "Agregar a Inicio
".
+ - ¡Listo! El icono de {currentBrand.shortName} aparecerá en tu teléfono. +
+
+ )}
+
+
+
+ Para instalar en tu navegador:
++ Abre el menú de opciones del navegador (los 3 puntos arriba a la derecha) y toca "Instalar aplicación" o "Agregar a pantalla principal". +
+
+ {/* Backdrop */}
+
+
+
+ );
+};
diff --git a/sneaky-app/src/components/store/CategoryPills.tsx b/sneaky-app/src/components/store/CategoryPills.tsx
new file mode 100644
index 0000000..be49b4b
--- /dev/null
+++ b/sneaky-app/src/components/store/CategoryPills.tsx
@@ -0,0 +1,48 @@
+'use client';
+
+import React from 'react';
+import { useBrand } from '@/context/BrandContext';
+
+interface CategoryPillsProps {
+ activeCategory: string;
+ onSelectCategory: (category: string) => void;
+}
+
+const CATEGORIES = [
+ { id: 'all', label: '🔥 Todas las Zapatillas' },
+ { id: 'Nike', label: '👟 Nike' },
+ { id: 'Jordan', label: '🏀 Air Jordan' },
+ { id: 'Adidas', label: '🛹 Adidas' },
+ { id: 'New Balance', label: '🌿 New Balance' },
+ { id: 'Puma', label: '🐆 Puma' },
+ { id: 'flash', label: '⚡ Ofertas Flash' },
+ { id: 'under120', label: '💰 Menos de $120k' },
+];
+
+export const CategoryPills: React.FC
+
+
+ {/* Header */}
+
+
+
+
+ {/* Items List */}
+
+
+
+
+
+
+
+ Tu Carrito • {currentBrand.shortName}
+{cartItems.length} {cartItems.length === 1 ? 'artículo' : 'artículos'}
+
+ {cartItems.length === 0 ? (
+
+
+ {/* Footer & Checkout Breakdown */}
+ {cartItems.length > 0 && (
+
+
+ ) : (
+ cartItems.map((item, idx) => (
+
+
+ Tu carrito está vacío
++ Aprovecha las ofertas de calzado con pago contraentrega en Cali y despachos nacionales. +
+ +
+
+
+ ))
+ )}
+
+
+
+
+
+
+
+ + {item.product.name} +
+ +
+
+ Talla {item.selectedSize}
+
+
+ {item.product.brand}
+
+
+
+
+ {formatCOP(item.product.retailPrice * item.quantity)}
+
+
+
+
+ {item.quantity}
+
+
+
+ {/* City Delivery selector pill */}
+
+ )}
+
+
+
+ {/* Price Calculations */}
+
+
+
+
+
+
+ {/* Separation Highlight Banner */}
+
+ Subtotal:
+ {formatCOP(subtotal)}
+
+
+ Costo de Envío:
+
+ {shippingCost === 0 ? Gratis : formatCOP(shippingCost)}
+
+
+
+ Total de la Orden:
+
+ {formatCOP(totalAmount)}
+
+
+
+
+
+ {/* Action Buttons */}
+
+
+ Separas con {formatCOP(separation.depositAmount)} y pagas {formatCOP(separation.balanceDue)} al recibir contraentrega en tu casa. +
++ 🛡️ {selectedCity.firstExchangeFree + ? `1er Cambio de Talla 100% GRATIS en ${selectedCity.name}` + : `Garantía de cambio en ${selectedCity.name} (flete asumido por cliente)`} +
+
+
+ Proceder al Pago Contraentrega
+
+
+ {CATEGORIES.map((cat) => {
+ const isActive = activeCategory === cat.id;
+ return (
+
+ );
+ })}
+
+ );
+};
diff --git a/sneaky-app/src/components/store/CitySelectorModal.tsx b/sneaky-app/src/components/store/CitySelectorModal.tsx
new file mode 100644
index 0000000..311d61d
--- /dev/null
+++ b/sneaky-app/src/components/store/CitySelectorModal.tsx
@@ -0,0 +1,109 @@
+'use client';
+
+import React from 'react';
+import { X, MapPin, Check, Truck } from 'lucide-react';
+import { City } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+interface CitySelectorModalProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cities: City[];
+ selectedCity: City;
+ onSelectCity: (city: City) => void;
+}
+
+export const CitySelectorModal: React.FC
+
+ );
+};
diff --git a/sneaky-app/src/components/store/FlashDealsBanner.tsx b/sneaky-app/src/components/store/FlashDealsBanner.tsx
new file mode 100644
index 0000000..e26b007
--- /dev/null
+++ b/sneaky-app/src/components/store/FlashDealsBanner.tsx
@@ -0,0 +1,83 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Zap, Clock, Gift } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+export const FlashDealsBanner: React.FC = () => {
+ const { currentBrand } = useBrand();
+ const [timeLeft, setTimeLeft] = useState({ hours: 4, minutes: 27, seconds: 15 });
+
+ useEffect(() => {
+ const timer = setInterval(() => {
+ setTimeLeft((prev) => {
+ if (prev.seconds > 0) {
+ return { ...prev, seconds: prev.seconds - 1 };
+ } else if (prev.minutes > 0) {
+ return { ...prev, minutes: 59, seconds: 59 };
+ } else if (prev.hours > 0) {
+ return { hours: prev.hours - 1, minutes: 59, seconds: 59 };
+ }
+ return { hours: 5, minutes: 59, seconds: 59 };
+ });
+ }, 1000);
+ return () => clearInterval(timer);
+ }, []);
+
+ const pad = (n: number) => n.toString().padStart(2, '0');
+
+ return (
+
+ {/* Header */}
+
+
+
+
+ {/* City list */}
+
+
+
+
+
+
+
+ Selecciona tu Ciudad
+Calculamos tiempos y tarifas oficiales
+
+ {cities
+ .filter((c) => c.isActive !== false)
+ .map((city) => {
+ const isSelected = selectedCity.id === city.id;
+ const hasCod = city.allowsContraentrega || city.allowCod;
+
+ return (
+
+
+ {/* Info footer */}
+ {
+ onSelectCity(city);
+ onClose();
+ }}
+ className={`p-3 rounded-2xl border transition-all cursor-pointer flex items-center justify-between ${
+ isSelected
+ ? 'border-orange-400 bg-orange-950/50 shadow-[0_0_15px_rgba(239,68,68,0.2)]'
+ : 'border-zinc-800 hover:border-zinc-700 bg-zinc-950'
+ }`}
+ >
+
+ );
+ })}
+
+
+
+
+ {city.name}
+ {hasCod && (
+
+ Contraentrega
+
+ )}
+
+
+
+
+ {city.shippingCost === 0 ? (
+ Gratis
+ ) : (
+ formatCOP(city.shippingCost)
+ )}
+
+ {isSelected && (
+
+
+
+ )}
+
+ 💡 En Cali y zona metropolitana: entregas el mismo día con mensajería directa y pago contraentrega.
+
+
+ {/* Background glow meshes */}
+
+
+
+
+ );
+};
diff --git a/sneaky-app/src/components/store/Navbar.tsx b/sneaky-app/src/components/store/Navbar.tsx
new file mode 100644
index 0000000..9e1ddd1
--- /dev/null
+++ b/sneaky-app/src/components/store/Navbar.tsx
@@ -0,0 +1,152 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { ShoppingBag, Search, MapPin, Zap, Sparkles, ShieldCheck, Store, User as UserIcon } from 'lucide-react';
+import { City } from '@/types';
+import { useBrand } from '@/context/BrandContext';
+import { useAuth } from '@/context/AuthContext';
+
+interface NavbarProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+ searchQuery: string;
+ onSearchChange: (q: string) => void;
+}
+
+export const Navbar: React.FC
+ {/* Left text */}
+
+
+
+
+ {/* Right Countdown Box */}
+
+
+ + Zapatillas Premium hasta con{' '} + + 35% OFF + +
++ Lanzamientos exclusivos directos de bodega. Separa tu par con $10.000 COP y paga el saldo en efectivo o transferencia con Pago Contraentrega en tu casa. +
+
+
+
+
+
+
+
+ {pad(timeLeft.hours)}
+ Horas
+
+ :
+
+ {pad(timeLeft.minutes)}
+ Min
+
+ :
+
+ {pad(timeLeft.seconds)}
+ Seg
+
+
+
+
+
+
+ {/* Main Navbar */}
+
+
+
+
+
+
+
+
+ {/* Brand Logo */}
+
+
+
+
+
+
+ {currentBrand.logo.iconText}
+
+
+
+
+
+
+ {/* City Selector Pill */}
+
+
+ {/* Search Bar */}
+
+ {currentBrand.logo.mainText}
+
+ {currentBrand.logo.accentText}
+
+
+ {currentBrand.tagline}
+
+
+
+ {/* Right Actions */}
+
+ onSearchChange(e.target.value)}
+ className="w-full bg-zinc-900/90 text-white placeholder-gray-400 text-xs sm:text-sm rounded-full pl-10 pr-4 py-2 border border-zinc-700 focus:border-orange-500 focus:ring-2 focus:ring-orange-500/20 transition-all outline-hidden"
+ />
+
+
+ {/* User Auth Button */}
+
+
+ {/* Admin Link */}
+
+
+ onOpenDetail(product)}
+ className={`group rounded-2xl border transition-all duration-300 flex flex-col cursor-pointer overflow-hidden ${currentBrand.colors.cardBg}`}
+ >
+ {/* Image Container */}
+
+ );
+};
diff --git a/sneaky-app/src/components/store/ProductModal.tsx b/sneaky-app/src/components/store/ProductModal.tsx
new file mode 100644
index 0000000..3cc0cca
--- /dev/null
+++ b/sneaky-app/src/components/store/ProductModal.tsx
@@ -0,0 +1,222 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, Star, Truck, ShieldCheck, Zap, MessageCircle, ShoppingBag, Check } from 'lucide-react';
+import { Product, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface ProductModalProps {
+ product: Product | null;
+ onClose: () => void;
+ onAddToCart: (product: Product, size: string) => void;
+ selectedCity: City;
+}
+
+export const ProductModal: React.FC
+
+
+ {/* Badges */}
+
+
+ {/* Product Info */}
+
+
+ -{discountPercent}% OFF
+
+ {product.isFlashDeal && (
+
+
+
+
+
+
+
+
+
+ {/* Rating and Sales */}
+
+
+ {/* Pricing & Separation terms */}
+
+
+
+ {/* Product Title */}
+
+
+
+ +{product.salesCount || 150} pedidos
+
+ + {product.name} +
+ + {/* Available Sizes Pills */} +
+ Tallas:
+ {product.sizes.slice(0, 5).map((size) => (
+
+ {size}
+
+ ))}
+ {product.sizes.length > 5 && (
+ +{product.sizes.length - 5}
+ )}
+
+
+
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ + ⚡ Separa con {formatCOP(separation.depositAmount)} y cancelas {formatCOP(separation.balanceDue)} al recibir. +
+ + {/* Quick Action Button */} +
+
+
+
+
+ );
+};
diff --git a/sneaky-app/src/config/brands.ts b/sneaky-app/src/config/brands.ts
new file mode 100644
index 0000000..fe598a2
--- /dev/null
+++ b/sneaky-app/src/config/brands.ts
@@ -0,0 +1,151 @@
+export type BrandId = 'almeira' | 'sneaky' | 'zapply' | 'dripzone';
+
+export interface BrandTheme {
+ id: BrandId;
+ name: string;
+ shortName: string;
+ tagline: string;
+ badge: string;
+ couponCode: string;
+ whatsappNumber: string;
+
+ // Clases y colores de diseño personalizados para cada una de las 4 marcas
+ colors: {
+ primaryGradient: string;
+ secondaryGradient: string;
+ heroGradient: string;
+ accentGlow: string;
+ headerBg: string;
+ bodyBg: string;
+ cardBg: string;
+ border: string;
+ textAccent: string;
+ badgeBg: string;
+ badgeText: string;
+ cartBadge: string;
+ };
+
+ logo: {
+ iconText: string;
+ mainText: string;
+ accentText: string;
+ };
+}
+
+export const BRANDS: Record
+ {/* Close Button */}
+
+
+ {/* Left: Images */}
+
+
+
+
+ {/* Right: Product Details & Actions */}
+
+
+
+ -{Math.round(((product.originalPrice || 170000) - product.retailPrice) / (product.originalPrice || 170000) * 100)}% OFF
+
+
+
+ {/* Thumbnails */}
+ {product.images.length > 1 && (
+
+ {product.images.map((img, i) => (
+
+ ))}
+
+ )}
+
+ {/* Trust note */}
+
+
+
+
+
+
+
+ {/* Action Buttons */}
+
+ {product.brand}
+
+
+ {/* Price Box */}
+ {product.name}
+
+
+
+
+ •
+ +{product.salesCount || 200} pares entregados
+
+
+
+ {/* Size Selector */}
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ {/* Separation breakdown banner */}
+
+
+
+
+ Separas con solo {formatCOP(separation.depositAmount)} y pagas los {formatCOP(separation.balanceDue)} al recibir en tu puerta. +
+
+
+
+ {/* Description */}
+
+ Selecciona tu Talla (Nacional CO):
+ Guía de Tallas
+
+
+ {product.sizes.map((size) => (
+
+ ))}
+
+
+
+
+ {/* Shipping note */}
+ {product.description}
+
+
+
+ {selectedCity.name}:
+ {selectedCity.deliveryTime} ({selectedCity.shippingCost === 0 ? 'Envío Gratis' : formatCOP(selectedCity.shippingCost)})
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/configuracion/page.tsx b/zapply-app/src/app/admin/configuracion/page.tsx
new file mode 100644
index 0000000..6013f29
--- /dev/null
+++ b/zapply-app/src/app/admin/configuracion/page.tsx
@@ -0,0 +1,352 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Store, Mail, Phone, MessageCircle, Instagram, MapPin, CreditCard, Save, CheckCircle2, DollarSign, Percent, ShieldCheck, QrCode, ExternalLink, Zap } from 'lucide-react';
+import { StoreSettings } from '@/types';
+
+export default function AdminSettingsPage() {
+ const [settings, setSettings] = useState
+
+
+
+
+ {message && (
+
+
+ + Administra las tarifas de envío, tiempos de entrega y configura si el 1er cambio de talla es gratis o si el cliente asume el flete para cada ciudad. +
+
+ {message}
+
+
+ )}
+
+ {/* Add New City Card */}
+
+
+ {/* Cities List */}
+
+
+ Ciudades y Zonas Registradas ({cities.length})
+ +
+ {cities.map((city) => (
+
+
+
+ ))}
+
+
+
+ {/* Actions & Policy Toggle */}
+
+ {city.name}
+ ({city.department})
+ {city.allowsContraentrega ? (
+
+ Contraentrega Activo
+
+ ) : (
+
+ Solo Despacho Nacional
+
+ )}
+
+
+
+ {/* 1st Exchange Free Toggle Button */}
+
+
+ {/* Shipping cost edit */}
+
+
+ Flete:
+ handleUpdateShipping(city.id, parseInt(e.target.value, 10) || 0)}
+ className="w-20 bg-transparent text-xs font-bold text-white outline-hidden text-right"
+ />
+ COP
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/feed-whatsapp/page.tsx b/zapply-app/src/app/admin/feed-whatsapp/page.tsx
new file mode 100644
index 0000000..a1866cb
--- /dev/null
+++ b/zapply-app/src/app/admin/feed-whatsapp/page.tsx
@@ -0,0 +1,365 @@
+'use client';
+
+import React, { useState } from 'react';
+import { Radio, Sparkles, Share2, AlertTriangle, ShieldCheck, Plus, Send, Layers } from 'lucide-react';
+import { SupplierPost, Product } from '@/types';
+import { INITIAL_SUPPLIER_POSTS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { checkProductDuplicate } from '@/lib/deduplication-engine';
+import { formatCOP } from '@/lib/pricing-engine';
+import { BRANDS, BrandId } from '@/config/brands';
+
+export default function SupplierFeedPage() {
+ const [posts, setPosts] = useState
+
+
+
+
+ {toast && (
+
+
+ + Configura los datos oficiales del negocio: WhatsApp oficial de atención, correo electrónico, pasarela Bold.co (Link de pago, QR y botón), Nequi, Daviplata y reglas de margen. +
+
+ {toast}
+
+
+ )}
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/grupos-whatsapp/page.tsx b/zapply-app/src/app/admin/grupos-whatsapp/page.tsx
new file mode 100644
index 0000000..00f42c6
--- /dev/null
+++ b/zapply-app/src/app/admin/grupos-whatsapp/page.tsx
@@ -0,0 +1,585 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import {
+ MessageSquare,
+ RefreshCw,
+ Search,
+ CheckCircle2,
+ XCircle,
+ ShieldCheck,
+ Zap,
+ Radio,
+ Sliders,
+ Users,
+ Sparkles,
+ ExternalLink,
+ Plus,
+ ArrowUpRight,
+ Filter,
+ CheckSquare,
+ Square,
+ X
+} from 'lucide-react';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+export default function AdminWhatsAppGroupsPage() {
+ const [groups, setGroups] = useState
+
+
+ {actionMessage && (
+
+
+
+
+
+ {/* Target Brand Selector Pill Bar */}
+
+
+ + Recepción automática con IA, prevención de duplicados y distribución hacia las 4 marcas (Almeira Store, Sneaky, Zapply, DripZone). +
+
+
+
+
+ {actionMessage}
+
+
+ )}
+
+ {/* Live Simulator for Test Messages */}
+
+
+
+ {/* Intercepted Posts Feed */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ setTestText(e.target.value)}
+ className="flex-1 bg-slate-950 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ Mensajes Procesados Recientemente
+ +
+ {posts.map((post) => {
+ const extracted = post.extractedProduct;
+ const duplicateCheck = extracted
+ ? checkProductDuplicate(
+ {
+ name: extracted.name,
+ brand: extracted.brand,
+ sizes: extracted.sizes,
+ supplierPrice: extracted.supplierPrice,
+ },
+ products
+ )
+ : null;
+
+ return (
+
+
+ {/* Header of post */}
+
+ );
+ })}
+
+
+
+ {/* Content Grid */}
+
+
+ {post.channelName || 'Canal Mayorista'}
+
+ {post.receivedAt}
+
+
+ {/* Anti-Duplicate Status Badge */}
+ {duplicateCheck && (
+
+ {duplicateCheck.isDuplicate ? (
+ <>
+
+ )}
+
+ {/* Left: Raw WhatsApp Message (5 cols) */}
+
+
+ Mensaje de Entrada:
+
+
+ {/* Right: AI Extracted & Pricing Calculation (7 cols) */}
+ + {post.rawMessage} +
+ {post.rawImages.length > 0 && ( +
+
+
+ )}
+
+ {extracted ? (
+
+
+
+ ) : (
+
+
+
+ {/* Pricing breakdown */}
+
+
+ {extracted.brand} • {extracted.category}
+
+
+
+ IA: {Math.round(extracted.confidence * 100)}% certeza
+
+ {extracted.name}
+
+
+
+ {/* Sizes */}
+
+ Costo Base:
+
+ {formatCOP(extracted.supplierPrice)}
+
+
+
+ Precio Venta (+ Margen):
+
+ {formatCOP(extracted.suggestedRetailPrice)}
+
+
+
+
+ Tallas extraídas:
+
+
+
+ {/* Duplicate warning note */}
+ {duplicateCheck?.isDuplicate && (
+
+ {extracted.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+
+ {duplicateCheck.message}
+
+ )}
+
+ {/* Actions */}
+
+
+
+
+
+ Extrayendo datos...
+ )} +
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/layout.tsx b/zapply-app/src/app/admin/layout.tsx
new file mode 100644
index 0000000..b2d456f
--- /dev/null
+++ b/zapply-app/src/app/admin/layout.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import {
+ LayoutDashboard,
+ Radio,
+ Package,
+ MapPin,
+ CreditCard,
+ ShoppingBag,
+ ArrowLeft,
+ Sparkles,
+ Store,
+ Users,
+ MessageSquare,
+} from 'lucide-react';
+
+export default function AdminLayout({ children }: { children: React.ReactNode }) {
+ const pathname = usePathname();
+
+ const NAV_ITEMS = [
+ { href: '/admin', label: 'Resumen & KPIs', icon: LayoutDashboard },
+ { href: '/admin/grupos-whatsapp', label: 'Grupos WhatsApp', icon: MessageSquare, badge: 'Monitoreo 24/7' },
+ { href: '/admin/usuarios', label: 'Control de Usuarios', icon: Users, badge: 'Roles & Accesos' },
+ { href: '/admin/configuracion', label: 'Datos de la Tienda', icon: Store },
+ { href: '/admin/feed-whatsapp', label: 'Feed WhatsApp & IA', icon: Radio, badge: 'Anti-Duplicados' },
+ { href: '/admin/productos', label: 'Catálogo de Zapatillas', icon: Package },
+ { href: '/admin/ciudades', label: 'Ciudades & Fletes', icon: MapPin },
+ { href: '/admin/metodos-pago', label: 'Medios de Pago & Anticipos', icon: CreditCard },
+ { href: '/admin/pedidos', label: 'Pedidos & Logística', icon: ShoppingBag },
+ ];
+
+ return (
+
+
+
+ {/* Toast Notification */}
+ {toast && (
+
+
+
+
+
+ {/* Big Search and Select Button */}
+
+
+
+ + Busca y selecciona los grupos de proveedores que el bot de Evolution API & Gemini debe escuchar 24/7 para auto-publicar zapatillas. +
+
+ {toast}
+
+
+ )}
+
+ {/* Stats Bar */}
+
+
+
+ {/* Filter and Search Toolbar */}
+
+
+
+
+
+ Grupos en tu WhatsApp
+{groups.length}
+
+
+
+
+
+
+
+ Grupos Monitoreados (Activos)
+{monitoredCount}
+
+
+
+
+
+
+ Evolution API (WhatsApp)
++ + AutomataAlmeira (En línea) +
+
+
+
+
+
+ {/* Active Monitored Groups List */}
+
+
+
+
+
+
+
+
+
+ {isLoading ? (
+
+
+ {/* ========================================================= */}
+ {/* MODAL: Group Picker (Buscar y Seleccionar Grupos) */}
+ {/* ========================================================= */}
+ {isPickerOpen && (
+
+
+ ) : filteredGroups.length === 0 ? (
+ Cargando grupos de proveedores...
+
+
+ ) : (
+ filteredGroups.map((group) => {
+ const isMonitored = group.isMonitored;
+
+ return (
+ No tienes grupos seleccionados para monitorear.
+ +
+ {/* Header */}
+
+ );
+ })
+ )}
+
+
+
+ {/* Info Pills */}
+
+
+
+ {/* Toggle Switch */}
+
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+
+
+ {group.notes && (
+
+ Margen Aplicado
+
+ +{group.profitMarginOverride || 35}% (Redondeo a $5.000)
+
+
+
+
+ Modo de Ingreso
+
+
+ + ℹ️ {group.notes} +
+ )} + + {/* Action footer */} +
+
+ {group.participantsCount ? `👥 ${group.participantsCount} miembros` : 'Canal Mayorista'}
+
+
+
+
+
+
+ )}
+
+ {/* Modal Header */}
+
+
+
+
+ {/* Search and Action Toolbar in Modal */}
+
+
+
+
+
+
+
+ Seleccionar Grupos de WhatsApp
++ Marca los grupos que deseas monitorear con IA para auto-publicar calzado. +
+
+
+
+ {/* Groups Scrollable List */}
+
+
+
+
+
+ Mostrando {filteredPickerGroups.length} grupos encontrados
+
+
+
+
+ •
+
+
+
+ {isLoadingLive ? (
+
+
+ {/* Modal Footer */}
+
+
+ ) : filteredPickerGroups.length === 0 ? (
+ Consultando grupos en vivo desde Evolution API...
+Conectando con WhatsApp...
+
+
+ ) : (
+ filteredPickerGroups.map((group) => {
+ const isSelected = selectedJids.has(group.jid);
+
+ return (
+ No se encontraron grupos con el término "{pickerSearch}".
+ handleToggleSelectJid(group.jid)}
+ className={`p-3.5 rounded-2xl border transition-all cursor-pointer flex items-center justify-between gap-3 ${
+ isSelected
+ ? 'bg-emerald-950/30 border-emerald-500/50 shadow-md ring-1 ring-emerald-500/20'
+ : 'bg-slate-950 border-slate-800 hover:border-slate-700'
+ }`}
+ >
+
+ );
+ })
+ )}
+
+
+
+
+ {isSelected &&
+
+
+
+ + {group.name} +
++ {group.jid} +
+
+ {isSelected ? (
+
+ Monitorear
+
+ ) : (
+
+ Ignorar
+
+ )}
+
+
+
+
+ Seleccionados:
+ {selectedJids.size}
+ grupos para monitorear
+
+
+
+
+
+
+
+ {/* Sidebar */}
+
+
+ {/* Main Content Area */}
+
+ {children}
+
+
+ );
+}
diff --git a/zapply-app/src/app/admin/metodos-pago/page.tsx b/zapply-app/src/app/admin/metodos-pago/page.tsx
new file mode 100644
index 0000000..ffb5f01
--- /dev/null
+++ b/zapply-app/src/app/admin/metodos-pago/page.tsx
@@ -0,0 +1,163 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { CreditCard, Zap, Save, Check, ShieldCheck, QrCode } from 'lucide-react';
+import { PaymentMethod } from '@/types';
+import { INITIAL_PAYMENT_METHODS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminPaymentMethodsPage() {
+ const [methods, setMethods] = useState
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/page.tsx b/zapply-app/src/app/admin/page.tsx
new file mode 100644
index 0000000..8d400b5
--- /dev/null
+++ b/zapply-app/src/app/admin/page.tsx
@@ -0,0 +1,159 @@
+'use client';
+
+import React, { useState } from 'react';
+import Link from 'next/link';
+import { Package, Radio, MapPin, Zap, CheckCircle2, ArrowUpRight, Sparkles } from 'lucide-react';
+import { INITIAL_PRODUCTS, INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_SUPPLIER_POSTS } from '@/lib/data-service';
+
+export default function AdminDashboardPage() {
+ const [productsCount] = useState(INITIAL_PRODUCTS.length);
+ const [postsCount] = useState(INITIAL_SUPPLIER_POSTS.length);
+ const [citiesCount] = useState(INITIAL_CITIES.length);
+
+ return (
+
+
+
+
+
+ {message && (
+
+
+ + Habilita métodos de pago, configura el valor de separación de $10.000 COP y personaliza los datos de Nequi / Daviplata. +
+
+ {message}
+
+
+ )}
+
+ {/* Methods Cards */}
+
+ {methods.map((method) => (
+
+
+
+ ))}
+
+
+
+
+
+
+
+ {method.type === 'contraentrega' ?
+
+
+ {method.name}
+ Tipo: {method.type} +
+
+
+
+
+
+
+
+ handleUpdateField(method.id, 'name', e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+
+
+ handleUpdateField(method.id, 'description', e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ />
+
+
+ {method.requiresDeposit && (
+
+
+ handleUpdateField(method.id, 'depositAmount', parseInt(e.target.value, 10) || 0)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden font-bold"
+ />
+
+ (El saldo restante se cobra contraentrega al recibir)
+
+
+ )}
+
+
+
+ handleUpdateField(method.id, 'accountInfo', e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3 py-2 text-xs text-white outline-hidden"
+ placeholder="Ej. Nequi / Daviplata: 316 745 5877"
+ />
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/pedidos/page.tsx b/zapply-app/src/app/admin/pedidos/page.tsx
new file mode 100644
index 0000000..3f01444
--- /dev/null
+++ b/zapply-app/src/app/admin/pedidos/page.tsx
@@ -0,0 +1,275 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { ShoppingBag, Truck, CheckCircle2, Clock, Phone, MapPin, Search, MessageCircle, Send, ShieldCheck, UserCheck } from 'lucide-react';
+import { Order, OrderItem } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminOrdersPage() {
+ const [orders, setOrders] = useState
+
+
+ {/* KPI Cards */}
+
+
+
+
+
+
+
+ + Automatización inteligente de calzado, publicaciones a Facebook y gestión de despachos. +
+
+
+
+
+
+
+ {/* Quick Actions & Automation Status */}
+
+
+
+
+ Zapatillas Activas
+
+ {productsCount}
+
+
+
+
+
+ Margen Promedio
+
+
+ +$30.000 COP
+
+ + (Costo: $90k ➔ Venta: $120k) +
+
+
+
+
+ Entradas Procesadas
+
+ {postsCount}
+ + IA Gemini + Anti-duplicados +
+
+
+
+ Ciudades Habilitadas
+
+ {citiesCount}
+ + Contraentrega activo en Cali +
+
+ {/* Left: WhatsApp Evolution API Status */}
+
+
+
+
+ {/* Right: Meta / Facebook Automation */}
+
+
+
+
+
+
+
+ Activo
+
+ Estado del Listener de WhatsApp
+
+
+
+
+ Ver últimos mensajes procesados
+
+ Instancia Evolution API:
+ AutomataAlmeira
+
+
+ Servidor:
+ evolution.almeira.com.co
+
+
+ Motor de Inteligencia Artificial:
+ Gemini 2.5 Flash
+
+
+ Filtro Anti-Duplicados:
+ Activo (>75% Similitud)
+
+
+
+
+
+
+ Publicador a Fanpage de Facebook
+ + Listo para Publicar + +
+
+
+
+ Publicar Producto de Prueba en Facebook
+ ✨ Plantilla de Copy Vendedor Integrada:
+
+ "✨ ALMEIRA STORE • NUEVA COLECCIÓN EXCLUSIVA ✨
+ 👟 NIKE DUNK LOW PANDA
+ 📏 Tallas: 37 a 43 | 💎 Precio: $120.000 COP
+ 🚚 ¡Entrega a Domicilio en Cali con Pago Contraentrega!"
+
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/productos/page.tsx b/zapply-app/src/app/admin/productos/page.tsx
new file mode 100644
index 0000000..ca269a9
--- /dev/null
+++ b/zapply-app/src/app/admin/productos/page.tsx
@@ -0,0 +1,472 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Package, Plus, Eye, EyeOff, Check, X, Sparkles, Filter, Phone, MessageCircle, Truck } from 'lucide-react';
+import { Product, Supplier } from '@/types';
+import { INITIAL_PRODUCTS, INITIAL_SUPPLIERS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+
+export default function AdminProductsPage() {
+ const [products, setProducts] = useState
+
+
+
+
+ {/* Toolbar */}
+
+
+ + Control logístico de pedidos contraentrega, cobro de anticipos de $10.000 COP y notificación inmediata de separación al proveedor vía WhatsApp. +
+
+
+
+ {filteredOrders.length === 0 ? (
+
+
+
+
+
+
+
+
+ setSearch(e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-emerald-400"
+ />
+
+
+
+ ) : (
+
+
+ No hay pedidos en esta sección
++ Cuando los clientes hagan un pedido en la tienda web o por WhatsApp, aparecerán aquí con el botón para separar inmediatamente con el proveedor correspondiente. +
+
+ {filteredOrders.map((order) => (
+
+ )}
+
+
+ ))}
+
+
+
+
+ Orden #{order.id}
+ • {new Date(order.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
+
+ {getStatusBadge(order.status)}
+
+
+
+
+
+ Cliente & Entrega (24 Horas)
+
+
+
+ {order.customerName}
+
+
+
+
+ Zapatillas & Proveedor Asignado:
+
+
+
+
+ {order.items.map((it, idx) => {
+ const suppName = it.supplierName || 'DIFUSION JOVIC STORE';
+ return (
+
+
+
+ );
+ })}
+
+
+
+
+
+
+
+ Prov: {suppName}
+
+ {it.productName}
++ Talla {it.size} • Cant: {it.quantity} +
+
+
+ Cobro & Pagos Contraentrega
+
+
+
+
+ + Total de la Orden: + {formatCOP(order.totalAmount)} +
+ {order.depositAmount > 0 ? ( + <> ++ Anticipo / Separación: + {formatCOP(order.depositAmount)} +
++ Saldo al Mensajero: + {formatCOP(order.balanceDue)} +
+ + ) : ( ++ 100% Contraentrega al recibir +
+ )} +
+ Método: {order.paymentMethodName}
+
+
+
+
+
+
+
+
+
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/admin/usuarios/page.tsx b/zapply-app/src/app/admin/usuarios/page.tsx
new file mode 100644
index 0000000..49b0aa5
--- /dev/null
+++ b/zapply-app/src/app/admin/usuarios/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Users, UserPlus, Shield, ShieldCheck, UserCheck, MessageCircle, Mail, Phone, MapPin, Eye, EyeOff, Trash2, Edit, Check, X } from 'lucide-react';
+import { User } from '@/types';
+
+export default function AdminUsersPage() {
+ const [users, setUsers] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Visualiza cada modelo con su proveedor asignado, costo mayorista y activa/inactiva publicaciones para la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* Filters & Search Toolbar */}
+
+ {/* Status filter pills */}
+
+
+ {/* Products Table */}
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-emerald-400"
+ />
+
+
+
+
+ {/* Modal Add Product */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado Publicación | +Producto | +Proveedor Asignado (Interno) | +Marca | +Costo Base | +Precio Venta | +Margen Ganancia | +Tallas | +
|---|---|---|---|---|---|---|---|
| + No hay zapatillas que coincidan con el filtro seleccionado. + | +|||||||
| + + | + + {/* Product Name & Image */} +
+
+
+ {prod.name} + {prod.category} + |
+
+ {/* Supplier Column */}
+
+
+
+ 🏢 {suppName}
+
+
+
+ |
+
+ {prod.brand} | +{formatCOP(prod.supplierPrice)} | +{formatCOP(prod.retailPrice)} | + ++ + +{formatCOP(margin)} + + | + +
+
+ {prod.sizes.map((s) => (
+
+ {s}
+
+ ))}
+
+ |
+
+
+ )}
+
+
+ Registrar Nueva Zapatilla
+ + +
+ {/* Header */}
+
+ );
+}
diff --git a/zapply-app/src/app/api/auth/login/route.ts b/zapply-app/src/app/api/auth/login/route.ts
new file mode 100644
index 0000000..a2ae66e
--- /dev/null
+++ b/zapply-app/src/app/api/auth/login/route.ts
@@ -0,0 +1,29 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function POST(request: Request) {
+ try {
+ const { identifier } = await request.json();
+ if (!identifier) {
+ return NextResponse.json({ success: false, error: 'Ingresa tu correo o celular' }, { status: 400 });
+ }
+ const user = dataService.authenticate(identifier);
+ if (!user) {
+ return NextResponse.json(
+ { success: false, error: 'Usuario no encontrado. Verifica tu correo o celular.' },
+ { status: 404 }
+ );
+ }
+ if (!user.isActive) {
+ return NextResponse.json(
+ { success: false, error: 'Esta cuenta se encuentra inactiva. Contacta a soporte.' },
+ { status: 403 }
+ );
+ }
+
+ dataService.updateUser(user.id, { lastLogin: 'Justo ahora' });
+ return NextResponse.json({ success: true, user });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/auth/register/route.ts b/zapply-app/src/app/api/auth/register/route.ts
new file mode 100644
index 0000000..62b2a63
--- /dev/null
+++ b/zapply-app/src/app/api/auth/register/route.ts
@@ -0,0 +1,42 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function POST(request: Request) {
+ try {
+ const { name, email, phone, city, address } = await request.json();
+ if (!name || !email || !phone) {
+ return NextResponse.json(
+ { success: false, error: 'Nombre, correo y celular son obligatorios' },
+ { status: 400 }
+ );
+ }
+
+ const existing = dataService.authenticate(email) || dataService.authenticate(phone);
+ if (existing) {
+ return NextResponse.json(
+ { success: false, error: 'Ya existe una cuenta con este correo o celular' },
+ { status: 409 }
+ );
+ }
+
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name,
+ email,
+ phone,
+ city: city || 'Cali',
+ address: address || '',
+ role: 'customer',
+ isActive: true,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ lastLogin: 'Justo ahora',
+ };
+
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/cities/route.ts b/zapply-app/src/app/api/cities/route.ts
new file mode 100644
index 0000000..3ecd601
--- /dev/null
+++ b/zapply-app/src/app/api/cities/route.ts
@@ -0,0 +1,27 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const cities = dataService.getCities();
+ return NextResponse.json({ success: true, cities });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateCity(id, updates);
+ return NextResponse.json({ success: true, city: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const created = dataService.addCity(body);
+ return NextResponse.json({ success: true, city: created });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/orders/route.ts b/zapply-app/src/app/api/orders/route.ts
new file mode 100644
index 0000000..9c996b6
--- /dev/null
+++ b/zapply-app/src/app/api/orders/route.ts
@@ -0,0 +1,30 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { sendWhatsAppMessage, buildOrderConfirmationMessage } from '@/lib/evolution-api';
+
+export async function GET() {
+ const orders = dataService.getOrders();
+ return NextResponse.json({ success: true, orders });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newOrder = dataService.createOrder(body);
+
+ // Enviar confirmación por WhatsApp en background si tiene teléfono válido
+ if (newOrder.customerPhone) {
+ try {
+ const msg = buildOrderConfirmationMessage(newOrder);
+ // Intentar enviar WhatsApp
+ await sendWhatsAppMessage(newOrder.customerPhone, msg);
+ } catch (waErr) {
+ console.warn('No se pudo enviar WhatsApp automático:', waErr);
+ }
+ }
+
+ return NextResponse.json({ success: true, order: newOrder });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/payment-methods/route.ts b/zapply-app/src/app/api/payment-methods/route.ts
new file mode 100644
index 0000000..b49c62d
--- /dev/null
+++ b/zapply-app/src/app/api/payment-methods/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const methods = dataService.getPaymentMethods();
+ return NextResponse.json({ success: true, paymentMethods: methods });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updatePaymentMethod(id, updates);
+ return NextResponse.json({ success: true, paymentMethod: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/products/route.ts b/zapply-app/src/app/api/products/route.ts
new file mode 100644
index 0000000..9ebf898
--- /dev/null
+++ b/zapply-app/src/app/api/products/route.ts
@@ -0,0 +1,46 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET(request: Request) {
+ const { searchParams } = new URL(request.url);
+ const includeAll = searchParams.get('all') === 'true';
+
+ let products = dataService.getProducts();
+ if (!includeAll) {
+ products = products.filter((p) => p.isActive !== false);
+ }
+
+ return NextResponse.json({ success: true, products });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newProduct = dataService.addProduct({
+ ...body,
+ isActive: body.isActive !== undefined ? body.isActive : true,
+ });
+ return NextResponse.json({ success: true, product: newProduct });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const { id, updates } = body;
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID de producto requerido' }, { status: 400 });
+ }
+
+ const updated = dataService.updateProduct(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Producto no encontrado' }, { status: 404 });
+ }
+
+ return NextResponse.json({ success: true, product: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/publish/facebook/route.ts b/zapply-app/src/app/api/publish/facebook/route.ts
new file mode 100644
index 0000000..d2db7a3
--- /dev/null
+++ b/zapply-app/src/app/api/publish/facebook/route.ts
@@ -0,0 +1,12 @@
+import { NextResponse } from 'next/server';
+import { publishToFacebookPage } from '@/lib/facebook-publisher';
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const result = await publishToFacebookPage(body);
+ return NextResponse.json(result);
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/zapply-app/src/app/api/settings/route.ts b/zapply-app/src/app/api/settings/route.ts
new file mode 100644
index 0000000..6073d91
--- /dev/null
+++ b/zapply-app/src/app/api/settings/route.ts
@@ -0,0 +1,17 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+
+export async function GET() {
+ const settings = dataService.getSettings();
+ return NextResponse.json({ success: true, settings });
+}
+
+export async function PUT(request: Request) {
+ try {
+ const body = await request.json();
+ const updated = dataService.updateSettings(body);
+ return NextResponse.json({ success: true, settings: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/users/route.ts b/zapply-app/src/app/api/users/route.ts
new file mode 100644
index 0000000..8b62fad
--- /dev/null
+++ b/zapply-app/src/app/api/users/route.ts
@@ -0,0 +1,57 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { User } from '@/types';
+
+export async function GET() {
+ const users = dataService.getUsers();
+ return NextResponse.json({ success: true, users });
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+ const newUser: User = {
+ id: `usr-${Date.now()}`,
+ name: body.name,
+ email: body.email,
+ phone: body.phone,
+ city: body.city || 'Cali',
+ address: body.address || '',
+ role: body.role || 'customer',
+ isActive: body.isActive !== false,
+ createdAt: new Date().toISOString().split('T')[0],
+ totalOrders: 0,
+ };
+ const saved = dataService.addUser(newUser);
+ return NextResponse.json({ success: true, user: saved });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function PUT(request: Request) {
+ try {
+ const { id, updates } = await request.json();
+ const updated = dataService.updateUser(id, updates);
+ if (!updated) {
+ return NextResponse.json({ success: false, error: 'Usuario no encontrado' }, { status: 404 });
+ }
+ return NextResponse.json({ success: true, user: updated });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
+
+export async function DELETE(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const id = searchParams.get('id');
+ if (!id) {
+ return NextResponse.json({ success: false, error: 'ID requerido' }, { status: 400 });
+ }
+ const deleted = dataService.deleteUser(id);
+ return NextResponse.json({ success: deleted });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 400 });
+ }
+}
diff --git a/zapply-app/src/app/api/webhook/whatsapp/route.ts b/zapply-app/src/app/api/webhook/whatsapp/route.ts
new file mode 100644
index 0000000..3227db1
--- /dev/null
+++ b/zapply-app/src/app/api/webhook/whatsapp/route.ts
@@ -0,0 +1,60 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { parseSupplierMessage } from '@/lib/gemini-parser';
+import { SupplierPost } from '@/types';
+
+export async function GET() {
+ const posts = dataService.getSupplierPosts();
+ return NextResponse.json({ success: true, posts });
+}
+
+export async function POST(request: Request) {
+ try {
+ const payload = await request.json();
+ console.log('📥 Webhook Evolution API recibido:', JSON.stringify(payload).slice(0, 300));
+
+ const data = payload.data || payload;
+
+ const messageContent =
+ data.message?.conversation ||
+ data.message?.extendedTextMessage?.text ||
+ data.message?.imageMessage?.caption ||
+ data.text ||
+ '';
+
+ const channelName =
+ data.pushName ||
+ data.groupInfo?.subject ||
+ (data.key?.remoteJid?.includes('g.us') ? 'Canal Mayorista Entrada' : 'Recepción Directa');
+
+ if (!messageContent || messageContent.trim().length < 5) {
+ return NextResponse.json({ success: true, ignored: 'Mensaje vacío o sin texto relevante' });
+ }
+
+ // Parsear con Gemini AI
+ const extracted = await parseSupplierMessage(messageContent);
+
+ const newPost: SupplierPost = {
+ id: `post-${Date.now()}`,
+ channelName: data.groupInfo?.subject || channelName,
+ rawMessage: messageContent,
+ rawImages: [
+ 'https://images.unsplash.com/photo-1595950653106-6c9ebd614d3a?auto=format&fit=crop&w=800&q=80',
+ ],
+ extractedProduct: extracted,
+ status: 'pending_review',
+ receivedAt: 'Justo ahora',
+ };
+
+ dataService.addSupplierPost(newPost);
+
+ return NextResponse.json({
+ success: true,
+ message: 'Mensaje procesado con IA e ingresado al feed interno',
+ post: newPost,
+ });
+ } catch (error: any) {
+ console.error('Error procesando webhook de WhatsApp:', error);
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/zapply-app/src/app/api/whatsapp-groups/route.ts b/zapply-app/src/app/api/whatsapp-groups/route.ts
new file mode 100644
index 0000000..6f78a1c
--- /dev/null
+++ b/zapply-app/src/app/api/whatsapp-groups/route.ts
@@ -0,0 +1,104 @@
+import { NextResponse } from 'next/server';
+import { dataService } from '@/lib/data-service';
+import { MonitoredWhatsAppGroup } from '@/types';
+
+const EVOLUTION_API_URL = process.env.EVOLUTION_API_URL || 'https://evolution.almeira.com.co';
+const EVOLUTION_API_KEY = process.env.EVOLUTION_API_KEY || 'EE49029EEB85-4568-8F81-C9FDFC6E2943';
+const EVOLUTION_INSTANCE_NAME = process.env.EVOLUTION_INSTANCE_NAME || 'AutomataAlmeira';
+
+export async function GET(request: Request) {
+ try {
+ const { searchParams } = new URL(request.url);
+ const fetchLive = searchParams.get('fetchLive') === 'true';
+
+ const localGroups = dataService.getMonitoredGroups();
+
+ if (!fetchLive) {
+ return NextResponse.json({
+ success: true,
+ groups: localGroups,
+ });
+ }
+
+ // Consultar grupos en vivo desde Evolution API
+ try {
+ const response = await fetch(
+ `${EVOLUTION_API_URL}/group/fetchAllGroups/${EVOLUTION_INSTANCE_NAME}?getParticipants=false`,
+ {
+ headers: {
+ apikey: EVOLUTION_API_KEY,
+ 'Content-Type': 'application/json',
+ },
+ }
+ );
+
+ const liveGroups = await response.json();
+
+ if (Array.isArray(liveGroups)) {
+ const merged: MonitoredWhatsAppGroup[] = liveGroups.map((lg: any) => {
+ const jid = lg.id || lg.jid;
+ const name = lg.subject || lg.name || 'Grupo Sin Nombre';
+ const existing = localGroups.find((g) => g.jid === jid || g.name.toLowerCase() === name.toLowerCase());
+
+ return {
+ id: existing?.id || `grp-${jid.replace(/\D/g, '').slice(-6)}`,
+ jid,
+ name,
+ isMonitored: existing ? existing.isMonitored : false,
+ supplierId: existing?.supplierId,
+ supplierName: existing?.supplierName || name,
+ profitMarginOverride: existing?.profitMarginOverride || 35,
+ autoPublish: existing?.autoPublish ?? true,
+ participantsCount: lg.size || (lg.participants ? lg.participants.length : undefined),
+ notes: existing?.notes || '',
+ };
+ });
+
+ // Asegurar que los locales que no vinieron en live sigan presentes
+ localGroups.forEach((lg) => {
+ if (!merged.some((m) => m.jid === lg.jid || m.id === lg.id)) {
+ merged.unshift(lg);
+ }
+ });
+
+ return NextResponse.json({
+ success: true,
+ isLive: true,
+ totalLive: liveGroups.length,
+ groups: merged,
+ });
+ }
+ } catch (err: any) {
+ console.warn('No se pudo conectar con Evolution API en vivo:', err.message);
+ }
+
+ return NextResponse.json({
+ success: true,
+ isLive: false,
+ groups: localGroups,
+ });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
+
+export async function POST(request: Request) {
+ try {
+ const body = await request.json();
+
+ if (body.action === 'toggle') {
+ const { idOrJid, isMonitored } = body;
+ const updated = dataService.toggleGroupMonitoring(idOrJid, isMonitored);
+ return NextResponse.json({ success: true, group: updated });
+ }
+
+ if (Array.isArray(body.groups)) {
+ const saved = dataService.saveMonitoredGroups(body.groups);
+ return NextResponse.json({ success: true, groups: saved });
+ }
+
+ return NextResponse.json({ success: false, error: 'Datos no válidos' }, { status: 400 });
+ } catch (error: any) {
+ return NextResponse.json({ success: false, error: error.message }, { status: 500 });
+ }
+}
diff --git a/zapply-app/src/app/checkout/page.tsx b/zapply-app/src/app/checkout/page.tsx
new file mode 100644
index 0000000..ea26be7
--- /dev/null
+++ b/zapply-app/src/app/checkout/page.tsx
@@ -0,0 +1,476 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { ArrowLeft, CheckCircle2, ShieldCheck, Truck, Zap, QrCode, Phone, MapPin, User, MessageCircle, ExternalLink, CreditCard } from 'lucide-react';
+import { City, PaymentMethod, Order, StoreSettings } from '@/types';
+import { INITIAL_CITIES, INITIAL_PAYMENT_METHODS, INITIAL_PRODUCTS } from '@/lib/data-service';
+import { formatCOP } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+import confetti from 'canvas-confetti';
+
+export default function CheckoutPage() {
+ const { currentBrand } = useBrand();
+
+ const [customerName, setCustomerName] = useState('');
+ const [customerPhone, setCustomerPhone] = useState('');
+ const [address, setAddress] = useState('');
+ const [neighborhood, setNeighborhood] = useState('');
+ const [notes, setNotes] = useState('');
+
+ const [cities, setCities] = useState
+
+
+ {toastMessage && (
+
+
+
+
+
+
+
+
+ + Administra los accesos de administradores, operadores de logística y clientes registrados de la tienda. +
+
+ {toastMessage}
+
+
+ )}
+
+ {/* KPI Stats Cards */}
+
+
+
+ {/* Filters Toolbar */}
+
+
+
+
+
+
+
+ Administradores
+{adminsCount}
+
+
+
+
+
+
+
+ Operadores Logísticos
+{operatorsCount}
+
+
+
+
+
+
+ Clientes Registrados
+{customersCount}
+
+ {/* Role Pills */}
+
+
+ {/* Users Table */}
+
+
+
+
+
+
+
+ {/* Search */}
+
+ setSearch(e.target.value)}
+ className="w-full bg-slate-900 border border-slate-800 rounded-xl px-3.5 py-2 text-xs text-white outline-hidden focus:border-emerald-400"
+ />
+
+
+
+
+ {/* Modal Create User */}
+ {isModalOpen && (
+
+
+
+
+
+ | Estado | +Usuario | +Contacto Directo | +Ciudad / Dirección | +Rol & Permisos | +Último Acceso | +Acciones | +
|---|---|---|---|---|---|---|
| + No se encontraron usuarios con el filtro seleccionado. + | +||||||
| + + | + + {/* User Avatar & Name */} +
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+ {user.name} + {user.email} + |
+
+ {/* Contact */}
+
+
+
+
+ |
+
+ {/* City */}
+
+
+ {user.city || 'Cali'}
+ {user.address &&
+ {user.address} } + |
+
+ {/* Role Dropdown */}
+ + + | + + {/* Last Login */} ++ {user.lastLogin || user.createdAt} + | + + {/* Actions */} ++ + | +
+
+ )}
+
+
+ Registrar Nuevo Usuario / Operador
+ + +
+
+ );
+ }
+
+ return (
+
+
+
+
+
+
+
+ ¡Pedido Registrado con Éxito!
+
+
+
+ {/* Bold.co or Nequi Separation Box */}
+ {orderCompleted.depositAmount > 0 ? (
+ Orden #{orderCompleted.id}
++ Hemos recibido tu solicitud para entrega en {orderCompleted.cityName} con {currentBrand.name}. +
+
+
+ ) : (
+
+
+ + Paga de inmediato con Link de Pago Bold.co (PSE / Tarjeta / Nequi) o transfiere a nuestra cuenta oficial: +
+ + {boldLink && ( + +
+ 📱 Nequi / Daviplata: {storeSettings?.nequiAccount || '316 745 5877'} ({storeSettings?.accountHolder || 'Carlos Andrés Lasso'})
+
+ + 🤝 Cancelas el saldo de {formatCOP(orderCompleted.balanceDue)} al recibir el paquete en tu casa. +
+
+
+ )}
+
+ + Tu pedido quedó programado para entrega contraentrega en 24 horas. ¡Nos pondremos en contacto contigo por WhatsApp! +
+
+
+
+
+ Volver a la Tienda
+
+
+
+
+ );
+}
diff --git a/zapply-app/src/app/favicon.ico b/zapply-app/src/app/favicon.ico
new file mode 100644
index 0000000..718d6fe
Binary files /dev/null and b/zapply-app/src/app/favicon.ico differ
diff --git a/zapply-app/src/app/globals.css b/zapply-app/src/app/globals.css
new file mode 100644
index 0000000..a2dc41e
--- /dev/null
+++ b/zapply-app/src/app/globals.css
@@ -0,0 +1,26 @@
+@import "tailwindcss";
+
+:root {
+ --background: #ffffff;
+ --foreground: #171717;
+}
+
+@theme inline {
+ --color-background: var(--background);
+ --color-foreground: var(--foreground);
+ --font-sans: var(--font-geist-sans);
+ --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ --background: #0a0a0a;
+ --foreground: #ededed;
+ }
+}
+
+body {
+ background: var(--background);
+ color: var(--foreground);
+ font-family: Arial, Helvetica, sans-serif;
+}
diff --git a/zapply-app/src/app/layout.tsx b/zapply-app/src/app/layout.tsx
new file mode 100644
index 0000000..4272d68
--- /dev/null
+++ b/zapply-app/src/app/layout.tsx
@@ -0,0 +1,61 @@
+import type { Metadata, Viewport } from 'next';
+import { Geist, Geist_Mono } from 'next/font/google';
+import './globals.css';
+import { BrandProvider } from '@/context/BrandContext';
+import { AuthProvider } from '@/context/AuthContext';
+
+const geistSans = Geist({
+ variable: '--font-geist-sans',
+ subsets: ['latin'],
+});
+
+const geistMono = Geist_Mono({
+ variable: '--font-geist-mono',
+ subsets: ['latin'],
+});
+
+export const viewport: Viewport = {
+ themeColor: '#10b981',
+ width: 'device-width',
+ initialScale: 1,
+ maximumScale: 1,
+ userScalable: false,
+ viewportFit: 'cover',
+};
+
+export const metadata: Metadata = {
+ title: 'Zapply Cali • Sneakers Express',
+ description: 'Tu calzado favorito con entrega express y pago contraentrega en 24 horas.',
+ manifest: '/manifest.json',
+ appleWebApp: {
+ capable: true,
+ statusBarStyle: 'black-translucent',
+ title: 'Zapply Cali',
+ },
+ icons: {
+ icon: '/icon.svg',
+ apple: '/icon.svg',
+ },
+};
+
+export default function RootLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+
+
+
+
+
+
+
+ {/* Header */}
+
+
+
+
+
+
+
+
+
+ {/* Navigation Header */}
+ setIsCartOpen(true)}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => setIsCityModalOpen(true)}
+ searchQuery={searchQuery}
+ onSearchChange={setSearchQuery}
+ />
+
+ {/* Main Container */}
+
+ {/* Flash Deals Hero Banner */}
+
+
+ {/* Footer */}
+
+
+ {/* Modals & Drawers */}
+ setSelectedProduct(null)}
+ onAddToCart={handleAddToCart}
+ selectedCity={selectedCity}
+ />
+
+ setIsCartOpen(false)}
+ cartItems={cartItems}
+ onRemoveItem={handleRemoveFromCart}
+ onUpdateQuantity={handleUpdateQuantity}
+ selectedCity={selectedCity}
+ onOpenCitySelector={() => {
+ setIsCartOpen(false);
+ setIsCityModalOpen(true);
+ }}
+ />
+
+ setIsCityModalOpen(false)}
+ cities={cities}
+ selectedCity={selectedCity}
+ onSelectCity={setSelectedCity}
+ />
+
+ {/* Mobile App Dock & Install Banner */}
+ setIsCartOpen(true)}
+ onOpenInstallModal={() => setIsInstallModalOpen(true)}
+ />
+
+ setIsInstallModalOpen(false)}
+ />
+
+ {/* User Auth Modal */}
+
+ );
+}
diff --git a/zapply-app/src/components/auth/AuthModal.tsx b/zapply-app/src/components/auth/AuthModal.tsx
new file mode 100644
index 0000000..6d4662e
--- /dev/null
+++ b/zapply-app/src/components/auth/AuthModal.tsx
@@ -0,0 +1,255 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, User, Lock, Mail, Phone, MapPin, Sparkles, LogIn, UserPlus, Shield, LogOut } from 'lucide-react';
+import { useAuth } from '@/context/AuthContext';
+import { useBrand } from '@/context/BrandContext';
+import Link from 'next/link';
+
+export const AuthModal: React.FC = () => {
+ const { user, login, register, logout, isAuthModalOpen, closeAuthModal } = useAuth();
+ const { currentBrand } = useBrand();
+
+ const [mode, setMode] = useState<'login' | 'register'>('login');
+ const [identifier, setIdentifier] = useState('');
+ const [name, setName] = useState('');
+ const [email, setEmail] = useState('');
+ const [phone, setPhone] = useState('');
+ const [city, setCity] = useState('Cali');
+ const [address, setAddress] = useState('');
+ const [error, setError] = useState
+
+
+ {/* Category & Brand Filters */}
+
+
+
+
+
+
+
+ Entrega en 24 Horas
+Directo en Cali
+
+
+
+
+
+
+
+ Pago Contraentrega
+Cancelas al recibir
+
+
+
+
+
+
+
+ Separa con $10.000
+Aparta tu talla
+
+
+
+
+
+
+ Garantía Total
+Cambio asegurado
+
+
+
+ {/* Product Grid */}
+ {filteredProducts.length === 0 ? (
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+
+
+
+ {filteredProducts.length} {filteredProducts.length === 1 ? 'modelo' : 'modelos'}
+
+
+
+ ) : (
+
+
+ No encontramos zapatillas con ese criterio
+Intenta buscar otra marca o restablecer los filtros.
+ +
+ {filteredProducts.map((product) => (
+ handleAddToCart(p, size)}
+ />
+ ))}
+
+ )}
+
+
+ );
+};
diff --git a/zapply-app/src/components/mobile/MobileBottomDock.tsx b/zapply-app/src/components/mobile/MobileBottomDock.tsx
new file mode 100644
index 0000000..6b515f3
--- /dev/null
+++ b/zapply-app/src/components/mobile/MobileBottomDock.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import Link from 'next/link';
+import { Home, Search, ShoppingBag, MessageCircle, Download, Check } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileBottomDockProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ onOpenSearch?: () => void;
+ onOpenInstallModal: () => void;
+}
+
+export const MobileBottomDock: React.FC
+
+
+ {/* If user is already logged in: View Profile */}
+ {user ? (
+
+
+
+ ) : (
+ /* Login or Register */
+
+ {user.name.charAt(0).toUpperCase()}
+
+
+
+
+ {user.name}
+{user.email}
+
+
+ {user.role === 'admin' ? '👑 Administrador' : user.role === 'operator' ? '📦 Operador Logística' : '🛍️ Cliente Registrado'}
+
+
+
+
+
+ {user.role === 'admin' || user.role === 'operator' ? (
+
+ 📱 Celular: {user.phone}
+📍 Ciudad: {user.city || 'Cali'}
+ {user.address &&🏠 Dirección: {user.address}
} +
+
+ )}
+
+
+
+ {/* Mode Switch Tabs */}
+
+ {currentBrand.shortName[0]}
+
+
+
+ + {mode === 'login' ? 'Iniciar Sesión' : 'Crear Cuenta'} +
++ {mode === 'login' + ? 'Accede para gestionar pedidos o entrar como admin' + : 'Regístrate para compras rápidas y seguimiento'} +
+
+
+
+
+
+ {error && (
+
+ {error}
+
+ )}
+
+ {mode === 'login' ? (
+
+ ) : (
+
+ )}
+
+
+ );
+};
diff --git a/zapply-app/src/components/mobile/MobileInstallBanner.tsx b/zapply-app/src/components/mobile/MobileInstallBanner.tsx
new file mode 100644
index 0000000..123dd0b
--- /dev/null
+++ b/zapply-app/src/components/mobile/MobileInstallBanner.tsx
@@ -0,0 +1,125 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Download, Sparkles, X, Smartphone, CheckCircle, Share2, PlusSquare } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+interface MobileInstallBannerProps {
+ isOpen: boolean;
+ onClose: () => void;
+}
+
+export const MobileInstallBanner: React.FC
+ setActiveTab('home')}
+ className={`flex flex-col items-center gap-0.5 cursor-pointer transition-all ${
+ activeTab === 'home' ? 'text-white' : 'text-slate-400 hover:text-slate-200'
+ }`}
+ >
+
+
+
+ );
+};
diff --git a/zapply-app/src/components/store/CartDrawer.tsx b/zapply-app/src/components/store/CartDrawer.tsx
new file mode 100644
index 0000000..bca5a6d
--- /dev/null
+++ b/zapply-app/src/components/store/CartDrawer.tsx
@@ -0,0 +1,254 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { X, Trash2, ShoppingBag, ArrowRight, Zap, Truck, MessageCircle } from 'lucide-react';
+import { CartItem, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface CartDrawerProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cartItems: CartItem[];
+ onRemoveItem: (productId: string, size: string) => void;
+ onUpdateQuantity: (productId: string, size: string, delta: number) => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+}
+
+export const CartDrawer: React.FC
+
+
+
+
+
+
+
+ {currentBrand.shortName[0]}
+
+
+
+ Instalar {currentBrand.name}
+Aplicación Móvil para Android & iPhone
+
+
+
+ {isIOS ? (
+
+
+
+
+
+
+
+
+ ) : deferredPrompt ? (
+
+ ) : (
+
+
-
+
- Toca el botón Compartir
abajo en Safari.
+ - Desliza hacia abajo y selecciona "Agregar a Inicio
".
+ - ¡Listo! El icono de {currentBrand.shortName} aparecerá en tu teléfono. +
+
+ )}
+
+
+
+ Para instalar en tu navegador:
++ Abre el menú de opciones del navegador (los 3 puntos arriba a la derecha) y toca "Instalar aplicación" o "Agregar a pantalla principal". +
+
+ {/* Backdrop */}
+
+
+
+ );
+};
diff --git a/zapply-app/src/components/store/CategoryPills.tsx b/zapply-app/src/components/store/CategoryPills.tsx
new file mode 100644
index 0000000..be49b4b
--- /dev/null
+++ b/zapply-app/src/components/store/CategoryPills.tsx
@@ -0,0 +1,48 @@
+'use client';
+
+import React from 'react';
+import { useBrand } from '@/context/BrandContext';
+
+interface CategoryPillsProps {
+ activeCategory: string;
+ onSelectCategory: (category: string) => void;
+}
+
+const CATEGORIES = [
+ { id: 'all', label: '🔥 Todas las Zapatillas' },
+ { id: 'Nike', label: '👟 Nike' },
+ { id: 'Jordan', label: '🏀 Air Jordan' },
+ { id: 'Adidas', label: '🛹 Adidas' },
+ { id: 'New Balance', label: '🌿 New Balance' },
+ { id: 'Puma', label: '🐆 Puma' },
+ { id: 'flash', label: '⚡ Ofertas Flash' },
+ { id: 'under120', label: '💰 Menos de $120k' },
+];
+
+export const CategoryPills: React.FC
+
+
+ {/* Header */}
+
+
+
+
+ {/* Items List */}
+
+
+
+
+
+
+
+ Tu Carrito • {currentBrand.shortName}
+{cartItems.length} {cartItems.length === 1 ? 'artículo' : 'artículos'}
+
+ {cartItems.length === 0 ? (
+
+
+ {/* Footer & Checkout Breakdown */}
+ {cartItems.length > 0 && (
+
+
+ ) : (
+ cartItems.map((item, idx) => (
+
+
+ Tu carrito está vacío
++ Aprovecha las ofertas de calzado con pago contraentrega en Cali y despachos nacionales. +
+ +
+
+
+ ))
+ )}
+
+
+
+
+
+
+
+ + {item.product.name} +
+ +
+
+ Talla {item.selectedSize}
+
+
+ {item.product.brand}
+
+
+
+
+ {formatCOP(item.product.retailPrice * item.quantity)}
+
+
+
+
+ {item.quantity}
+
+
+
+ {/* City Delivery selector pill */}
+
+ )}
+
+
+
+ {/* Price Calculations */}
+
+
+
+
+
+
+ {/* Separation Highlight Banner */}
+
+ Subtotal:
+ {formatCOP(subtotal)}
+
+
+ Costo de Envío:
+
+ {shippingCost === 0 ? Gratis : formatCOP(shippingCost)}
+
+
+
+ Total de la Orden:
+
+ {formatCOP(totalAmount)}
+
+
+
+
+
+ {/* Action Buttons */}
+
+
+ Separas con {formatCOP(separation.depositAmount)} y pagas {formatCOP(separation.balanceDue)} al recibir contraentrega en tu casa. +
++ 🛡️ {selectedCity.firstExchangeFree + ? `1er Cambio de Talla 100% GRATIS en ${selectedCity.name}` + : `Garantía de cambio en ${selectedCity.name} (flete asumido por cliente)`} +
+
+
+ Proceder al Pago Contraentrega
+
+
+ {CATEGORIES.map((cat) => {
+ const isActive = activeCategory === cat.id;
+ return (
+
+ );
+ })}
+
+ );
+};
diff --git a/zapply-app/src/components/store/CitySelectorModal.tsx b/zapply-app/src/components/store/CitySelectorModal.tsx
new file mode 100644
index 0000000..02530ce
--- /dev/null
+++ b/zapply-app/src/components/store/CitySelectorModal.tsx
@@ -0,0 +1,109 @@
+'use client';
+
+import React from 'react';
+import { X, MapPin, Check, Truck } from 'lucide-react';
+import { City } from '@/types';
+import { formatCOP } from '@/lib/pricing-engine';
+
+interface CitySelectorModalProps {
+ isOpen: boolean;
+ onClose: () => void;
+ cities: City[];
+ selectedCity: City;
+ onSelectCity: (city: City) => void;
+}
+
+export const CitySelectorModal: React.FC
+
+ );
+};
diff --git a/zapply-app/src/components/store/FlashDealsBanner.tsx b/zapply-app/src/components/store/FlashDealsBanner.tsx
new file mode 100644
index 0000000..e26b007
--- /dev/null
+++ b/zapply-app/src/components/store/FlashDealsBanner.tsx
@@ -0,0 +1,83 @@
+'use client';
+
+import React, { useState, useEffect } from 'react';
+import { Zap, Clock, Gift } from 'lucide-react';
+import { useBrand } from '@/context/BrandContext';
+
+export const FlashDealsBanner: React.FC = () => {
+ const { currentBrand } = useBrand();
+ const [timeLeft, setTimeLeft] = useState({ hours: 4, minutes: 27, seconds: 15 });
+
+ useEffect(() => {
+ const timer = setInterval(() => {
+ setTimeLeft((prev) => {
+ if (prev.seconds > 0) {
+ return { ...prev, seconds: prev.seconds - 1 };
+ } else if (prev.minutes > 0) {
+ return { ...prev, minutes: 59, seconds: 59 };
+ } else if (prev.hours > 0) {
+ return { hours: prev.hours - 1, minutes: 59, seconds: 59 };
+ }
+ return { hours: 5, minutes: 59, seconds: 59 };
+ });
+ }, 1000);
+ return () => clearInterval(timer);
+ }, []);
+
+ const pad = (n: number) => n.toString().padStart(2, '0');
+
+ return (
+
+ {/* Header */}
+
+
+
+
+ {/* City list */}
+
+
+
+
+
+
+
+ Selecciona tu Ciudad
+Calculamos tiempos y tarifas oficiales
+
+ {cities
+ .filter((c) => c.isActive !== false)
+ .map((city) => {
+ const isSelected = selectedCity.id === city.id;
+ const hasCod = city.allowsContraentrega || city.allowCod;
+
+ return (
+
+
+ {/* Info footer */}
+ {
+ onSelectCity(city);
+ onClose();
+ }}
+ className={`p-3 rounded-2xl border transition-all cursor-pointer flex items-center justify-between ${
+ isSelected
+ ? 'border-emerald-400 bg-emerald-950/50 shadow-[0_0_15px_rgba(16,185,129,0.2)]'
+ : 'border-slate-800 hover:border-slate-700 bg-slate-950'
+ }`}
+ >
+
+ );
+ })}
+
+
+
+
+ {city.name}
+ {hasCod && (
+
+ Contraentrega
+
+ )}
+
+
+
+
+ {city.shippingCost === 0 ? (
+ Gratis
+ ) : (
+ formatCOP(city.shippingCost)
+ )}
+
+ {isSelected && (
+
+
+
+ )}
+
+ 💡 En Cali y zona metropolitana: entregas el mismo día con mensajería directa y pago contraentrega.
+
+
+ {/* Background glow meshes */}
+
+
+
+
+ );
+};
diff --git a/zapply-app/src/components/store/Navbar.tsx b/zapply-app/src/components/store/Navbar.tsx
new file mode 100644
index 0000000..55d13a9
--- /dev/null
+++ b/zapply-app/src/components/store/Navbar.tsx
@@ -0,0 +1,152 @@
+'use client';
+
+import React from 'react';
+import Link from 'next/link';
+import { ShoppingBag, Search, MapPin, Zap, Sparkles, ShieldCheck, Store, User as UserIcon } from 'lucide-react';
+import { City } from '@/types';
+import { useBrand } from '@/context/BrandContext';
+import { useAuth } from '@/context/AuthContext';
+
+interface NavbarProps {
+ cartCount: number;
+ onOpenCart: () => void;
+ selectedCity: City;
+ onOpenCitySelector: () => void;
+ searchQuery: string;
+ onSearchChange: (q: string) => void;
+}
+
+export const Navbar: React.FC
+ {/* Left text */}
+
+
+
+
+ {/* Right Countdown Box */}
+
+
+ + Zapatillas Premium hasta con{' '} + + 35% OFF + +
++ Lanzamientos exclusivos directos de bodega. Separa tu par con $10.000 COP y paga el saldo en efectivo o transferencia con Pago Contraentrega en tu casa. +
+
+
+
+
+
+
+
+ {pad(timeLeft.hours)}
+ Horas
+
+ :
+
+ {pad(timeLeft.minutes)}
+ Min
+
+ :
+
+ {pad(timeLeft.seconds)}
+ Seg
+
+
+
+
+
+
+ {/* Main Navbar */}
+
+
+
+
+
+
+
+
+ {/* Brand Logo */}
+
+
+
+
+
+
+ {currentBrand.logo.iconText}
+
+
+
+
+
+
+ {/* City Selector Pill */}
+
+
+ {/* Search Bar */}
+
+ {currentBrand.logo.mainText}
+
+ {currentBrand.logo.accentText}
+
+
+ {currentBrand.tagline}
+
+
+
+ {/* Right Actions */}
+
+ onSearchChange(e.target.value)}
+ className="w-full bg-slate-900/90 text-white placeholder-slate-400 text-xs sm:text-sm rounded-full pl-10 pr-4 py-2 border border-slate-700 focus:border-emerald-400 focus:ring-2 focus:ring-emerald-500/20 transition-all outline-hidden"
+ />
+
+
+ {/* User Auth Button */}
+
+
+ {/* Admin Link */}
+
+
+ onOpenDetail(product)}
+ className={`group rounded-2xl border transition-all duration-300 flex flex-col cursor-pointer overflow-hidden ${currentBrand.colors.cardBg}`}
+ >
+ {/* Image Container */}
+
+ );
+};
diff --git a/zapply-app/src/components/store/ProductModal.tsx b/zapply-app/src/components/store/ProductModal.tsx
new file mode 100644
index 0000000..ce518d5
--- /dev/null
+++ b/zapply-app/src/components/store/ProductModal.tsx
@@ -0,0 +1,222 @@
+'use client';
+
+import React, { useState } from 'react';
+import { X, Star, Truck, ShieldCheck, Zap, MessageCircle, ShoppingBag, Check } from 'lucide-react';
+import { Product, City } from '@/types';
+import { formatCOP, calculateSeparationBreakdown } from '@/lib/pricing-engine';
+import { useBrand } from '@/context/BrandContext';
+
+interface ProductModalProps {
+ product: Product | null;
+ onClose: () => void;
+ onAddToCart: (product: Product, size: string) => void;
+ selectedCity: City;
+}
+
+export const ProductModal: React.FC
+
+
+ {/* Badges */}
+
+
+ {/* Product Info */}
+
+
+ -{discountPercent}% OFF
+
+ {product.isFlashDeal && (
+
+
+
+
+
+
+
+
+
+ {/* Rating and Sales */}
+
+
+ {/* Pricing & Separation terms */}
+
+
+
+ {/* Product Title */}
+
+
+
+ +{product.salesCount || 150} pedidos
+
+ + {product.name} +
+ + {/* Available Sizes Pills */} +
+ Tallas:
+ {product.sizes.slice(0, 5).map((size) => (
+
+ {size}
+
+ ))}
+ {product.sizes.length > 5 && (
+ +{product.sizes.length - 5}
+ )}
+
+
+
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ + ⚡ Separa con {formatCOP(separation.depositAmount)} y cancelas {formatCOP(separation.balanceDue)} al recibir. +
+ + {/* Quick Action Button */} +
+
+
+
+
+ );
+};
diff --git a/zapply-app/src/config/brands.ts b/zapply-app/src/config/brands.ts
new file mode 100644
index 0000000..fe598a2
--- /dev/null
+++ b/zapply-app/src/config/brands.ts
@@ -0,0 +1,151 @@
+export type BrandId = 'almeira' | 'sneaky' | 'zapply' | 'dripzone';
+
+export interface BrandTheme {
+ id: BrandId;
+ name: string;
+ shortName: string;
+ tagline: string;
+ badge: string;
+ couponCode: string;
+ whatsappNumber: string;
+
+ // Clases y colores de diseño personalizados para cada una de las 4 marcas
+ colors: {
+ primaryGradient: string;
+ secondaryGradient: string;
+ heroGradient: string;
+ accentGlow: string;
+ headerBg: string;
+ bodyBg: string;
+ cardBg: string;
+ border: string;
+ textAccent: string;
+ badgeBg: string;
+ badgeText: string;
+ cartBadge: string;
+ };
+
+ logo: {
+ iconText: string;
+ mainText: string;
+ accentText: string;
+ };
+}
+
+export const BRANDS: Record
+ {/* Close Button */}
+
+
+ {/* Left: Images */}
+
+
+
+
+ {/* Right: Product Details & Actions */}
+
+
+
+ -{Math.round(((product.originalPrice || 170000) - product.retailPrice) / (product.originalPrice || 170000) * 100)}% OFF
+
+
+
+ {/* Thumbnails */}
+ {product.images.length > 1 && (
+
+ {product.images.map((img, i) => (
+
+ ))}
+
+ )}
+
+ {/* Trust note */}
+
+
+
+
+
+
+
+ {/* Action Buttons */}
+
+ {product.brand}
+
+
+ {/* Price Box */}
+ {product.name}
+
+
+
+
+ •
+ +{product.salesCount || 200} pares entregados
+
+
+
+ {/* Size Selector */}
+
+
+ {formatCOP(product.retailPrice)}
+
+ {product.originalPrice && (
+
+ {formatCOP(product.originalPrice)}
+
+ )}
+
+
+ {/* Separation breakdown banner */}
+
+
+
+
+ Separas con solo {formatCOP(separation.depositAmount)} y pagas los {formatCOP(separation.balanceDue)} al recibir en tu puerta. +
+
+
+
+ {/* Description */}
+
+ Selecciona tu Talla (Nacional CO):
+ Guía de Tallas
+
+
+ {product.sizes.map((size) => (
+
+ ))}
+
+
+
+
+ {/* Shipping note */}
+ {product.description}
+
+
+
+ {selectedCity.name}:
+ {selectedCity.deliveryTime} ({selectedCity.shippingCost === 0 ? 'Envío Gratis' : formatCOP(selectedCity.shippingCost)})
+
+
+
+
+
+
+