agentacta 1.2.2 → 1.3.1

package/index.js

@@ -2,6 +2,7 @@
 const http = require('http');
 const fs = require('fs');
 const path = require('path');
+const { EventEmitter } = require('events');
 
 // --demo flag: use demo session data (must run before config load)
 if (process.argv.includes('--demo')) {
@@ -129,6 +130,10 @@ const db = open();
 // Live re-indexing setup
 const stmts = createStmts(db);
 
+// SSE emitter: notifies connected clients when a session is re-indexed
+const sseEmitter = new EventEmitter();
+sseEmitter.setMaxListeners(100);
+
 const sessionDirs = discoverSessionDirs(config);
 
 // Initial indexing pass
@@ -163,7 +168,10 @@ for (const dir of sessionDirs) {
         _reindexTimers.delete(filePath);
         try {
           const result = indexFile(db, filePath, dir.agent, stmts, ARCHIVE_MODE);
-          if (!result.skipped) console.log(`Live re-indexed: ${filename} (${dir.agent})`);
+          if (!result.skipped) {
+            console.log(`Live re-indexed: ${filename} (${dir.agent})`);
+            if (result.sessionId) sseEmitter.emit('session-update', result.sessionId);
+          }
         } catch (err) {
           console.error(`Error re-indexing ${filename}:`, err.message);
         }
@@ -252,6 +260,66 @@ const server = http.createServer((req, res) => {
       const total = agent ? db.prepare(countSql).get(agent).c : db.prepare(countSql).get().c;
       json(res, { sessions: rows, total, limit, offset });
     }
+
+    else if (pathname.match(/^\/api\/sessions\/[^/]+\/events$/)) {
+      const id = pathname.split('/')[3];
+      const session = db.prepare('SELECT id FROM sessions WHERE id = ?').get(id);
+      if (!session) return json(res, { error: 'Not found' }, 404);
+
+      const after = query.after || '1970-01-01T00:00:00.000Z';
+      const afterId = query.afterId || '';
+      const limit = Math.min(parseInt(query.limit || '50', 10) || 50, 200);
+      const rows = db.prepare(
+        `SELECT * FROM events
+         WHERE session_id = ?
+           AND (timestamp > ? OR (timestamp = ? AND id > ?))
+         ORDER BY timestamp ASC, id ASC
+         LIMIT ?`
+      ).all(id, after, after, afterId, limit);
+      json(res, { events: rows, after, afterId, count: rows.length });
+    }
+
+    else if (pathname.match(/^\/api\/sessions\/[^/]+\/stream$/)) {
+      const id = pathname.split('/')[3];
+      const session = db.prepare('SELECT id FROM sessions WHERE id = ?').get(id);
+      if (!session) return json(res, { error: 'Not found' }, 404);
+
+      res.writeHead(200, {
+        'Content-Type': 'text/event-stream',
+        'Cache-Control': 'no-cache',
+        'Connection': 'keep-alive',
+        'X-Accel-Buffering': 'no'
+      });
+      res.write(': connected\n\n');
+
+      let lastTs = req.headers['last-event-id'] || query.after || new Date().toISOString();
+
+      const onUpdate = (sessionId) => {
+        if (sessionId !== id) return;
+        try {
+          const rows = db.prepare(
+            'SELECT * FROM events WHERE session_id = ? AND timestamp > ? ORDER BY timestamp ASC'
+          ).all(id, lastTs);
+          if (rows.length) {
+            lastTs = rows[rows.length - 1].timestamp;
+            res.write(`id: ${lastTs}\ndata: ${JSON.stringify(rows)}\n\n`);
+          }
+        } catch (err) {
+          console.error('SSE query error:', err.message);
+        }
+      };
+
+      sseEmitter.on('session-update', onUpdate);
+
+      const ping = setInterval(() => {
+        try { res.write(': ping\n\n'); } catch {}
+      }, 30000);
+
+      req.on('close', () => {
+        sseEmitter.off('session-update', onUpdate);
+        clearInterval(ping);
+      });
+    }
     else if (pathname.match(/^\/api\/sessions\/[^/]+$/) && !pathname.includes('export')) {
       const id = pathname.split('/')[3];
       const session = db.prepare('SELECT * FROM sessions WHERE id = ?').get(id);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentacta",
-  "version": "1.2.2",
+  "version": "1.3.1",
   "description": "Audit trail and search engine for AI agent sessions",
   "main": "index.js",
   "bin": {

package/public/app.js

@@ -49,6 +49,7 @@ function dlExport(url, filename) {
 
 function fmtTokens(n) {
   if (!n) return '0';
+  if (n >= 1_000_000_000) return (n / 1_000_000_000).toFixed(4) + 'B';
   if (n >= 1_000_000) return (n / 1_000_000).toFixed(1).replace(/\.0$/, '') + 'M';
   if (n >= 1_000) return (n / 1_000).toFixed(1).replace(/\.0$/, '') + 'K';
   return n.toLocaleString();
@@ -94,6 +95,50 @@ function transitionView() {
   content.classList.add('view-enter');
 }
 
+// --- Hash routing ---
+window._navDepth = 0;
+
+function setHash(hash, replace) {
+  const target = '#' + hash;
+  if (window.location.hash === target) return;
+  if (replace) {
+    history.replaceState(null, '', target);
+  } else {
+    history.pushState(null, '', target);
+    window._navDepth++;
+  }
+}
+
+function updateNavActive(view) {
+  $$('.nav-item').forEach(i => i.classList.remove('active'));
+  const navItem = $(`.nav-item[data-view="${view}"]`);
+  if (navItem) navItem.classList.add('active');
+}
+
+function handleRoute() {
+  const raw = (window.location.hash || '').slice(1) || 'search';
+  if (window._sseCleanup) { window._sseCleanup(); window._sseCleanup = null; }
+
+  if (raw.startsWith('session/')) {
+    const id = decodeURIComponent(raw.slice('session/'.length));
+    if (id) { viewSession(id); return; }
+  }
+
+  const view = raw === 'sessions' || raw === 'timeline' || raw === 'files' || raw === 'stats' ? raw : 'search';
+  window._lastView = view;
+  updateNavActive(view);
+  if (view === 'sessions') viewSessions();
+  else if (view === 'files') viewFiles();
+  else if (view === 'timeline') viewTimeline();
+  else if (view === 'stats') viewStats();
+  else viewSearch(window._lastSearchQuery || '');
+}
+
+window.addEventListener('popstate', () => {
+  if (window._navDepth > 0) window._navDepth--;
+  handleRoute();
+});
+
 function renderEvent(ev) {
   const badge = `<span class="event-badge ${badgeClass(ev.type, ev.role)}">${ev.type === 'tool_call' ? 'tool' : ev.role || ev.type}</span>`;
   let body = '';
@@ -383,7 +428,9 @@ async function viewSessions() {
 }
 
 async function viewSession(id) {
+  if (window._sseCleanup) { window._sseCleanup(); window._sseCleanup = null; }
   window._currentSessionId = id;
+  setHash('session/' + encodeURIComponent(id));
   window.scrollTo(0, 0);
   const data = await api(`/sessions/${id}`);
 
@@ -468,11 +515,13 @@ async function viewSession(id) {
   }
 
   $('#backBtn').addEventListener('click', () => {
-    if (onScroll) { window.removeEventListener('scroll', onScroll); onScroll = null; }
-    if (window._lastView === 'timeline') viewTimeline();
-    else if (window._lastView === 'files') viewFiles();
-    else if (window._lastView === 'search') viewSearch(window._lastSearchQuery || '');
-    else viewSessions();
+    if (window._navDepth > 0) {
+      history.back();
+    } else {
+      const view = window._lastView || 'sessions';
+      setHash(view, true);
+      handleRoute();
+    }
   });
 
   $('#copySessionId').addEventListener('click', async () => {
@@ -531,6 +580,82 @@ async function viewSession(id) {
       }
     });
   }
+
+    // --- Lightweight realtime updates (polling fallback first) ---
+  const knownIds = new Set(allEvents.map(e => e.id));
+  let pendingNewCount = 0;
+
+  const applyIncomingEvents = (incoming) => {
+    const container = document.getElementById('eventsContainer');
+    if (!container || !incoming?.length) return;
+
+    const fresh = incoming.filter(e => !knownIds.has(e.id));
+    if (!fresh.length) return;
+    fresh.forEach(e => knownIds.add(e.id));
+
+    const isAtTop = window.scrollY < 100;
+    for (const ev of fresh) {
+      const div = document.createElement('div');
+      div.innerHTML = renderEvent(ev);
+      const el = div.firstElementChild;
+      el.classList.add('event-highlight');
+      container.insertBefore(el, container.firstChild);
+      setTimeout(() => el.classList.remove('event-highlight'), 2000);
+    }
+
+    if (!isAtTop) {
+      pendingNewCount += fresh.length;
+      let indicator = document.getElementById('newEventsIndicator');
+      if (!indicator) {
+        indicator = document.createElement('div');
+        indicator.id = 'newEventsIndicator';
+        indicator.className = 'new-events-indicator';
+        document.body.appendChild(indicator);
+        indicator.addEventListener('click', () => {
+          window.scrollTo({ top: 0, behavior: 'smooth' });
+          indicator.remove();
+          pendingNewCount = 0;
+        });
+      }
+      indicator.textContent = `${pendingNewCount} new event${pendingNewCount !== 1 ? 's' : ''} ↑`;
+    }
+  };
+
+  // Poll every 3s for new events using delta endpoint
+  let lastSeenTs = allEvents.length ? allEvents[0].timestamp : new Date(0).toISOString();
+  let lastSeenId = allEvents.length ? allEvents[0].id : '';
+  const pollNewEvents = async () => {
+    try {
+      const latest = await api(`/sessions/${id}/events?after=${encodeURIComponent(lastSeenTs)}&afterId=${encodeURIComponent(lastSeenId)}&limit=50`);
+      const incoming = latest.events || [];
+      if (incoming.length) {
+        const tail = incoming[incoming.length - 1];
+        lastSeenTs = tail.timestamp || lastSeenTs;
+        lastSeenId = tail.id || lastSeenId;
+        applyIncomingEvents(incoming);
+      }
+    } catch (err) {
+      // silent; next tick will retry
+    }
+  };
+
+  const pollInterval = setInterval(pollNewEvents, 3000);
+
+  const sseScrollHandler = () => {
+    if (window.scrollY < 100) {
+      const ind = document.getElementById('newEventsIndicator');
+      if (ind) { ind.remove(); pendingNewCount = 0; }
+    }
+  };
+  window.addEventListener('scroll', sseScrollHandler, { passive: true });
+
+  window._sseCleanup = () => {
+    if (onScroll) { window.removeEventListener('scroll', onScroll); onScroll = null; }
+    clearInterval(pollInterval);
+    window.removeEventListener('scroll', sseScrollHandler);
+    const ind = document.getElementById('newEventsIndicator');
+    if (ind) ind.remove();
+  };
 }
 
 async function viewTimeline(date) {
@@ -828,10 +953,11 @@ window._lastView = 'sessions';
 
 $$('.nav-item').forEach(item => {
   item.addEventListener('click', () => {
-    $$('.nav-item').forEach(i => i.classList.remove('active'));
-    item.classList.add('active');
+    if (window._sseCleanup) { window._sseCleanup(); window._sseCleanup = null; }
     const view = item.dataset.view;
     window._lastView = view;
+    updateNavActive(view);
+    setHash(view);
     if (view === 'search') viewSearch();
     else if (view === 'sessions') viewSessions();
     else if (view === 'files') viewFiles();
@@ -840,7 +966,7 @@ $$('.nav-item').forEach(item => {
   });
 });
 
-viewSearch();
+handleRoute();
 
 // Swipe right from left edge to go back
 (function initSwipeBack() {

package/public/style.css

@@ -1077,6 +1077,34 @@ mark {
   animation: highlightFade 2s var(--ease-out);
 }
 
+/* ---- New Events SSE Indicator ---- */
+.new-events-indicator {
+  position: fixed;
+  top: 20px;
+  left: 50%;
+  transform: translateX(-50%);
+  background: var(--accent);
+  color: #fff;
+  padding: 8px 20px;
+  border-radius: 20px;
+  font-size: 12px;
+  font-weight: 600;
+  cursor: pointer;
+  z-index: 90;
+  box-shadow: 0 4px 16px rgba(99, 144, 240, 0.4);
+  animation: slideDown 0.3s var(--ease-out);
+}
+
+.new-events-indicator:hover {
+  background: #4a7ae8;
+  transform: translateX(-50%) scale(1.05);
+}
+
+@keyframes slideDown {
+  from { opacity: 0; transform: translateX(-50%) translateY(-10px); }
+  to { opacity: 1; transform: translateX(-50%) translateY(0); }
+}
+
 /* ---- Search Home Stats ---- */
 .search-stats {
   display: grid;