npm - agent-relay-server - Versions diffs - 0.1.0 - Mend

agent-relay-server 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/public/index.html ADDED Viewed

@@ -0,0 +1,501 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Agent Relay</title>
+<style>
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  :root {
+    --bg: #0d1117; --surface: #161b22; --border: #30363d;
+    --text: #e6edf3; --text-dim: #7d8590; --accent: #58a6ff;
+    --green: #3fb950; --yellow: #d29922; --red: #f85149; --blue: #58a6ff;
+  }
+  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: var(--bg); color: var(--text); line-height: 1.5; }
+  .container { max-width: 1200px; margin: 0 auto; padding: 16px; overflow-x: hidden; }
+  header { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--border); margin-bottom: 24px; flex-wrap: wrap; gap: 8px; }
+  header h1 { font-size: 20px; font-weight: 600; }
+  .stats { display: flex; gap: 12px; font-size: 13px; color: var(--text-dim); flex-wrap: wrap; }
+  .stats .num { color: var(--accent); font-weight: 600; font-size: 15px; }
+  .grid { display: grid; grid-template-columns: 340px 1fr; gap: 24px; }
+  @media (max-width: 800px) { .grid { grid-template-columns: 1fr; } }
+  .panel { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; }
+  .panel-head { padding: 12px 16px; border-bottom: 1px solid var(--border); font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-dim); display: flex; justify-content: space-between; align-items: center; }
+  .panel-body { padding: 8px; max-height: 70vh; overflow-y: auto; overflow-x: hidden; }
+  .agent { padding: 10px 12px; border-radius: 6px; margin-bottom: 4px; cursor: pointer; transition: background 0.15s; }
+  .agent:hover { background: #1c2128; }
+  .agent.selected { background: #1c2128; border-left: 3px solid var(--accent); }
+  .agent-name { font-weight: 600; font-size: 14px; }
+  .agent-meta { font-size: 12px; color: var(--text-dim); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; }
+  .agent-tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
+  .tag { background: #1c2128; border: 1px solid var(--border); border-radius: 12px; padding: 1px 8px; font-size: 11px; color: var(--text-dim); }
+  .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }
+  .dot.online { background: var(--green); }
+  .dot.idle { background: var(--yellow); }
+  .dot.busy { background: var(--red); }
+  .dot.offline { background: var(--text-dim); }
+  .msg { padding: 10px 14px; border-radius: 6px; margin-bottom: 6px; background: #1c2128; position: relative; overflow: hidden; }
+  .msg.thread-child { border-left: 2px solid var(--border); margin-left: 16px; }
+  .msg-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 4px; flex-wrap: wrap; gap: 4px; }
+  .msg-from { font-weight: 600; font-size: 13px; color: var(--accent); overflow: hidden; text-overflow: ellipsis; }
+  .msg-to { font-size: 12px; color: var(--text-dim); overflow: hidden; text-overflow: ellipsis; }
+  .msg-time { font-size: 11px; color: var(--text-dim); }
+  .msg-subject { font-size: 13px; font-weight: 600; margin-bottom: 2px; }
+  .msg-body { font-size: 13px; white-space: pre-wrap; word-break: break-word; }
+  .msg-channel { font-size: 11px; color: var(--yellow); margin-top: 4px; }
+  .msg-footer { display: flex; gap: 12px; align-items: center; margin-top: 6px; }
+  .msg-thread-info { font-size: 11px; color: var(--text-dim); }
+  .msg-reply-btn, .msg-claim-btn, .msg-delete-btn { background: none; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); font-size: 11px; padding: 1px 8px; cursor: pointer; }
+  .msg-reply-btn:hover { color: var(--accent); border-color: var(--accent); }
+  .msg-claim-btn:hover { color: var(--green); border-color: var(--green); }
+  .msg-delete-btn:hover { color: var(--red); border-color: var(--red); }
+  .agent-actions { float: right; display: flex; gap: 4px; opacity: 0; transition: opacity 0.15s; }
+  .agent:hover .agent-actions { opacity: 1; }
+  .agent-actions button { background: none; border: none; color: var(--text-dim); font-size: 13px; cursor: pointer; padding: 2px 4px; }
+  .agent-actions button.delete:hover { color: var(--red); }
+  .agent-actions button.rename:hover { color: var(--accent); }
+  .agent-label { color: var(--yellow); font-weight: 600; }
+  .msg-claimed { font-size: 11px; color: var(--green); }
+  .msg-claimable { font-size: 11px; color: var(--yellow); }
+  .msg.claimed { border-left: 2px solid var(--green); }
+  .msg-thread-link { font-size: 11px; color: var(--accent); cursor: pointer; text-decoration: underline; }
+  .reply-banner { display: flex; align-items: center; gap: 8px; padding: 6px 16px; background: var(--bg); border-bottom: 1px solid var(--border); font-size: 12px; color: var(--text-dim); }
+  .reply-banner .cancel { cursor: pointer; color: var(--red); margin-left: auto; }
+  .thread-overlay { position: fixed; top: 0; right: 0; width: 450px; max-width: 100vw; height: 100vh; background: var(--surface); border-left: 1px solid var(--border); z-index: 100; display: flex; flex-direction: column; box-shadow: -4px 0 24px rgba(0,0,0,0.4); }
+  .thread-overlay .panel-head { flex-shrink: 0; }
+  .thread-overlay .panel-body { flex: 1; overflow-y: auto; }
+  .thread-close { cursor: pointer; color: var(--text-dim); font-size: 18px; }
+  .thread-close:hover { color: var(--text); }
+  .compose { padding: 16px; border-top: 1px solid var(--border); }
+  .compose-row { display: flex; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
+  .compose input, .compose textarea, .compose select { background: var(--bg); border: 1px solid var(--border); border-radius: 6px; color: var(--text); padding: 6px 10px; font-size: 13px; font-family: inherit; }
+  .compose input, .compose select { flex: 1; min-width: 0; }
+  .compose textarea { width: 100%; min-height: 60px; resize: vertical; }
+  .compose button { background: var(--accent); color: #fff; border: none; border-radius: 6px; padding: 6px 16px; font-size: 13px; cursor: pointer; font-weight: 600; }
+  .compose button:hover { opacity: 0.9; }
+  .empty { text-align: center; padding: 40px 16px; color: var(--text-dim); font-size: 14px; }
+  .filter-row { display: flex; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
+  .filter-row select, .filter-row input { background: var(--bg); border: 1px solid var(--border); border-radius: 6px; color: var(--text); padding: 4px 8px; font-size: 12px; flex: 1; min-width: 0; }
+  @media (max-width: 500px) {
+    .container { padding: 8px; }
+    header { margin-bottom: 12px; }
+    .grid { gap: 12px; }
+    .compose-row { flex-direction: column; }
+    .compose-row input, .compose-row select { width: 100%; }
+    .msg-footer { flex-wrap: wrap; }
+    .agent-meta { word-break: break-all; }
+    .stats { gap: 8px; }
+  }
+</style>
+</head>
+<body>
+<div class="container">
+  <header>
+    <h1>Agent Relay</h1>
+    <div class="stats">
+      <span>Agents: <span class="num" id="stat-agents">-</span></span>
+      <span>Online: <span class="num" id="stat-online">-</span></span>
+      <span>Messages (24h): <span class="num" id="stat-msgs24">-</span></span>
+      <span>Total: <span class="num" id="stat-msgs">-</span></span>
+    </div>
+  </header>
+  <div class="grid">
+    <div class="panel">
+      <div class="panel-head">
+        Agents
+        <label style="font-size:11px;font-weight:400;text-transform:none;">
+          <input type="checkbox" id="show-offline" onchange="renderAgents(); updateComposeDropdowns();"> Show offline
+        </label>
+      </div>
+      <div class="panel-body" id="agent-list">
+        <div class="empty">No agents registered</div>
+      </div>
+    </div>
+    <div class="panel" style="display:flex;flex-direction:column;">
+      <div class="panel-head">
+        Messages
+        <label style="font-size:11px;font-weight:400;text-transform:none;">
+          <input type="checkbox" id="auto-refresh" checked> Auto-refresh
+        </label>
+      </div>
+      <div class="filter-row">
+        <select id="filter-agent"><option value="">All agents</option></select>
+        <input id="filter-channel" placeholder="Channel filter..." />
+      </div>
+      <div class="panel-body" id="msg-list" style="flex:1;">
+        <div class="empty">No messages</div>
+      </div>
+      <div id="reply-banner" class="reply-banner" style="display:none;">
+        Replying to <strong id="reply-to-label"></strong>
+        <span class="cancel" onclick="cancelReply()">&times; Cancel</span>
+      </div>
+      <div class="compose">
+        <div class="compose-row">
+          <select id="c-from"><option value="">From...</option></select>
+          <select id="c-to"><option value="">To...</option></select>
+        </div>
+        <div class="compose-row">
+          <input id="c-channel" placeholder="Channel (optional)" />
+          <input id="c-subject" placeholder="Subject (optional)" />
+        </div>
+        <textarea id="c-body" placeholder="Message body..."></textarea>
+        <div style="margin-top:8px;display:flex;justify-content:space-between;align-items:center;">
+          <label style="font-size:11px;color:var(--text-dim);"><input type="checkbox" id="c-claimable"> Claimable</label>
+          <button onclick="doSend()">Send</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<div id="thread-overlay" class="thread-overlay" style="display:none;">
+  <div class="panel-head">
+    Thread
+    <span class="thread-close" onclick="closeThread()">&times;</span>
+  </div>
+  <div class="panel-body" id="thread-list"></div>
+</div>
+<script>
+const API = window.location.origin + '/api';
+let agents = [];
+let agentsById = {};
+let messages = [];
+let selectedAgent = null;
+let replyTo = null; // {id, from, body} of message being replied to
+// Display helpers — prefer label, fallback to name, fallback to id
+function displayName(a) { return a?.label || a?.name || a?.id || '?'; }
+function displayById(id) {
+  if (!id) return '';
+  if (id.startsWith('tag:')) return '#' + id.slice(4);
+  if (id.startsWith('cap:')) return '⚡' + id.slice(4);
+  if (id.startsWith('label:')) return '★' + id.slice(6);
+  if (id === 'broadcast') return '📢 broadcast';
+  const a = agentsById[id];
+  return a ? displayName(a) : id;
+}
+async function fetchStats() {
+  try {
+    const r = await fetch(`${API}/stats`);
+    const s = await r.json();
+    document.getElementById('stat-agents').textContent = s.agents;
+    document.getElementById('stat-online').textContent = s.online;
+    document.getElementById('stat-msgs24').textContent = s.messagesLast24h;
+    document.getElementById('stat-msgs').textContent = s.messages;
+  } catch {}
+}
+async function fetchAgents() {
+  try {
+    const r = await fetch(`${API}/agents`);
+    agents = await r.json();
+    agentsById = Object.fromEntries(agents.map(a => [a.id, a]));
+    renderAgents();
+    updateAgentFilter();
+  } catch {}
+}
+async function fetchMessages() {
+  try {
+    const params = new URLSearchParams();
+    const agentId = document.getElementById('filter-agent').value;
+    const channel = document.getElementById('filter-channel').value;
+    if (agentId) params.set('for', agentId);
+    if (channel) params.set('channel', channel);
+    params.set('limit', '100');
+    const r = await fetch(`${API}/messages?${params}`);
+    messages = await r.json();
+    renderMessages();
+  } catch {}
+}
+function renderAgents() {
+  const el = document.getElementById('agent-list');
+  const showOffline = document.getElementById('show-offline').checked;
+  const visible = showOffline ? agents : agents.filter(a => a.status !== 'offline');
+  if (!visible.length) { el.innerHTML = '<div class="empty">' + (agents.length ? 'All agents offline' : 'No agents registered') + '</div>'; return; }
+  el.innerHTML = visible.map(a => {
+    const deletable = a.status === 'offline' && a.id !== 'user';
+    const renameable = a.id !== 'user';
+    const actions = `
+      <span class="agent-actions">
+        ${renameable ? `<button class="rename" onclick="event.stopPropagation(); doRenameAgent('${esc(a.id)}')" title="Rename (set label)">✎</button>` : ''}
+        ${deletable ? `<button class="delete" onclick="event.stopPropagation(); doDeleteAgent('${esc(a.id)}')" title="Delete agent">&times;</button>` : ''}
+      </span>`;
+    const nameHtml = a.label
+      ? `<span class="agent-label">${esc(a.label)}</span> <span style="color:var(--text-dim);font-size:11px;">(${esc(a.name)})</span>`
+      : esc(a.name);
+    return `
+    <div class="agent ${selectedAgent === a.id ? 'selected' : ''}" onclick="selectAgent('${esc(a.id)}')">
+      ${actions}
+      <div class="agent-name"><span class="dot ${a.status}"></span>${nameHtml}</div>
+      <div class="agent-meta">${esc(a.id)} ${a.machine ? '@ ' + esc(a.machine) : ''} ${a.rig ? '(' + esc(a.rig) + ')' : ''} &middot; ${new Date(a.createdAt).toLocaleTimeString()}</div>
+      ${a.tags.length ? `<div class="agent-tags">${a.tags.map(t => `<span class="tag">${esc(t)}</span>`).join('')}</div>` : ''}
+    </div>`;
+  }).join('');
+}
+async function doRenameAgent(id) {
+  const current = agentsById[id]?.label || '';
+  const next = prompt(`Label for "${id}" (blank to clear):`, current);
+  if (next === null) return;
+  const r = await fetch(`${API}/agents/${encodeURIComponent(id)}/label`, {
+    method: 'PATCH',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ label: next.trim() || null }),
+  });
+  if (!r.ok) {
+    const err = await r.json().catch(() => ({ error: `HTTP ${r.status}` }));
+    alert(`Rename failed: ${err.error || 'unknown error'}`);
+    return;
+  }
+  refresh();
+}
+async function doDeleteAgent(id) {
+  if (!confirm(`Delete agent "${id}"? This also releases any tasks they've claimed.`)) return;
+  const r = await fetch(`${API}/agents/${encodeURIComponent(id)}`, { method: 'DELETE' });
+  if (!r.ok) {
+    const err = await r.json().catch(() => ({ error: `HTTP ${r.status}` }));
+    alert(`Delete failed: ${err.error || 'unknown error'}`);
+    return;
+  }
+  if (selectedAgent === id) selectedAgent = null;
+  refresh();
+}
+function threadCounts() {
+  const counts = {};
+  for (const m of messages) {
+    if (m.threadId) counts[m.threadId] = (counts[m.threadId] || 0) + 1;
+  }
+  return counts;
+}
+function renderMessages() {
+  const el = document.getElementById('msg-list');
+  if (!messages.length) { el.innerHTML = '<div class="empty">No messages</div>'; return; }
+  const tc = threadCounts();
+  // Group by thread, sort threads newest-first, messages within thread chronologically
+  const threads = new Map();
+  for (const m of messages) {
+    const tid = m.threadId || m.id;
+    if (!threads.has(tid)) threads.set(tid, []);
+    threads.get(tid).push(m);
+  }
+  for (const msgs of threads.values()) msgs.sort((a, b) => a.id - b.id);
+  const sorted = [...threads.values()]
+    .sort((a, b) => b[b.length - 1].id - a[a.length - 1].id)
+    .flat();
+  el.innerHTML = sorted.map(m => {
+    const replies = (tc[m.threadId] || 1) - 1;
+    const isReply = m.replyTo != null;
+    const claimInfo = m.claimable
+      ? (m.claimedBy
+        ? `<span class="msg-claimed">claimed by ${esc(m.claimedBy)}</span>`
+        : `<span class="msg-claimable">claimable</span>`)
+      : '';
+    const claimBtn = m.claimable && !m.claimedBy
+      ? `<button class="msg-claim-btn" onclick="doClaim(${m.id})">Claim</button>`
+      : '';
+    return `
+    <div class="msg${isReply ? ' thread-child' : ''}${m.claimedBy ? ' claimed' : ''}" data-id="${m.id}">
+      <div class="msg-head">
+        <span><span class="msg-from" title="${esc(m.from)}">${esc(displayById(m.from))}</span> <span class="msg-to" title="${esc(m.to)}">&rarr; ${esc(displayById(m.to))}</span></span>
+        <span class="msg-time">#${m.id} &middot; ${new Date(m.createdAt).toLocaleString()}</span>
+      </div>
+      ${m.subject ? `<div class="msg-subject">${esc(m.subject)}</div>` : ''}
+      <div class="msg-body">${esc(m.body)}</div>
+      ${m.channel ? `<div class="msg-channel">#${esc(m.channel)}</div>` : ''}
+      <div class="msg-footer">
+        <button class="msg-reply-btn" onclick="startReply(${m.id}, '${esc(m.from)}')">Reply</button>
+        ${claimBtn}
+        <button class="msg-delete-btn" onclick="doDeleteMessage(${m.id})">Delete</button>
+        ${claimInfo}
+        ${!isReply && replies > 0 ? `<span class="msg-thread-link" onclick="openThread(${m.threadId})">${replies} repl${replies === 1 ? 'y' : 'ies'}</span>` : ''}
+        ${isReply ? `<span class="msg-thread-info">reply to #${m.replyTo}</span>` : ''}
+      </div>
+    </div>`;
+  }).join('');
+}
+function updateAgentFilter() {
+  const sel = document.getElementById('filter-agent');
+  const current = sel.value;
+  sel.innerHTML = '<option value="">All agents</option>' +
+    agents.map(a => `<option value="${esc(a.id)}" ${a.id === current ? 'selected' : ''}>${esc(displayName(a))} [${esc(a.id.slice(-6))}]</option>`).join('');
+  updateComposeDropdowns();
+}
+function updateComposeDropdowns() {
+  const fromSel = document.getElementById('c-from');
+  const toSel = document.getElementById('c-to');
+  const fromVal = fromSel.value;
+  const toVal = toSel.value;
+  const showOffline = document.getElementById('show-offline').checked;
+  const visible = showOffline ? agents : agents.filter(a => a.status !== 'offline');
+  // Tags/caps/labels follow the same filter so we don't suggest routing to empty groups
+  const tags = [...new Set(visible.flatMap(a => a.tags))].sort();
+  const caps = [...new Set(visible.flatMap(a => a.capabilities))].sort();
+  const labels = [...new Set(visible.map(a => a.label).filter(Boolean))].sort();
+  fromSel.innerHTML = '<option value="">From...</option>' +
+    visible.map(a => `<option value="${esc(a.id)}" ${a.id === fromVal ? 'selected' : ''}>${esc(displayName(a))} [${esc(a.id.slice(-6))}]</option>`).join('');
+  toSel.innerHTML = '<option value="">To...</option>' +
+    '<option value="broadcast">📢 Broadcast (all)</option>' +
+    labels.map(l => `<option value="label:${esc(l)}" ${('label:'+l) === toVal ? 'selected' : ''}>★ ${esc(l)}</option>`).join('') +
+    caps.map(c => `<option value="cap:${esc(c)}" ${('cap:'+c) === toVal ? 'selected' : ''}>⚡ cap: ${esc(c)}</option>`).join('') +
+    tags.map(t => `<option value="tag:${esc(t)}" ${('tag:'+t) === toVal ? 'selected' : ''}>#${esc(t)}</option>`).join('') +
+    visible.map(a => `<option value="${esc(a.id)}" ${a.id === toVal ? 'selected' : ''}>${esc(displayName(a))} [${esc(a.id.slice(-6))}]</option>`).join('');
+  // Restore selections even if the selected agent is now filtered out
+  if (fromVal && !fromSel.querySelector(`option[value="${CSS.escape(fromVal)}"]`)) {
+    fromSel.insertAdjacentHTML('beforeend', `<option value="${esc(fromVal)}" selected>${esc(fromVal)} (offline)</option>`);
+  }
+  if (toVal && !toSel.querySelector(`option[value="${CSS.escape(toVal)}"]`)) {
+    toSel.insertAdjacentHTML('beforeend', `<option value="${esc(toVal)}" selected>${esc(toVal)} (offline)</option>`);
+  }
+  if (fromVal) fromSel.value = fromVal;
+  if (toVal) toSel.value = toVal;
+}
+function selectAgent(id) {
+  selectedAgent = selectedAgent === id ? null : id;
+  document.getElementById('filter-agent').value = selectedAgent || '';
+  renderAgents();
+  fetchMessages();
+}
+async function doSend() {
+  const from = document.getElementById('c-from').value.trim();
+  const to = document.getElementById('c-to').value.trim();
+  const body = document.getElementById('c-body').value.trim();
+  const channel = document.getElementById('c-channel').value.trim() || undefined;
+  const subject = document.getElementById('c-subject').value.trim() || undefined;
+  if (!from || !to || !body) return alert('from, to, and body required');
+  const claimable = document.getElementById('c-claimable').checked;
+  const payload = { from, to, body, channel, subject };
+  if (replyTo) payload.replyTo = replyTo.id;
+  if (claimable) payload.claimable = true;
+  const r = await fetch(`${API}/messages`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(payload),
+  });
+  if (!r.ok) {
+    const err = await r.json().catch(() => ({ error: `HTTP ${r.status}` }));
+    alert(`Send failed: ${err.error || 'unknown error'}`);
+    return;
+  }
+  document.getElementById('c-body').value = '';
+  document.getElementById('c-subject').value = '';
+  cancelReply();
+  fetchMessages();
+}
+function startReply(msgId, fromAgent) {
+  const msg = messages.find(m => m.id === msgId);
+  replyTo = { id: msgId, from: fromAgent };
+  document.getElementById('reply-banner').style.display = 'flex';
+  document.getElementById('reply-to-label').textContent = `#${msgId} from ${fromAgent}`;
+  // Auto-set "to" as the original sender
+  const toSel = document.getElementById('c-to');
+  toSel.value = fromAgent;
+  document.getElementById('c-body').focus();
+}
+function cancelReply() {
+  replyTo = null;
+  document.getElementById('reply-banner').style.display = 'none';
+}
+async function openThread(threadId) {
+  try {
+    const r = await fetch(`${API}/messages/${threadId}/thread`);
+    if (!r.ok) {
+      const err = await r.json().catch(() => ({ error: `HTTP ${r.status}` }));
+      alert(`Thread load failed: ${err.error || 'unknown error'}`);
+      return;
+    }
+    const thread = await r.json();
+    const el = document.getElementById('thread-list');
+    el.innerHTML = thread.map((m, i) => `
+      <div class="msg${i > 0 ? ' thread-child' : ''}" style="margin: 8px;">
+        <div class="msg-head">
+          <span><span class="msg-from" title="${esc(m.from)}">${esc(displayById(m.from))}</span> <span class="msg-to" title="${esc(m.to)}">&rarr; ${esc(displayById(m.to))}</span></span>
+          <span class="msg-time">#${m.id} &middot; ${new Date(m.createdAt).toLocaleString()}</span>
+        </div>
+        ${m.subject ? `<div class="msg-subject">${esc(m.subject)}</div>` : ''}
+        <div class="msg-body">${esc(m.body)}</div>
+      </div>
+    `).join('');
+    document.getElementById('thread-overlay').style.display = 'flex';
+  } catch (e) {
+    alert(`Thread load failed: ${e.message || e}`);
+  }
+}
+function closeThread() {
+  document.getElementById('thread-overlay').style.display = 'none';
+}
+async function doDeleteMessage(msgId) {
+  if (!confirm(`Delete message #${msgId}?`)) return;
+  const r = await fetch(`${API}/messages/${msgId}`, { method: 'DELETE' });
+  if (!r.ok) {
+    const err = await r.json().catch(() => ({ error: `HTTP ${r.status}` }));
+    alert(`Delete failed: ${err.error || 'unknown error'}`);
+    return;
+  }
+  fetchMessages();
+  fetchStats();
+}
+async function doClaim(msgId) {
+  const from = document.getElementById('c-from').value.trim();
+  if (!from) return alert('Select "From" agent to claim as');
+  const r = await fetch(`${API}/messages/${msgId}/claim`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ agentId: from }),
+  });
+  const result = await r.json();
+  if (!result.ok) alert(result.error || 'Claim failed');
+  fetchMessages();
+}
+function esc(s) { const d = document.createElement('div'); d.textContent = s; return d.innerHTML; }
+// Poll
+function refresh() {
+  fetchStats();
+  fetchAgents();
+  fetchMessages();
+}
+refresh();
+setInterval(() => {
+  if (document.getElementById('auto-refresh').checked) refresh();
+}, 3000);
+document.getElementById('filter-agent').addEventListener('change', fetchMessages);
+document.getElementById('filter-channel').addEventListener('input', fetchMessages);
+</script>
+</body>
+</html>

package/src/config.ts ADDED Viewed

@@ -0,0 +1,11 @@
+// Shared runtime constants. Import from here rather than redefining.
+export const STALE_TTL_MS = 600_000; // 10min without heartbeat → offline
+export const REAP_INTERVAL_MS = 60_000; // reaper cadence
+export const DAY_MS = 86_400_000;
+// Max body size for any POST/PATCH request (64 KiB).
+export const MAX_BODY_BYTES = 64 * 1024;
+// Default capabilities for session-start hook when AGENT_RELAY_CAPS is unset.
+export const DEFAULT_CAPABILITIES = ["chat"];