nexo-brain 5.3.26 → 5.3.28

package/src/dashboard/templates/skills 2.html

@@ -1,329 +0,0 @@
-{% extends "base.html" %}
-
-{% block title %}Skills Lab{% endblock %}
-{% block page_title %}Skills Lab{% endblock %}
-
-{% block head %}
-<style>
-  .kanban-col {
-    min-height: 300px;
-    transition: background 0.2s;
-  }
-  .kanban-col:hover {
-    background: rgba(30, 41, 59, 0.3);
-  }
-  .skill-card {
-    transition: all 0.25s ease;
-    cursor: pointer;
-    animation: slideIn 0.3s ease-out forwards;
-  }
-  .skill-card:hover {
-    border-color: rgba(124, 58, 237, 0.4);
-    box-shadow: 0 4px 20px rgba(124, 58, 237, 0.1);
-    transform: translateY(-1px);
-  }
-  .skill-card .detail-panel {
-    max-height: 0;
-    overflow: hidden;
-    transition: max-height 0.4s ease, opacity 0.3s ease;
-    opacity: 0;
-  }
-  .skill-card.expanded .detail-panel {
-    max-height: 600px;
-    opacity: 1;
-  }
-  .tag-pill {
-    transition: transform 0.15s;
-  }
-  .tag-pill:hover {
-    transform: scale(1.05);
-  }
-  .trust-bar-fill {
-    transition: width 0.8s cubic-bezier(0.22, 1, 0.36, 1);
-  }
-  .level-badge-trace { background: rgba(148, 163, 184, 0.1); color: #94a3b8; border-color: rgba(148, 163, 184, 0.2); }
-  .level-badge-draft { background: rgba(251, 191, 36, 0.1); color: #fbbf24; border-color: rgba(251, 191, 36, 0.2); }
-  .level-badge-candidate { background: rgba(96, 165, 250, 0.1); color: #60a5fa; border-color: rgba(96, 165, 250, 0.2); }
-  .level-badge-published { background: rgba(52, 211, 153, 0.1); color: #34d399; border-color: rgba(52, 211, 153, 0.2); }
-  .level-badge-archived { background: rgba(107, 114, 128, 0.1); color: #6b7280; border-color: rgba(107, 114, 128, 0.2); }
-  .drag-hint {
-    cursor: grab;
-    opacity: 0.3;
-    transition: opacity 0.2s;
-  }
-  .skill-card:hover .drag-hint {
-    opacity: 0.6;
-  }
-  @keyframes slideIn {
-    from { opacity: 0; transform: translateY(8px); }
-    to { opacity: 1; transform: translateY(0); }
-  }
-</style>
-{% endblock %}
-
-{% block header_actions %}
-<div class="flex items-center gap-2">
-  <input type="text" id="skill-search" placeholder="Filter skills..."
-    class="bg-slate-800 border border-slate-700 rounded-lg px-3 py-1.5 text-xs text-slate-200 placeholder-slate-500 focus:outline-none focus:ring-1 focus:ring-violet-500 w-52"
-    oninput="filterSkills()">
-</div>
-{% endblock %}
-
-{% block content %}
-<!-- Stats Header -->
-<div class="grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-6 gap-3 mb-6" id="stats-row">
-  <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 text-center">
-    <div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Total Skills</div>
-    <div class="text-2xl font-display font-bold text-slate-200" id="stat-total">--</div>
-  </div>
-  <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 text-center">
-    <div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Trace</div>
-    <div class="text-2xl font-display font-bold text-slate-400" id="stat-trace">--</div>
-  </div>
-  <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 text-center">
-    <div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Draft</div>
-    <div class="text-2xl font-display font-bold text-amber-400" id="stat-draft">--</div>
-  </div>
-  <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 text-center">
-    <div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Candidate</div>
-    <div class="text-2xl font-display font-bold text-blue-400" id="stat-candidate">--</div>
-  </div>
-  <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 text-center">
-    <div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Published</div>
-    <div class="text-2xl font-display font-bold text-emerald-400" id="stat-published">--</div>
-  </div>
-  <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 text-center">
-    <div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Archived</div>
-    <div class="text-2xl font-display font-bold text-gray-500" id="stat-archived">--</div>
-  </div>
-</div>
-
-<!-- Top Skills by Usage -->
-<div class="mb-6">
-  <h2 class="text-xs uppercase tracking-wider text-slate-500 font-semibold mb-3">Top Skills by Usage</h2>
-  <div class="flex gap-3 overflow-x-auto pb-2" id="top-skills">
-    <div class="text-xs text-slate-600 py-3">Loading...</div>
-  </div>
-</div>
-
-<!-- Kanban Board -->
-<div class="mb-6">
-  <h2 class="text-xs uppercase tracking-wider text-slate-500 font-semibold mb-3">Skill Lifecycle</h2>
-  <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-3" id="kanban-board">
-    <!-- Columns generated by JS -->
-  </div>
-</div>
-
-<!-- Recent Usage Timeline -->
-<div>
-  <h2 class="text-xs uppercase tracking-wider text-slate-500 font-semibold mb-3">Recent Usage</h2>
-  <div class="space-y-2" id="usage-timeline">
-    <div class="text-xs text-slate-600 text-center py-6">Loading usage data...</div>
-  </div>
-</div>
-{% endblock %}
-
-{% block scripts %}
-<script>
-  const REFRESH_MS = 60000;
-  const LEVELS = ['trace', 'draft', 'candidate', 'published', 'archived'];
-  const LEVEL_COLORS = {
-    trace: { bg: 'bg-slate-500/10', border: 'border-slate-500/20', text: 'text-slate-400', dot: 'bg-slate-400' },
-    draft: { bg: 'bg-amber-500/10', border: 'border-amber-500/20', text: 'text-amber-400', dot: 'bg-amber-400' },
-    candidate: { bg: 'bg-blue-500/10', border: 'border-blue-500/20', text: 'text-blue-400', dot: 'bg-blue-400' },
-    published: { bg: 'bg-emerald-500/10', border: 'border-emerald-500/20', text: 'text-emerald-400', dot: 'bg-emerald-400' },
-    archived: { bg: 'bg-gray-500/10', border: 'border-gray-500/20', text: 'text-gray-500', dot: 'bg-gray-500' },
-  };
-
-  let allSkills = [];
-
-  const TAG_COLORS = [
-    'bg-violet-500/15 text-violet-300', 'bg-cyan-500/15 text-cyan-300',
-    'bg-pink-500/15 text-pink-300', 'bg-emerald-500/15 text-emerald-300',
-    'bg-amber-500/15 text-amber-300', 'bg-blue-500/15 text-blue-300',
-    'bg-rose-500/15 text-rose-300', 'bg-indigo-500/15 text-indigo-300',
-  ];
-
-  function tagColor(tag) {
-    let hash = 0;
-    for (let i = 0; i < tag.length; i++) hash = tag.charCodeAt(i) + ((hash << 5) - hash);
-    return TAG_COLORS[Math.abs(hash) % TAG_COLORS.length];
-  }
-
-  function trustColor(score) {
-    if (score >= 0.8) return 'bg-emerald-500';
-    if (score >= 0.5) return 'bg-violet-500';
-    if (score >= 0.3) return 'bg-amber-500';
-    return 'bg-red-500';
-  }
-
-  function renderSkillCard(skill) {
-    const level = (skill.level || 'trace').toLowerCase();
-    const colors = LEVEL_COLORS[level] || LEVEL_COLORS.trace;
-    const trust = skill.trust_score != null ? skill.trust_score : 0;
-    const tags = skill.tags || [];
-    const useCount = skill.use_count || 0;
-    const steps = skill.steps || [];
-    const gotchas = skill.gotchas || [];
-    const desc = skill.description || '';
-
-    const tagsHtml = tags.slice(0, 5).map(t =>
-      `<span class="tag-pill text-[10px] px-1.5 py-0.5 rounded-full ${tagColor(t)}">${escapeHtml(t)}</span>`
-    ).join('');
-
-    const stepsHtml = steps.length > 0
-      ? `<div class="mt-3"><div class="text-[10px] uppercase tracking-wider text-slate-500 font-semibold mb-1">Steps</div><ol class="list-decimal list-inside space-y-0.5">${steps.map(s => `<li class="text-xs text-slate-400">${escapeHtml(typeof s === 'string' ? s : s.description || JSON.stringify(s))}</li>`).join('')}</ol></div>`
-      : '';
-
-    const gotchasHtml = gotchas.length > 0
-      ? `<div class="mt-3"><div class="text-[10px] uppercase tracking-wider text-amber-500/60 font-semibold mb-1">Gotchas</div><ul class="space-y-0.5">${gotchas.map(g => `<li class="text-xs text-amber-300/70">&#x26A0; ${escapeHtml(typeof g === 'string' ? g : JSON.stringify(g))}</li>`).join('')}</ul></div>`
-      : '';
-
-    return `<div class="skill-card bg-slate-900/50 border border-slate-800/50 rounded-xl p-3 mb-2" data-name="${escapeHtml(skill.name || '')}" data-level="${level}" onclick="this.classList.toggle('expanded')">
-      <div class="flex items-start justify-between mb-1.5">
-        <div class="flex items-center gap-1.5 min-w-0">
-          <svg class="w-3 h-3 drag-hint text-slate-600 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20"><circle cx="6" cy="5" r="1.5"/><circle cx="14" cy="5" r="1.5"/><circle cx="6" cy="10" r="1.5"/><circle cx="14" cy="10" r="1.5"/><circle cx="6" cy="15" r="1.5"/><circle cx="14" cy="15" r="1.5"/></svg>
-          <span class="text-sm font-medium text-slate-200 truncate">${escapeHtml(skill.name || 'Unnamed')}</span>
-        </div>
-        <span class="text-[10px] font-mono text-slate-600 flex-shrink-0 ml-2">#${skill.id || '?'}</span>
-      </div>
-
-      <!-- Trust score bar -->
-      <div class="flex items-center gap-2 mb-2">
-        <div class="flex-1 h-1.5 bg-slate-800 rounded-full overflow-hidden">
-          <div class="trust-bar-fill h-full rounded-full ${trustColor(trust)}" style="width:${(trust * 100).toFixed(0)}%"></div>
-        </div>
-        <span class="text-[10px] font-mono text-slate-500">${trust.toFixed(2)}</span>
-      </div>
-
-      <div class="flex items-center gap-2 flex-wrap">
-        <span class="text-[10px] font-mono text-slate-500">${useCount} uses</span>
-        ${tagsHtml}
-      </div>
-
-      <!-- Expandable detail -->
-      <div class="detail-panel">
-        <div class="mt-3 pt-3 border-t border-slate-800/50">
-          ${desc ? `<p class="text-xs text-slate-400 leading-relaxed mb-2">${escapeHtml(desc)}</p>` : ''}
-          ${stepsHtml}
-          ${gotchasHtml}
-        </div>
-      </div>
-    </div>`;
-  }
-
-  function renderKanban(skills) {
-    const board = document.getElementById('kanban-board');
-    const grouped = {};
-    LEVELS.forEach(l => grouped[l] = []);
-    skills.forEach(s => {
-      const level = (s.level || 'trace').toLowerCase();
-      if (grouped[level]) grouped[level].push(s);
-      else grouped.trace.push(s);
-    });
-
-    board.innerHTML = LEVELS.map(level => {
-      const colors = LEVEL_COLORS[level];
-      const items = grouped[level];
-      return `<div class="kanban-col ${colors.bg} border ${colors.border} rounded-xl p-3">
-        <div class="flex items-center gap-2 mb-3 pb-2 border-b ${colors.border}">
-          <span class="w-2 h-2 rounded-full ${colors.dot}"></span>
-          <span class="text-xs uppercase tracking-wider ${colors.text} font-semibold">${level}</span>
-          <span class="text-[10px] font-mono text-slate-600 ml-auto">${items.length}</span>
-        </div>
-        <div class="space-y-0">
-          ${items.length === 0
-            ? `<div class="text-[10px] text-slate-600 text-center py-4">No skills</div>`
-            : items.map(renderSkillCard).join('')}
-        </div>
-      </div>`;
-    }).join('');
-  }
-
-  function renderTopSkills(skills) {
-    const container = document.getElementById('top-skills');
-    const sorted = [...skills].sort((a, b) => (b.use_count || 0) - (a.use_count || 0)).slice(0, 8);
-    if (sorted.length === 0) {
-      container.innerHTML = '<div class="text-xs text-slate-600 py-3">No skill usage data</div>';
-      return;
-    }
-    const maxUse = sorted[0].use_count || 1;
-    container.innerHTML = sorted.map(s => {
-      const pct = ((s.use_count || 0) / maxUse * 100).toFixed(0);
-      const level = (s.level || 'trace').toLowerCase();
-      const colors = LEVEL_COLORS[level] || LEVEL_COLORS.trace;
-      return `<div class="flex-shrink-0 bg-slate-900/50 border border-slate-800/50 rounded-xl p-3 w-44">
-        <div class="text-sm font-medium text-slate-200 truncate mb-1">${escapeHtml(s.name || 'Unnamed')}</div>
-        <div class="flex items-center gap-2 mb-1">
-          <div class="flex-1 h-1 bg-slate-800 rounded-full overflow-hidden">
-            <div class="h-full rounded-full bg-violet-500" style="width:${pct}%"></div>
-          </div>
-        </div>
-        <div class="flex items-center justify-between">
-          <span class="text-[10px] font-mono text-slate-500">${s.use_count || 0} uses</span>
-          <span class="text-[10px] px-1 py-0.5 rounded level-badge-${level}">${level}</span>
-        </div>
-      </div>`;
-    }).join('');
-  }
-
-  function renderUsageTimeline(usage) {
-    const container = document.getElementById('usage-timeline');
-    if (!usage || usage.length === 0) {
-      container.innerHTML = '<div class="text-xs text-slate-600 text-center py-6">No recent usage</div>';
-      return;
-    }
-    container.innerHTML = usage.slice(0, 20).map(u => {
-      const skillName = u.skill_name || u.name || `Skill #${u.skill_id || '?'}`;
-      const when = u.created_at ? relativeTime(u.created_at) : '';
-      const result = u.result || u.outcome || '';
-      return `<div class="flex items-center gap-3 bg-slate-900/30 border border-slate-800/30 rounded-lg px-3 py-2">
-        <div class="w-1.5 h-1.5 rounded-full bg-violet-500 flex-shrink-0"></div>
-        <span class="text-xs text-slate-300 font-medium">${escapeHtml(skillName)}</span>
-        ${result ? `<span class="text-[10px] px-1.5 py-0.5 rounded ${result === 'success' ? 'bg-emerald-500/10 text-emerald-400' : 'bg-red-500/10 text-red-400'}">${escapeHtml(result)}</span>` : ''}
-        <span class="text-[10px] text-slate-600 font-mono ml-auto">${escapeHtml(when)}</span>
-      </div>`;
-    }).join('');
-  }
-
-  function filterSkills() {
-    const q = document.getElementById('skill-search').value.trim().toLowerCase();
-    const filtered = q ? allSkills.filter(s =>
-      (s.name || '').toLowerCase().includes(q) ||
-      (s.description || '').toLowerCase().includes(q) ||
-      (s.tags || []).some(t => t.toLowerCase().includes(q))
-    ) : allSkills;
-    renderKanban(filtered);
-  }
-
-  async function loadSkills() {
-    const data = await fetchJSON('/api/skills');
-    if (!data) return;
-
-    allSkills = data.skills || [];
-    const usage = data.usage || [];
-    const levels = data.levels || {};
-
-    // Stats
-    document.getElementById('stat-total').textContent = formatNumber(allSkills.length);
-    const countByLevel = {};
-    LEVELS.forEach(l => countByLevel[l] = 0);
-    allSkills.forEach(s => {
-      const l = (s.level || 'trace').toLowerCase();
-      if (countByLevel[l] !== undefined) countByLevel[l]++;
-    });
-    LEVELS.forEach(l => {
-      const el = document.getElementById(`stat-${l}`);
-      if (el) el.textContent = formatNumber(levels[l] != null ? levels[l] : countByLevel[l]);
-    });
-
-    renderKanban(allSkills);
-    renderTopSkills(allSkills);
-    renderUsageTimeline(usage);
-  }
-
-  // Init
-  loadSkills();
-  setInterval(loadSkills, REFRESH_MS);
-</script>
-{% endblock %}

package/src/dashboard/templates/somatic 2.html

@@ -1,73 +0,0 @@
-{% extends "base.html" %}
-
-{% block title %}Somatic Markers{% endblock %}
-{% block page_title %}Somatic Markers{% endblock %}
-
-{% block content %}
-<div class="max-w-3xl">
-  <p class="text-sm text-slate-400 mb-6">Risk associations from past errors. Higher scores indicate areas needing extra caution.</p>
-  <div id="risks" class="space-y-2"></div>
-  <div id="empty" class="p-12 text-center text-slate-500 text-sm hidden">No somatic markers recorded</div>
-</div>
-{% endblock %}
-
-{% block scripts %}
-<script>
-  function barColor(score) {
-    if (score > 5) return 'bg-red-500';
-    if (score > 2) return 'bg-amber-500';
-    return 'bg-emerald-500';
-  }
-
-  function scoreColor(score) {
-    if (score > 5) return 'text-red-400';
-    if (score > 2) return 'text-amber-400';
-    return 'text-emerald-400';
-  }
-
-  function loadData() {
-    fetch('/api/somatic')
-      .then(r => r.json())
-      .then(data => {
-        const risks = (data.risks || []).slice().sort((a, b) => {
-          const sa = Math.abs(a.cumulative_score || a.score || 0);
-          const sb = Math.abs(b.cumulative_score || b.score || 0);
-          return sb - sa;
-        });
-
-        const container = document.getElementById('risks');
-        const empty = document.getElementById('empty');
-
-        if (!risks.length) {
-          empty.classList.remove('hidden');
-          return;
-        }
-
-        const max = Math.max(...risks.map(r => Math.abs(r.cumulative_score || r.score || 0)), 1);
-
-        container.innerHTML = risks.map(r => {
-          const score = Math.abs(r.cumulative_score || r.score || 0);
-          const pct = Math.min((score / max) * 100, 100);
-          const target_type = r.target_type || r.type || '';
-          const target = (r.target || r.name || '').replace(/</g, '&lt;');
-          const bc = barColor(score);
-          const sc = scoreColor(score);
-
-          return `<div class="flex items-center gap-3 py-1">
-<span class="text-xs w-20 text-right text-slate-400 flex-shrink-0 font-medium">${target_type}</span>
-<span class="text-sm w-56 truncate text-slate-200 flex-shrink-0">${target}</span>
-<div class="flex-1 h-2.5 bg-slate-800 rounded-full overflow-hidden">
-  <div class="h-full rounded-full ${bc}" style="width:${pct.toFixed(1)}%"></div>
-</div>
-<span class="text-sm font-mono ${sc} w-12 text-right font-medium">${score.toFixed(1)}</span>
-</div>`;
-        }).join('');
-      })
-      .catch(err => {
-        document.getElementById('risks').innerHTML = `<p class="text-xs text-red-400">Failed to load: ${err.message}</p>`;
-      });
-  }
-
-  loadData();
-</script>
-{% endblock %}

package/src/dashboard/templates/triggers 2.html

@@ -1,133 +0,0 @@
-{% extends "base.html" %}
-
-{% block title %}Prospective Triggers{% endblock %}
-{% block page_title %}Prospective Triggers{% endblock %}
-
-{% block content %}
-<div class="space-y-5">
-  <!-- Stats -->
-  <div class="grid grid-cols-3 gap-4">
-    <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 card">
-      <div class="text-xs uppercase tracking-wider text-slate-400 font-medium mb-2">Total Triggers</div>
-      <div class="text-xl font-mono font-semibold text-slate-200" id="total-triggers">--</div>
-    </div>
-    <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 card">
-      <div class="flex items-center gap-2 mb-2">
-        <span class="w-2 h-2 rounded-full bg-emerald-500 glow-dot" style="color: #10B981;"></span>
-        <div class="text-xs uppercase tracking-wider text-emerald-400/70 font-medium">Armed</div>
-      </div>
-      <div class="text-xl font-mono font-semibold text-emerald-400" id="armed-count">--</div>
-    </div>
-    <div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-4 card">
-      <div class="text-xs uppercase tracking-wider text-slate-400 font-medium mb-2">Fired</div>
-      <div class="text-xl font-mono font-semibold text-slate-400" id="fired-count">--</div>
-    </div>
-  </div>
-
-  <!-- Triggers grid -->
-  <div>
-    <div class="flex items-center gap-3 mb-3">
-      <div class="text-xs uppercase tracking-wider text-slate-400 font-medium">Armed Triggers</div>
-      <span class="w-2 h-2 rounded-full bg-emerald-500 glow-dot" style="color: #10B981;"></span>
-    </div>
-    <div class="grid grid-cols-2 gap-4" id="armed-triggers">
-      <div class="text-xs text-slate-600 py-4 text-center col-span-2">loading...</div>
-    </div>
-  </div>
-
-  <div>
-    <div class="text-xs uppercase tracking-wider text-slate-400 font-medium mb-3">Fired / Inactive</div>
-    <div class="grid grid-cols-2 gap-4" id="fired-triggers">
-      <div class="text-xs text-slate-600 py-4 text-center col-span-2">loading...</div>
-    </div>
-  </div>
-</div>
-
-<style>
-  @keyframes triggerPulse {
-    0%, 100% { border-color: rgba(16,185,129,0.2); }
-    50% { border-color: rgba(16,185,129,0.5); }
-  }
-  .trigger-armed { animation: triggerPulse 3s ease-in-out infinite; }
-</style>
-{% endblock %}
-
-{% block scripts %}
-<script>
-function renderTrigger(t, isArmed) {
-  const pattern = t.trigger_pattern || t.pattern || '--';
-  const action = t.action || '--';
-  const context = t.context || '';
-  const status = t.status || 'armed';
-  const firedAt = t.fired_at;
-
-  if (isArmed) {
-    return `<div class="bg-slate-900/50 border border-emerald-500/20 rounded-xl p-5 card trigger-armed">
-      <div class="flex items-center gap-2 mb-3">
-        <span class="relative flex h-2 w-2">
-          <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75"></span>
-          <span class="relative inline-flex rounded-full h-2 w-2 bg-emerald-500"></span>
-        </span>
-        <span class="text-xs font-medium text-emerald-400 uppercase tracking-wider">Armed</span>
-      </div>
-      <div class="mb-3">
-        <div class="text-[10px] text-slate-500 uppercase mb-1">Pattern</div>
-        <div class="text-sm text-slate-200 font-mono bg-slate-800/50 rounded-lg px-3 py-2">${escapeHtml(pattern)}</div>
-      </div>
-      <div class="mb-3">
-        <div class="text-[10px] text-slate-500 uppercase mb-1">Action</div>
-        <div class="text-xs text-slate-300">${escapeHtml(action)}</div>
-      </div>
-      ${context ? `<div class="text-[10px] text-slate-500 mt-2">${escapeHtml(context)}</div>` : ''}
-    </div>`;
-  } else {
-    return `<div class="bg-slate-900/50 border border-slate-800/50 rounded-xl p-5 card opacity-60 hover:opacity-80 transition-opacity">
-      <div class="flex items-center gap-2 mb-3">
-        <span class="w-2 h-2 rounded-full bg-slate-600"></span>
-        <span class="text-xs font-medium text-slate-500 uppercase tracking-wider">${escapeHtml(status)}</span>
-        ${firedAt ? `<span class="ml-auto text-[10px] text-slate-600">${relativeTime(firedAt)}</span>` : ''}
-      </div>
-      <div class="mb-3">
-        <div class="text-[10px] text-slate-600 uppercase mb-1">Pattern</div>
-        <div class="text-xs text-slate-400 font-mono bg-slate-800/30 rounded-lg px-3 py-2">${escapeHtml(pattern)}</div>
-      </div>
-      <div>
-        <div class="text-[10px] text-slate-600 uppercase mb-1">Action</div>
-        <div class="text-xs text-slate-500">${escapeHtml(action)}</div>
-      </div>
-      ${context ? `<div class="text-[10px] text-slate-600 mt-2">${escapeHtml(context)}</div>` : ''}
-    </div>`;
-  }
-}
-
-async function loadTriggers() {
-  const data = await fetchJSON('/api/triggers');
-  if (!data) return;
-
-  const triggers = data.triggers || [];
-  const armed = triggers.filter(t => t.status === 'armed' || t.status === 'active');
-  const fired = triggers.filter(t => t.status !== 'armed' && t.status !== 'active');
-
-  document.getElementById('total-triggers').textContent = triggers.length;
-  document.getElementById('armed-count').textContent = data.armed ?? armed.length;
-  document.getElementById('fired-count').textContent = data.fired ?? fired.length;
-
-  const armedContainer = document.getElementById('armed-triggers');
-  if (armed.length) {
-    armedContainer.innerHTML = armed.map(t => renderTrigger(t, true)).join('');
-  } else {
-    armedContainer.innerHTML = '<div class="col-span-2 bg-slate-900/50 border border-slate-800/50 rounded-xl p-5 text-xs text-slate-500 text-center">No armed triggers</div>';
-  }
-
-  const firedContainer = document.getElementById('fired-triggers');
-  if (fired.length) {
-    firedContainer.innerHTML = fired.map(t => renderTrigger(t, false)).join('');
-  } else {
-    firedContainer.innerHTML = '<div class="col-span-2 bg-slate-900/50 border border-slate-800/50 rounded-xl p-5 text-xs text-slate-500 text-center">No fired triggers</div>';
-  }
-}
-
-loadTriggers();
-setInterval(loadTriggers, 60000);
-</script>
-{% endblock %}