codedash-app 1.4.0 → 1.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codedash-app",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "Termius-style browser dashboard for Claude Code sessions. View, search, resume, and delete sessions with a dark-themed UI.",
   "bin": {
     "codedash": "./bin/cli.js"

package/src/data.js

@@ -330,6 +330,99 @@ function exportSessionMarkdown(sessionId, project) {
   return parts.join('');
 }
 
+// ── Session Preview (first N messages, lightweight) ────────
+
+function getSessionPreview(sessionId, project, limit) {
+  limit = limit || 10;
+  const projectKey = project.replace(/\//g, '-').replace(/^-/, '');
+  const sessionFile = path.join(PROJECTS_DIR, projectKey, `${sessionId}.jsonl`);
+
+  if (!fs.existsSync(sessionFile)) return [];
+
+  const messages = [];
+  const lines = fs.readFileSync(sessionFile, 'utf8').split('\n').filter(Boolean);
+
+  for (const line of lines) {
+    if (messages.length >= limit) break;
+    try {
+      const entry = JSON.parse(line);
+      if (entry.type === 'user' || entry.type === 'assistant') {
+        const msg = entry.message || {};
+        let content = msg.content || '';
+        if (Array.isArray(content)) {
+          content = content
+            .map(b => (typeof b === 'string' ? b : (b.type === 'text' ? b.text : '')))
+            .filter(Boolean)
+            .join('\n');
+        }
+        messages.push({
+          role: entry.type,
+          content: content.slice(0, 300), // short preview
+        });
+      }
+    } catch {}
+  }
+
+  return messages;
+}
+
+// ── Full-text search across all sessions ──────────────────
+
+function searchFullText(query, sessions) {
+  if (!query || query.length < 2) return [];
+  const q = query.toLowerCase();
+  const results = [];
+
+  for (const s of sessions) {
+    if (s.tool !== 'claude' || !s.has_detail) continue;
+
+    const projectKey = s.project.replace(/\//g, '-').replace(/^-/, '');
+    const sessionFile = path.join(PROJECTS_DIR, projectKey, `${s.id}.jsonl`);
+    if (!fs.existsSync(sessionFile)) continue;
+
+    try {
+      const data = fs.readFileSync(sessionFile, 'utf8');
+      // Quick check before parsing
+      if (data.toLowerCase().indexOf(q) === -1) continue;
+
+      // Find matching messages
+      const lines = data.split('\n').filter(Boolean);
+      const matches = [];
+      for (const line of lines) {
+        if (matches.length >= 3) break; // max 3 matches per session
+        try {
+          const entry = JSON.parse(line);
+          if (entry.type !== 'user' && entry.type !== 'assistant') continue;
+          const msg = entry.message || {};
+          let content = msg.content || '';
+          if (Array.isArray(content)) {
+            content = content
+              .map(b => (typeof b === 'string' ? b : (b.type === 'text' ? b.text : '')))
+              .filter(Boolean)
+              .join('\n');
+          }
+          if (content.toLowerCase().indexOf(q) >= 0) {
+            // Extract snippet around match
+            const idx = content.toLowerCase().indexOf(q);
+            const start = Math.max(0, idx - 50);
+            const end = Math.min(content.length, idx + q.length + 50);
+            matches.push({
+              role: entry.type,
+              snippet: (start > 0 ? '...' : '') + content.slice(start, end) + (end < content.length ? '...' : ''),
+            });
+          }
+        } catch {}
+      }
+
+      if (matches.length > 0) {
+        results.push({ sessionId: s.id, matches });
+      }
+    } catch {}
+  }
+
+  return results;
+}
+
 // ── Exports ────────────────────────────────────────────────
 
 module.exports = {
@@ -338,7 +431,8 @@ module.exports = {
   deleteSession,
   getGitCommits,
   exportSessionMarkdown,
-  // Expose constants for consumers that need them
+  getSessionPreview,
+  searchFullText,
   CLAUDE_DIR,
   CODEX_DIR,
   HISTORY_FILE,

package/src/frontend/app.js

@@ -288,6 +288,12 @@ function applyFilters() {
 function onSearch(val) {
   searchQuery = val;
   applyFilters();
+
+  // Trigger deep search after debounce
+  clearTimeout(deepSearchTimeout);
+  if (val && val.length >= 3) {
+    deepSearchTimeout = setTimeout(function() { deepSearch(val); }, 600);
+  }
 }
 
 function onTagFilter(val) {
@@ -379,12 +385,15 @@ function renderCard(s, idx) {
   html += '<span class="card-meta">' + escHtml(s.last_time || '') + '</span>';
   html += '<span class="card-id">' + s.id.slice(0, 8) + '</span>';
   // Tags
-  if (tagHtml || true) {
-    html += '<span class="card-tags">' + tagHtml;
-    html += '<button class="tag-add-btn" onclick="showTagDropdown(event, \'' + s.id + '\')" title="Add tag">+</button>';
-    html += '</span>';
+  html += '<span class="card-tags">' + tagHtml;
+  html += '<button class="tag-add-btn" onclick="showTagDropdown(event, \'' + s.id + '\')" title="Add tag">+</button>';
+  html += '</span>';
+  if (s.has_detail) {
+    html += '<button class="card-expand-btn" onclick="event.stopPropagation();toggleExpand(\'' + s.id + '\',\'' + escHtml(s.project || '').replace(/'/g, "\\'") + '\',this)" title="Preview messages">&#9662;</button>';
   }
   html += '</div>';
+  // Expandable preview area (hidden by default)
+  html += '<div class="card-preview-area" id="preview-' + s.id + '"></div>';
   html += '</div>';
   return html;
 }
@@ -425,6 +434,177 @@ function renderListCard(s, idx) {
   return html;
 }
 
+// ── Card expand (inline preview) ──────────────────────────────
+
+async function toggleExpand(sessionId, project, btn) {
+  var area = document.getElementById('preview-' + sessionId);
+  if (!area) return;
+
+  if (area.classList.contains('open')) {
+    area.classList.remove('open');
+    area.innerHTML = '';
+    btn.innerHTML = '&#9662;';
+    return;
+  }
+
+  btn.innerHTML = '&#8987;';
+  area.innerHTML = '<div class="loading">Loading...</div>';
+  area.classList.add('open');
+
+  try {
+    var resp = await fetch('/api/preview/' + sessionId + '?project=' + encodeURIComponent(project) + '&limit=10');
+    var messages = await resp.json();
+
+    if (messages.length === 0) {
+      area.innerHTML = '<div class="preview-empty">No messages</div>';
+    } else {
+      var html = '';
+      messages.forEach(function(m) {
+        var cls = m.role === 'user' ? 'preview-user' : 'preview-assistant';
+        var label = m.role === 'user' ? 'You' : 'AI';
+        html += '<div class="preview-msg ' + cls + '">';
+        html += '<span class="preview-role">' + label + '</span> ';
+        html += escHtml(m.content);
+        html += '</div>';
+      });
+      area.innerHTML = html;
+    }
+    btn.innerHTML = '&#9652;';
+  } catch (e) {
+    area.innerHTML = '<div class="preview-empty">Failed to load</div>';
+    btn.innerHTML = '&#9662;';
+  }
+}
+
+// ── Hover tooltip (show first messages on hover) ──────────────
+
+var hoverTimer = null;
+var hoverTooltip = null;
+
+function initHoverPreview() {
+  document.addEventListener('mouseover', function(e) {
+    var card = e.target.closest('.card');
+    if (!card) { hideHoverTooltip(); return; }
+
+    var id = card.getAttribute('data-id');
+    if (!id) return;
+
+    clearTimeout(hoverTimer);
+    hoverTimer = setTimeout(function() {
+      var s = allSessions.find(function(x) { return x.id === id; });
+      if (!s || !s.has_detail) return;
+      showHoverTooltip(card, s);
+    }, 400); // 400ms delay
+  });
+
+  document.addEventListener('mouseout', function(e) {
+    var card = e.target.closest('.card');
+    if (!card) { clearTimeout(hoverTimer); hideHoverTooltip(); }
+  });
+}
+
+async function showHoverTooltip(card, session) {
+  hideHoverTooltip();
+
+  try {
+    var resp = await fetch('/api/preview/' + session.id + '?project=' + encodeURIComponent(session.project || '') + '&limit=6');
+    var messages = await resp.json();
+    if (messages.length === 0) return;
+
+    var tip = document.createElement('div');
+    tip.className = 'hover-tooltip';
+
+    var html = '';
+    messages.forEach(function(m) {
+      var label = m.role === 'user' ? 'You' : 'AI';
+      var cls = m.role === 'user' ? 'preview-user' : 'preview-assistant';
+      html += '<div class="preview-msg ' + cls + '">';
+      html += '<span class="preview-role">' + label + '</span> ';
+      html += escHtml(m.content.slice(0, 150));
+      if (m.content.length > 150) html += '...';
+      html += '</div>';
+    });
+    tip.innerHTML = html;
+
+    document.body.appendChild(tip);
+    hoverTooltip = tip;
+
+    // Position near card
+    var rect = card.getBoundingClientRect();
+    tip.style.top = Math.min(rect.bottom + 4, window.innerHeight - tip.offsetHeight - 8) + 'px';
+    tip.style.left = Math.max(8, rect.left) + 'px';
+    tip.style.maxWidth = Math.min(500, window.innerWidth - rect.left - 20) + 'px';
+
+    requestAnimationFrame(function() { tip.classList.add('visible'); });
+  } catch {}
+}
+
+function hideHoverTooltip() {
+  if (hoverTooltip) {
+    hoverTooltip.remove();
+    hoverTooltip = null;
+  }
+}
+
+// ── Deep search (full-text across session content) ────────────
+
+var deepSearchCache = {};
+var deepSearchTimeout = null;
+
+async function deepSearch(query) {
+  if (!query || query.length < 3) return;
+  if (deepSearchCache[query]) {
+    applyDeepSearchResults(deepSearchCache[query]);
+    return;
+  }
+
+  try {
+    var resp = await fetch('/api/search?q=' + encodeURIComponent(query));
+    var results = await resp.json();
+    deepSearchCache[query] = results;
+    applyDeepSearchResults(results);
+  } catch {}
+}
+
+function applyDeepSearchResults(results) {
+  if (!results || results.length === 0) return;
+
+  // Highlight matching session IDs in filtered list
+  var matchIds = results.map(function(r) { return r.sessionId; });
+
+  // Boost matching sessions to top if not already visible
+  var boosted = [];
+  var rest = [];
+  filteredSessions.forEach(function(s) {
+    if (matchIds.indexOf(s.id) >= 0) {
+      s._deepMatch = results.find(function(r) { return r.sessionId === s.id; });
+      boosted.push(s);
+    } else {
+      rest.push(s);
+    }
+  });
+
+  // Also add sessions that weren't in filteredSessions but match
+  matchIds.forEach(function(id) {
+    if (!boosted.find(function(s) { return s.id === id; }) && !rest.find(function(s) { return s.id === id; })) {
+      var s = allSessions.find(function(x) { return x.id === id; });
+      if (s) {
+        s._deepMatch = results.find(function(r) { return r.sessionId === id; });
+        boosted.push(s);
+      }
+    }
+  });
+
+  filteredSessions = boosted.concat(rest);
+  render();
+
+  // Show deep search indicator
+  var stats = document.getElementById('stats');
+  if (stats && boosted.length > 0) {
+    stats.textContent += ' | ' + boosted.length + ' deep matches';
+  }
+}
+
 function onCardClick(id, event) {
   if (selectMode) {
     toggleSelect(id, event);
@@ -1196,6 +1376,7 @@ function dismissUpdate() {
   loadSessions();
   loadTerminals();
   checkForUpdates();
+  initHoverPreview();
 
   // Apply saved theme
   var savedTheme = localStorage.getItem('codedash-theme') || 'dark';

package/src/frontend/styles.css

@@ -1370,6 +1370,104 @@ body {
     color: #fff;
 }
 
+/* ── Card expand preview ────────────────────────────────────── */
+
+.card-expand-btn {
+    background: none;
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    color: var(--text-muted);
+    font-size: 12px;
+    cursor: pointer;
+    padding: 1px 6px;
+    margin-left: auto;
+    transition: all 0.15s;
+}
+.card-expand-btn:hover {
+    color: var(--text-primary);
+    border-color: var(--accent-blue);
+}
+
+.card-preview-area {
+    display: none;
+    border-top: 1px solid var(--border);
+    margin-top: 10px;
+    padding-top: 10px;
+    max-height: 300px;
+    overflow-y: auto;
+    animation: fadeIn 0.2s ease;
+}
+
+.card-preview-area.open {
+    display: block;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(-4px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.preview-msg {
+    font-size: 12px;
+    line-height: 1.5;
+    padding: 4px 8px;
+    margin-bottom: 4px;
+    border-radius: 6px;
+    word-break: break-word;
+    white-space: pre-wrap;
+}
+
+.preview-user {
+    background: rgba(96, 165, 250, 0.08);
+}
+
+.preview-assistant {
+    background: rgba(74, 222, 128, 0.06);
+}
+
+.preview-role {
+    font-weight: 600;
+    font-size: 10px;
+    text-transform: uppercase;
+    letter-spacing: 0.3px;
+}
+
+.preview-user .preview-role { color: var(--accent-blue); }
+.preview-assistant .preview-role { color: var(--accent-green); }
+
+.preview-empty {
+    color: var(--text-muted);
+    font-size: 12px;
+    padding: 8px 0;
+}
+
+/* ── Hover tooltip ──────────────────────────────────────────── */
+
+.hover-tooltip {
+    position: fixed;
+    background: var(--bg-secondary);
+    border: 1px solid var(--border);
+    border-radius: 10px;
+    padding: 12px;
+    z-index: 150;
+    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
+    max-height: 280px;
+    overflow-y: auto;
+    opacity: 0;
+    transform: translateY(4px);
+    transition: opacity 0.15s, transform 0.15s;
+    pointer-events: none;
+}
+
+.hover-tooltip.visible {
+    opacity: 1;
+    transform: translateY(0);
+}
+
+[data-theme="light"] .hover-tooltip {
+    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
+}
+
 /* ── Update banner ──────────────────────────────────────────── */
 
 .update-banner {

package/src/server.js

@@ -3,7 +3,7 @@ const http = require('http');
 const https = require('https');
 const { URL } = require('url');
 const { exec } = require('child_process');
-const { loadSessions, loadSessionDetail, deleteSession, getGitCommits, exportSessionMarkdown } = require('./data');
+const { loadSessions, loadSessionDetail, deleteSession, getGitCommits, exportSessionMarkdown, getSessionPreview, searchFullText } = require('./data');
 const { detectTerminals, openInTerminal } = require('./terminals');
 const { getHTML } = require('./html');
 
@@ -104,6 +104,23 @@ function startServer(port, openBrowser = true) {
       json(res, commits);
     }
 
+    // ── Session preview ─────────────────────
+    else if (req.method === 'GET' && pathname.startsWith('/api/preview/')) {
+      const sessionId = pathname.split('/').pop();
+      const project = parsed.searchParams.get('project') || '';
+      const limit = parseInt(parsed.searchParams.get('limit') || '10');
+      const messages = getSessionPreview(sessionId, project, limit);
+      json(res, messages);
+    }
+
+    // ── Full-text search ──────────────────────
+    else if (req.method === 'GET' && pathname === '/api/search') {
+      const q = parsed.searchParams.get('q') || '';
+      const sessions = loadSessions();
+      const results = searchFullText(q, sessions);
+      json(res, results);
+    }
+
     // ── Version check ────────────────────────
     else if (req.method === 'GET' && pathname === '/api/version') {
       const pkg = require('../package.json');