CreaRack-SL

Ordenamiento por fecha en tabla CNS (v1.61.4)

Funcionalidadactivecreado Fri Jul 17#monitoring#cns#ui-ux#performance#observability#django

Resumen

Mejora de usabilidad en la tabla de incidencias de Inteligencia Artificial (CNS) que permite a los operadores:

  1. Toggling de orden por fecha: un botón de texto “Más recientes primero” / “Más antiguos primero” junto al filtro de riesgo (Regla 7: sin iconos).
  2. Control de viewport: reducción de PAGE_SIZE de 25 a 22 filas para que los botones de paginación siempre entren sin barra de scroll a zoom 100 %.

Afecta a las 4 páginas que contienen la tabla CNS:

  • Observatory
  • Wireless
  • UPS
  • Signage

Cambios funcionales

Parámetro de API: ?sort=asc|desc

Endpoint: GET /api/monitoring/sentinel/insights/

  • Default: sort=desc (más recientes primero, por defecto)
  • Toggle: sort=asc (más antiguos primero)
  • Comportamiento seguro: cualquier otro valor cae al default desc
  • Razón técnica: AIInsight.objects.annotate(Count()) introduce un GROUP BY que deroga el Meta.ordering="-created_at" en Django. Sin order_by explícito, la lista salía por PK ascendente (insights más antiguos primero). Con miles de insights nuevos, caían en la última página y parecía que no existían (incidente s229). Ahora es obligatorio pasar el order_field dinámicamente.

Lógica de toggle en frontend

Componente: ScopedInsightTab (static/js/services/ScopedInsightTab.js)

  • Nuevo filtro en _filters: { ..., order: 'desc' }
  • Método público toggleSort(): invierte _filters.order entre 'asc' y 'desc', reinicia paginación a offset 0 y recarga.
  • Botón actualiza su etiqueta según estado: “Más recientes primero” ↔ “Más antiguos primero”
  • Botón HTML: <button class="btn btn-xs btn-neutral" data-action="[namespace].cnsToggleSort" ...>
  • Delegaciones en observatory.js, signage.js, ups.js, wireless.js → cnsToggleSortFn() → toggleSort()

PAGE_SIZE: 25 → 22

Archivo: static/js/services/ScopedInsightTab.js

Reducción de 3 filas para aliviar el viewport en resoluciones estándar. A 22 filas, los botones de paginación entran sin overflow a zoom 100 %.

Localización

Archivo: locale/es/LC_MESSAGES/djangojs.po

Tres msgid nuevos:

  • "Newest first" → "Más recientes primero"
  • "Oldest first" → "Más antiguos primero"
  • "Toggle sort order by date (newest / oldest first)" → "Cambiar el orden por fecha (más recientes / más antiguos primero)"

Testing

Test añadido: tests/api/test_monitoring.py

# sort=asc invierte el orden (más antiguo primero) — el toggle de la UI.
asc = authenticated_client.get("/api/monitoring/sentinel/insights/?limit=20&sort=asc")
assert asc.status_code == 200
asc_ids = [i["id"] for i in json.loads(asc.content)["insights"]]
assert asc_ids[:4] == ids_by_age  # IDs en orden ascendente (por antigüedad)

Versionado

  • v1.61.4 — 2026-07-17
  • CHANGELOG.md y RELEASE_NOTES.md actualizados
  • APP_VERSION en config/settings/base.py: “1.61.3” → “1.61.4”

Implementación por página

Cada página (Observatory, Wireless, UPS, Signage) obtiene:

  • Parámetro sort=asc|desc en las queries API a GET /sentinel/insights/
  • Método delegado [PageModule].cnsToggleSort() que invoca ScopedInsightTab.toggleSort()
  • Botón en la barra de filtros de la tabla CNS
  • El estado del toggle persiste mientras el usuario permanece en la página (se reinicia al cargar)

Véase también

  • [[entity—monitoring—model—aiinsight]]
  • [[feature—monitoring—auditoria-suprema-sa3-cns-insights-ia]]
  • [[feature—monitoring—auditoria-suprema-sa6-observatory-realtime]]
  • [[feature—monitoring—observatory-unified-sidebar]]
  • [[concept—saas—observability]]