Cotizador Walmart Connect

Frontend interno de GomezLee Marketing para cotizaciones Walmart Connect.

Estado de esta versión

Esta versión ya está conectada a la arquitectura de producción definida para el proyecto:

• Supabase Auth + control de acceso cotizador_wmc_access.
• n8n /webhook/cotizador-wmc-chat para Gemini, tarifario, históricos y generación de artefactos.
• n8n /webhook/cotizador-wmc-reportar para reportes de usuario.
• Persistencia de conversaciones y mensajes en Supabase.
• Adjuntos privados en el bucket cotizador-wmc-uploads, con URLs firmadas temporales para n8n/Gemini.
• Analítica global mediante glm_track_app_event para alimentar el dashboard general de aplicaciones GLM.
• Módulo Tarifario visible únicamente cuando can_use_tarifario=true, con lectura y cambios auditados mediante los RPC seguros de Supabase.
• Google Sheets / Slides / imágenes se generan desde los workflows de n8n y el Apps Script ya configurado en backend.

Tecnologías

• React 19 + TypeScript
• TanStack Router / Query
• Vite (SPA estática)
• Tailwind CSS
• Supabase JS

Ruta de producción

https://digitalcompass.agency/cotizador-wmc/

La aplicación se compila con base:

/cotizador-wmc/

Configuración frontend

El .env incluido contiene las variables públicas necesarias para compilar esta versión:

VITE_SUPABASE_URL="https://dbit.digitalcompass.agency"
VITE_SUPABASE_ANON_KEY="..."
VITE_REPORT_WEBHOOK_URL="https://agenteit.digitalcompass.agency/webhook/cotizador-wmc-reportar"
VITE_CHAT_WEBHOOK_URL="https://agenteit.digitalcompass.agency/webhook/cotizador-wmc-chat"

La ANON KEY de Supabase es una clave pública de cliente. No debe agregarse service_role al frontend.

Desarrollo / build

npm ci
npm run dev
npm run build

npm run build genera una carpeta dist/ lista para el despliegue del frontend estático. La ruta base de producción se mantiene en /cotizador-wmc/.

Flujo de uso

1. El usuario inicia sesión con Google mediante Supabase Auth.
2. La app verifica dominio GLM + acceso activo en cotizador_wmc_access.
3. Al entrar se registra actividad para métricas globales de uso.
4. Cada chat se conserva en Supabase y además mantiene respaldo local del navegador.
5. Los adjuntos se guardan en Storage privado antes de llamar a n8n.
6. La app envía a n8n el JWT real de Supabase, usuario, conversación, mensaje, adjuntos y appSessionId.
7. n8n consulta contexto/tarifario/históricos, llama Gemini y devuelve la respuesta y, cuando aplique, el enlace del Google Sheet, Google Slides o imagen generado.
8. La respuesta y sus metadatos quedan guardados en el historial.

Tarifario

El botón Tarifario solo aparece para usuarios con can_use_tarifario=true.

Desde el módulo se puede:

• buscar y filtrar por país;
• consultar tarifa vigente;
• crear una tarifa;
• editar una tarifa;
• eliminar/desactivar una tarifa.

Los cambios no escriben directamente sobre la tabla desde el navegador: utilizan cotizador_wmc_process_my_agent_action, que valida de nuevo el permiso y conserva auditoría.

Analítica para dashboard GLM

La app registra eventos autenticados con glm_track_app_event, entre ellos:

• app_open;
• message_sent;
• chat_deleted;
• tariff_opened;
• agent_error;
• logout.

Los workflows registran adicionalmente las cotizaciones, propuestas, imágenes, mensualizaciones GLM, ejecuciones del agente y reportes, por lo que las vistas de dashboard de Supabase pueden calcular usuarios únicos, usuarios mensuales, promedio mensual, cotizaciones creadas y demás KPIs definidos.