paco/rag-service
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add branding and visible log counter to playground

Browse source
This commit is contained in:
Paco POR-CORREO 2026-04-06 20:48:09 +02:00
parent c34bc3b5d7
commit 75660f4c8c
5 changed files with 76 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
RAG/docs/PLAYGROUND.md
View file

@ -2,7 +2,7 @@
**Proyecto:** Workspace de tools IA para empresas **Proyecto:** Workspace de tools IA para empresas
**Modulo:** RAG **Modulo:** RAG
**Ultima actualizacion:** 2026-04-05 **Ultima actualizacion:** 2026-04-06
**Ultima modificacion por:** Agente tools IA para potenciar servicios empresariales **Ultima modificacion por:** Agente tools IA para potenciar servicios empresariales
**Estado:** Implementado en codigo, pendiente de redeploy **Estado:** Implementado en codigo, pendiente de redeploy
@ -61,6 +61,8 @@ Tambien permite:
- ajustar `scope` - ajustar `scope`
- seleccionar el modelo de respuesta - seleccionar el modelo de respuesta
- usar presets para docs, docs del modulo y codigo del RAG - usar presets para docs, docs del modulo y codigo del RAG
- ver un contador visible de logs recientes
- mostrar branding visual del servicio en la cabecera
--- ---
@ -155,6 +157,7 @@ Aunque de momento el playground no tiene una pestaña dedicada solo a logs, si p
- registrar logs manuales - registrar logs manuales
- mostrar logs recientes - mostrar logs recientes
- mostrar un contador visible de logs en cabecera para saber de un vistazo si el sistema esta generando incidencias o revisiones
Y estos logs ya quedan preparados para ser revisados despues por el usuario junto con este agente u otros agentes. Y estos logs ya quedan preparados para ser revisados despues por el usuario junto con este agente u otros agentes.

3
RAG/public/playground/app.js
View file

@ -21,6 +21,7 @@ const contextIndicator = document.getElementById("contextIndicator");
const contextStatusText = document.getElementById("contextStatusText"); const contextStatusText = document.getElementById("contextStatusText");
const contextScopeText = document.getElementById("contextScopeText"); const contextScopeText = document.getElementById("contextScopeText");
const logsResult = document.getElementById("logsResult"); const logsResult = document.getElementById("logsResult");
const logCounterValue = document.getElementById("logCounterValue");
const ingestSourceType = document.getElementById("ingestSourceType"); const ingestSourceType = document.getElementById("ingestSourceType");
const ingestScopeMode = document.getElementById("ingestScopeMode"); const ingestScopeMode = document.getElementById("ingestScopeMode");
@ -230,8 +231,10 @@ async function loadRecentLogs() {
try { try {
const logs = await fetch("/logs/recent").then((response) => response.json()); const logs = await fetch("/logs/recent").then((response) => response.json());
logsResult.textContent = format(logs); logsResult.textContent = format(logs);
logCounterValue.textContent = Array.isArray(logs) ? String(logs.length) : "0";
} catch (error) { } catch (error) {
logsResult.textContent = String(error); logsResult.textContent = String(error);
logCounterValue.textContent = "0";
} }
} }

17
RAG/public/playground/index.html
View file

@ -9,12 +9,21 @@
<body> <body>
<main class="layout"> <main class="layout">
<header class="hero"> <header class="hero">
<div> <div class="hero-brand">
<img class="brand-logo" src="https://por-correo.com/templates/yootheme/cache/e5/logo_por-correo-e574d3f1.webp" alt="POR-CORREO" />
<div>
<p class="eyebrow">RAG Playground</p> <p class="eyebrow">RAG Playground</p>
<h1>Laboratorio del RAG</h1> <h1>Laboratorio de pruebas sistema RAG</h1>
<p class="lead">Prueba ingesta, bootstrap y chat con contexto visible para evaluar el RAG como si estuviera integrado en una app o agente real.</p> <p class="lead">Prueba ingesta, bootstrap y chat con contexto visible para evaluar el RAG como si estuviera integrado en una app o agente real. Incluye comparacion con y sin RAG, seleccion de modelos, logs automáticos y logs solicitados por el usuario para analizar fallos, carencias y mejoras.</p>
</div>
</div>
<div class="hero-side">
<div class="log-counter" id="logCounterCard">
<span class="log-counter-value" id="logCounterValue">0</span>
<span class="log-counter-label">logs detectados</span>
</div>
<button id="healthButton" class="secondary">Comprobar health</button>
</div> </div>
<button id="healthButton" class="secondary">Comprobar health</button>
</header> </header>
<section class="tabs"> <section class="tabs">

55
RAG/public/playground/styles.css
View file

@ -42,6 +42,53 @@ body {
margin-bottom: 18px; margin-bottom: 18px;
} }
.hero-brand {
display: flex;
gap: 18px;
align-items: flex-start;
}
.brand-logo {
width: 110px;
height: auto;
object-fit: contain;
filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.2));
}
.hero-side {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 12px;
}
.log-counter {
min-width: 150px;
padding: 12px 16px;
border-radius: 16px;
border: 1px solid var(--border);
background: #0b1020;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.log-counter-value {
font-size: 32px;
font-weight: 800;
color: var(--accent);
line-height: 1;
}
.log-counter-label {
color: var(--muted);
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0.08em;
margin-top: 6px;
}
.tabs { .tabs {
display: inline-flex; display: inline-flex;
gap: 10px; gap: 10px;
@ -215,4 +262,12 @@ pre {
.hero { .hero {
flex-direction: column; flex-direction: column;
} }
.hero-brand {
flex-direction: column;
}
.hero-side {
align-items: stretch;
}
} }

1
docs/HISTORIAL_SESIONES.md
View file

@ -68,6 +68,7 @@ Este archivo registra agentes y sesiones de trabajo de este workspace.
- Ampliacion de la ingesta y del playground para soportar upload directo de archivos y `sourceId` personalizado, permitiendo aislar documentos ajenos al RAG en scopes separados. - Ampliacion de la ingesta y del playground para soportar upload directo de archivos y `sourceId` personalizado, permitiendo aislar documentos ajenos al RAG en scopes separados.
- Implementacion de logs de evaluacion persistentes en `Qdrant`, con disparo automatico por contexto insuficiente y registro manual con nota desde el playground. - Implementacion de logs de evaluacion persistentes en `Qdrant`, con disparo automatico por contexto insuficiente y registro manual con nota desde el playground.
- Ampliacion de los logs de evaluacion para permitir seguimiento real (`pending`, `resolved`, `ignored`, etc.) y documentacion de su arquitectura en `RAG/docs/LOGS_EVALUACION.md`. - Ampliacion de los logs de evaluacion para permitir seguimiento real (`pending`, `resolved`, `ignored`, etc.) y documentacion de su arquitectura en `RAG/docs/LOGS_EVALUACION.md`.
- Ajuste visual del playground con branding de POR-CORREO, nuevo titulo y contador visible de logs para detectar de un vistazo actividad de evaluacion.
- Reorganizacion de RAG como modulo raiz independiente con documentacion propia en `RAG/docs/`. - Reorganizacion de RAG como modulo raiz independiente con documentacion propia en `RAG/docs/`.
- Ajuste del indice documental global para reflejar la separacion entre documentacion global y documentacion por tool. - Ajuste del indice documental global para reflejar la separacion entre documentacion global y documentacion por tool.
- Creacion de `docs/TASK.md` para descomponer lineas de trabajo amplias en puntos de analisis y acuerdos. - Creacion de `docs/TASK.md` para descomponer lineas de trabajo amplias en puntos de analisis y acuerdos.