Dashboard de uso

Tres medidores (caracteres de entrenamiento, mensajes, chatbots) en /app/usage, con bandas de color en 75%, 90% y 100%.

La página de uso en /app/usage muestra tres medidores contra los límites de tu plan. La urgencia va creciendo a medida que te acercás a alguno.

Header de la página

  • Eyebrow: USAGE
  • Encabezado: How much of your plan you're using
  • Subtítulo: "[nombre del plan] plan". Si el período de facturación tiene fecha de inicio y fin, se agrega "· resets [fecha de fin]".

Link arriba a la derecha: See plans →

Umbrales

Cada medidor se colorea según cuánto usaste:

Porcentaje usado Nivel Color
0 – 74% OK primary
75 – 89% Warning ámbar
90 – 99% Crítico rojo
100% Lleno rojo

Banners de warning y crítico

Aparece un banner arriba de los medidores según el medidor más urgente:

  • Si algún medidor está crítico o lleno y existe un plan más alto al que podés pasar: banner crítico (rojo).
  • Si no, si algún medidor está en warning y existe un plan más alto: banner warning (ámbar).

Copy de crítico (textual)

  • Encabezado: "You've hit one or more plan limits"
  • Body: "Your chatbots will stop accepting new content, messages, or training until you upgrade."
  • Botón: Upgrade to [nombre del siguiente plan] (filled)

Copy de warning (textual)

  • Encabezado: "You're approaching your plan limits"
  • Body: "Upgrade to [nombre del siguiente plan] to avoid interruptions and keep growing."
  • Botón: See plans (outline)

Ambos botones van a /app/billing.

Medidor hero — Training content

El primer medidor, en su propia card más grande:

  • Label: Training content
  • Subtítulo: "Total characters across every chatbot. This is your primary training limit — once you hit it, new URLs, files, and Q&As are rejected."
  • Valores used y max formateados con sufijos K / M
  • Barra de progreso coloreada por nivel (primary / ámbar / rojo)
  • Línea de footer (solo cuando el medidor está en warning, crítico o lleno y existe un plan más alto): "[siguiente plan] gives you [N] characters · Upgrade for $[precio]/[intervalo]" — el "Upgrade for…" es un link a la página de billing.

Dos medidores secundarios

Lado a lado debajo del hero:

Messages

  • Label: Messages
  • Subtítulo:
    • Cuando el período de facturación tiene fechas de inicio y fin: "[inicio] → [fin]"
    • Si no: "This billing period"
  • Hint de estado vacío (se muestra cuando estás bastante debajo del límite): "When your chatbot runs out of messages, visitors see an error instead of a reply."

Chatbots

  • Label: Chatbots
  • Subtítulo: "Total active bots on your account"
  • Hint de estado vacío (se muestra cuando estás bastante debajo del límite): "One use case per chatbot: separate bots for sales, support, and FAQ each train on their own content."

Ambos medidores secundarios reemplazan el hint vacío con "[siguiente plan]: [valor] →" como link cuando cruzás a warning o peor.

Card de "What you're missing"

Se muestra solo si existe un plan más alto al que podrías pasar:

  • Eyebrow: "Unlocks on [siguiente plan]" (o "Get more with [siguiente plan]" cuando un medidor está crítico o lleno)
  • Encabezado: "What you're missing on [plan actual]"
  • Body: "Upgrade to [siguiente plan] for $[precio]/[intervalo] and unlock:"

La lista de bullets contiene:

  1. Un ítem por cada feature que suma el siguiente plan
  2. "[N] training chars (currently [M])"
  3. "[N] messages/mo (currently [M])"

Labels de features (textual)

Estos labels aparecen solo en la lista "what you're missing" de la página de usage — difieren levemente de los de la página de billing:

  • "WhatsApp integration (10× engagement vs web)"
  • "Telegram integration"
  • "AI Tools — lead capture, booking, email send, webhooks"
  • "Human handoff — seamlessly hand hot leads to your team"
  • "Remove ChatbotGen branding from the widget"
  • "Priority support (24h response SLA)"

Lado derecho de la card:

  • Cuando algún medidor está crítico: un link silencioso "Go to billing →" (ya que el banner crítico arriba ya tiene el CTA principal)
  • Si no: un botón grande Upgrade to [siguiente plan] →

Una franja muteada al fondo:

Operational limits (per chatbot)

Documents: up to [N] · URLs: up to [N]

Estos números vienen de tu plan y son informativos — no se muestran como medidores. En la práctica, la barra que tenés que mirar es la de caracteres de entrenamiento.

Estado de carga

Si los datos de uso todavía no cargaron, la página muestra "Loading usage…" y nada más.

Relacionado

← Anterior
Planes y precios
Siguiente →
Administrar tu suscripción