{% extends "base.html" %}
{% block title %}Search & Chat — Document Intelligence — ICDEV™{% endblock %}
{% block content %}
<div class="cui-banner" style="background:#1a1a2e;border:1px solid #e94560;padding:4px 12px;font-size:11px;color:#e94560;text-align:center;margin-bottom:12px;">CUI // SP-CTI</div>

<!-- Footnote Attribution Popover -->
<style>
.aidp-popover {
  display:none;position:fixed;z-index:9999;
  background:#0d1b2e;border:1px solid #1e3a6e;border-radius:8px;
  padding:12px 15px;min-width:320px;max-width:420px;
  box-shadow:0 6px 24px rgba(0,0,0,.6);font-size:11px;
}
.aidp-popover.visible { display:block; }
.aidp-popover-row { display:flex;align-items:center;gap:8px;margin-bottom:6px;line-height:1.4; }
.aidp-popover-row:last-child { margin-bottom:0; }
.aidp-footnote {
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:3px;
  background:#0f3460;color:#7ab3f0;font-size:10px;font-weight:700;
  cursor:pointer;vertical-align:super;margin-left:4px;line-height:1;
  border:1px solid #1e3a6e;user-select:none;
}
.aidp-footnote:hover { background:#1a4a80;border-color:#4f8ef7; }
</style>
<div id="aidp-popover" class="aidp-popover" role="tooltip" aria-label="Attribution Details"></div>

<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;">
  <div>
    <h2 style="margin:0;color:#eaeaea;font-size:20px;">🔍 Search &amp; Chat</h2>
    <p style="color:#7a8cb0;font-size:12px;margin:4px 0 0;">Grounded no-LLM search with mandatory citations · Conversational AI with evidence verification</p>
  </div>
  <a href="/document-intelligence/" style="background:#0f3460;color:#7ab3f0;padding:8px 16px;border-radius:5px;text-decoration:none;font-size:13px;">← Back to DIC</a>
</div>

<!-- Mode Toggle -->
<div style="display:flex;gap:2px;background:#050d1f;border:1px solid #1a3560;border-radius:6px;padding:3px;width:fit-content;margin-bottom:18px;">
  <button id="btn-search" onclick="setMode('search')"
    style="background:#0f3460;color:#7ab3f0;padding:6px 18px;border:none;border-radius:4px;cursor:pointer;font-size:13px;font-weight:600;">
    Search
  </button>
  <button id="btn-chat" onclick="setMode('chat')"
    style="background:none;color:#5a7aa0;padding:6px 18px;border:none;border-radius:4px;cursor:pointer;font-size:13px;">
    Chat
  </button>
  <button id="btn-kg" onclick="setMode('kg')"
    style="background:none;color:#5a7aa0;padding:6px 18px;border:none;border-radius:4px;cursor:pointer;font-size:13px;">
    KG Explorer
  </button>
</div>

<!-- Search Bar -->
<div style="display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap;">
  <input type="text" id="query-input" placeholder="Ask a question or search your documents…"
    style="flex:1;min-width:280px;background:#050d1f;border:1px solid #1a3560;color:#b8d0e8;padding:10px 14px;border-radius:5px;font-size:13px;"
    onkeydown="if(event.key==='Enter') submitQuery()">
  <input type="text" id="collection-filter" placeholder="Collection ID (optional)"
    style="background:#050d1f;border:1px solid #1a3560;color:#b8d0e8;padding:10px 12px;border-radius:5px;font-size:12px;width:180px;">
  <button onclick="submitQuery()"
    style="background:#0f3460;color:#7ab3f0;padding:10px 20px;border:1px solid #1e3a6e;border-radius:5px;cursor:pointer;font-size:13px;font-weight:600;">
    Go
  </button>
</div>

<!-- Search Results Panel -->
<div id="search-panel">
  <div id="search-results"></div>
</div>

<!-- Chat Panel -->
<div id="chat-panel" style="display:none;">
  <div id="chat-thread" style="min-height:200px;max-height:500px;overflow-y:auto;background:#050d1f;border:1px solid #1a3560;border-radius:8px;padding:16px;margin-bottom:12px;"></div>
  <div id="chat-thinking" style="display:none;color:#5a7aa0;font-size:12px;padding:8px 0;">Thinking…</div>
</div>

<!-- KG Explorer Panel -->
<div id="kg-panel" style="display:none;">
  <div style="background:#0d1b2e;border:1px solid #1a3560;border-radius:8px;padding:16px;margin-bottom:14px;">
    <div style="display:flex;gap:8px;flex-wrap:wrap;align-items:end;">
      <div>
        <label style="color:#5a7aa0;font-size:11px;display:block;margin-bottom:4px;text-transform:uppercase;">Entity / Concept</label>
        <input type="text" id="kg-label" placeholder="e.g. Sun Tzu, commander, strategy…"
          style="background:#050d1f;border:1px solid #1a3560;color:#b8d0e8;padding:8px 12px;border-radius:5px;font-size:13px;width:240px;"
          onkeydown="if(event.key==='Enter') runKG()">
      </div>
      <div>
        <label style="color:#5a7aa0;font-size:11px;display:block;margin-bottom:4px;text-transform:uppercase;">Mode</label>
        <select id="kg-mode" style="background:#050d1f;border:1px solid #1a3560;color:#b8d0e8;padding:8px 10px;border-radius:5px;font-size:12px;">
          <option value="entities">All Entities (browse)</option>
          <option value="relations">Relationships of Entity</option>
          <option value="neighbors">Neighbors (direct connections)</option>
        </select>
      </div>
      <div>
        <label style="color:#5a7aa0;font-size:11px;display:block;margin-bottom:4px;text-transform:uppercase;">Type filter</label>
        <select id="kg-type" style="background:#050d1f;border:1px solid #1a3560;color:#b8d0e8;padding:8px 10px;border-radius:5px;font-size:12px;">
          <option value="">All types</option>
          <option value="PERSON">PERSON</option>
          <option value="ORG">ORG</option>
          <option value="SYSTEM">SYSTEM</option>
          <option value="CONCEPT">CONCEPT</option>
        </select>
      </div>
      <button onclick="runKG()"
        style="background:#0f3460;color:#7ab3f0;padding:8px 18px;border:1px solid #1e3a6e;border-radius:5px;cursor:pointer;font-size:13px;">
        Explore
      </button>
    </div>
  </div>
  <div id="kg-status" style="color:#5a7aa0;font-size:12px;margin-bottom:8px;"></div>
  <div id="kg-results"></div>
</div>

<script>
var _mode = 'search';
var _chatHistory = [];

function setMode(mode) {
  _mode = mode;
  ['search','chat','kg'].forEach(function(m) {
    var btn = document.getElementById('btn-' + m);
    btn.style.background = mode === m ? '#0f3460' : 'none';
    btn.style.color = mode === m ? '#7ab3f0' : '#5a7aa0';
  });
  document.getElementById('search-panel').style.display = mode === 'search' ? 'block' : 'none';
  document.getElementById('chat-panel').style.display = mode === 'chat' ? 'block' : 'none';
  document.getElementById('kg-panel').style.display = mode === 'kg' ? 'block' : 'none';
  document.getElementById('query-input').placeholder = mode === 'search'
    ? 'Search your documents…'
    : mode === 'chat'
      ? 'Ask a question about your documents…'
      : 'Use KG Explorer below…';
}

function submitQuery() {
  var query = document.getElementById('query-input').value.trim();
  if (!query) return;
  if (_mode === 'search') runSearch(query);
  else runChat(query);
}

// ── Footnote popover (AIDP attribution) ──────────────────────────────────────
var _popover = null;
var _popoverTimer = null;
var _resultMeta = {};

async function _sha256hex(text) {
  try {
    var buf = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(text));
    return Array.from(new Uint8Array(buf)).map(function(b) { return b.toString(16).padStart(2, '0'); }).join('');
  } catch(e) { return null; }
}

function _showPopover(ev, meta) {
  if (!_popover) _popover = document.getElementById('aidp-popover');
  clearTimeout(_popoverTimer);
  var clf = meta.classification || 'CUI';
  var clfColor = clf === 'SECRET' ? '#ef4444' : clf === 'TOP SECRET' ? '#f97316' : '#e94560';
  var pct = meta.score !== undefined ? (meta.score * 100).toFixed(1) + '%' : '—';
  var sha = meta.sha256 || meta.content_sha256 || '—';
  var archiveHref = meta.source_uri
    ? '<a href="' + escHtml(meta.source_uri) + '" target="_blank" style="color:#4f8ef7;text-decoration:none;">Open source ↗</a>'
    : meta.doc_id
      ? '<a href="/document-intelligence/doc/' + escHtml(meta.doc_id) + '" style="color:#4f8ef7;text-decoration:none;">View document ↗</a>'
      : '<span style="color:#5a7aa0;">—</span>';
  _popover.innerHTML =
    '<div style="color:#7ab3f0;font-size:12px;font-weight:700;margin-bottom:8px;border-bottom:1px solid #1a3560;padding-bottom:6px;">📎 Attribution</div>' +
    '<div class="aidp-popover-row"><span style="color:#5a7aa0;min-width:90px;">SHA-256</span>' +
    '<code data-testid="aidp-sha256" style="color:#86efac;font-size:10px;word-break:break-all;background:#060f1e;padding:2px 5px;border-radius:3px;">' + escHtml(sha) + '</code></div>' +
    '<div class="aidp-popover-row"><span style="color:#5a7aa0;min-width:90px;">Classification</span>' +
    '<span data-testid="aidp-classification" style="background:#2a0a14;color:' + clfColor + ';padding:2px 8px;border-radius:3px;font-weight:600;">' + escHtml(clf) + '</span></div>' +
    '<div class="aidp-popover-row"><span style="color:#5a7aa0;min-width:90px;">Attribution</span>' +
    '<span data-testid="aidp-attribution" style="color:#a8c8e0;">' + escHtml(pct) + '</span></div>' +
    '<div class="aidp-popover-row"><span style="color:#5a7aa0;min-width:90px;">Archive</span>' +
    '<span data-testid="aidp-archive">' + archiveHref + '</span></div>';
  _popover.classList.add('visible');
  var vw = window.innerWidth, vh = window.innerHeight;
  var x = ev.clientX + 14, y = ev.clientY + 10;
  if (x + 430 > vw) x = ev.clientX - 430;
  if (y + 160 > vh) y = ev.clientY - 160;
  _popover.style.left = Math.max(4, x) + 'px';
  _popover.style.top = Math.max(4, y) + 'px';
}

function _hidePopover(delay) {
  _popoverTimer = setTimeout(function() {
    if (_popover) _popover.classList.remove('visible');
  }, delay || 300);
}

document.addEventListener('DOMContentLoaded', function() {
  var p = document.getElementById('aidp-popover');
  if (p) {
    p.addEventListener('mouseenter', function() { clearTimeout(_popoverTimer); });
    p.addEventListener('mouseleave', function() { _hidePopover(200); });
  }
});
// ─────────────────────────────────────────────────────────────────────────────

function runSearch(query) {
  var collection = document.getElementById('collection-filter').value.trim();
  var results = document.getElementById('search-results');
  results.innerHTML = '<div style="color:#5a7aa0;font-size:12px;padding:12px 0;">Searching…</div>';
  fetch('/document-intelligence/api/search', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({query: query, collection_id: collection || null, mode: 'grounded'})
  }).then(function(r) { return r.json(); })
    .then(function(data) {
      if (!data.results || !data.results.length) {
        results.innerHTML = '<p style="color:#5a7aa0;padding:12px 0;">No results found. Try uploading documents or broadening your query.</p>';
        return;
      }
      _resultMeta = {};
      results.innerHTML = data.results.map(function(r, idx) {
        var fnId = 'fn-' + idx;
        _resultMeta[fnId] = {
          content_sha256: r.content_sha256 || '',
          classification: r.citation.classification || 'CUI',
          score: r.score,
          source_uri: r.citation.source_uri || '',
          doc_id: r.doc_id || '',
          _content: r.content || ''
        };
        var terms = r.matched_terms && r.matched_terms.length
          ? '<div style="margin-top:6px;font-size:11px;color:#5a7aa0;">Matched: ' + r.matched_terms.join(', ') + '</div>' : '';
        var kg = r.kg_path && r.kg_path.length
          ? '<details style="margin-top:6px;"><summary style="color:#5a7aa0;font-size:11px;cursor:pointer;">Why this result?</summary><div style="color:#7a8cb0;font-size:11px;padding:4px 0;">' + r.kg_path.join(' → ') + '</div></details>' : '';
        var footnoteBtn = '<span class="aidp-footnote" data-fn="' + fnId + '" data-testid="aidp-footnote-' + idx + '" ' +
          'aria-label="Attribution details" role="button" tabindex="0">' + (idx + 1) + '</span>';
        return '<div style="background:#0b1726;border:1px solid #1a3560;border-radius:8px;padding:14px;margin-bottom:12px;">' +
          '<div style="display:flex;justify-content:space-between;align-items:start;margin-bottom:6px;">' +
          '<div style="font-size:13px;color:#eaeaea;font-weight:600;">' + escHtml(r.doc_title || r.doc_id || 'Document') + '</div>' +
          '<span style="background:#1e293b;color:#94a3b8;font-size:10px;padding:2px 7px;border-radius:3px;">' + (r.score ? (r.score * 100).toFixed(0) + '% match' : '') + '</span>' +
          '</div>' +
          '<div style="color:#a8c8e0;font-size:12px;line-height:1.6;">' +
          escHtml((r.content || '').substring(0, 400)) + (r.content && r.content.length > 400 ? '…' : '') +
          footnoteBtn + '</div>' +
          '<div style="margin-top:8px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;">' +
          '<span style="background:#0a2040;color:#4f8ef7;font-size:10px;padding:2px 8px;border-radius:3px;border:1px solid #1a3a60;">' +
          '📎 ' + escHtml(r.citation.doc_title || r.citation.doc_id || 'doc') +
          (r.citation.page ? ' · p.' + r.citation.page : '') +
          (r.citation.section ? ' · ' + r.citation.section : '') +
          '</span>' +
          '<span style="background:#1e293b;color:#e94560;font-size:10px;padding:2px 6px;border-radius:3px;">' + escHtml(r.citation.classification || 'CUI') + '</span>' +
          '</div>' + terms + kg + '</div>';
      }).join('');

      // Pre-compute SHA-256 for each result (async) and wire hover events
      var _fnKeys = Object.keys(_resultMeta);
      Promise.all(_fnKeys.map(function(fnId) {
        var meta = _resultMeta[fnId];
        return _sha256hex(meta._content || fnId).then(function(hex) {
          if (hex) meta.sha256 = hex;
        });
      })).catch(function() {});

      document.querySelectorAll('.aidp-footnote').forEach(function(btn) {
        var fnId = btn.getAttribute('data-fn');
        btn.addEventListener('mouseenter', function(ev) { _showPopover(ev, _resultMeta[fnId]); });
        btn.addEventListener('mouseleave', function() { _hidePopover(300); });
        btn.addEventListener('focus', function(ev) { _showPopover(ev, _resultMeta[fnId]); });
        btn.addEventListener('blur', function() { _hidePopover(300); });
      });
    })
    .catch(function() { results.innerHTML = '<p style="color:#f87171;">Search failed. Check that documents have been ingested.</p>'; });
}

function runChat(message) {
  var collection = document.getElementById('collection-filter').value.trim();
  var thread = document.getElementById('chat-thread');
  _chatHistory.push({role: 'user', content: message});

  thread.innerHTML += '<div style="margin-bottom:12px;text-align:right;">' +
    '<span style="background:#0f3460;color:#b8d8f8;padding:7px 12px;border-radius:8px 8px 2px 8px;font-size:13px;display:inline-block;max-width:80%;">' +
    escHtml(message) + '</span></div>';
  thread.scrollTop = thread.scrollHeight;
  document.getElementById('query-input').value = '';
  document.getElementById('chat-thinking').style.display = 'block';

  fetch('/document-intelligence/api/chat', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({message: message, collection_id: collection || null, history: _chatHistory.slice(-6)})
  }).then(function(r) { return r.json(); })
    .then(function(data) {
      document.getElementById('chat-thinking').style.display = 'none';
      var answer = data.answer || data.error || '(No response)';
      var sources = (data.sources || data.citations || data.chunks || []).slice(0, 5);
      var answerHtml = escHtml(answer);
      sources.forEach(function(s, i) {
        var num = s.num || (i + 1);
        var url = s.archive_url || (s.doc_id ? '/document-intelligence/doc/' + s.doc_id : '#');
        answerHtml = answerHtml.replace(
          new RegExp('\\[' + num + '\\]', 'g'),
          '<a href="' + escHtml(url) + '" target="_blank" style="color:#4f8ef7;text-decoration:none;font-weight:600;" title="' + escHtml(s.doc_title || s.doc_id || 'source') + '">[' + num + ']</a>'
        );
      });
      var sourceLinks = sources.map(function(s, i) {
        var num = s.num || (i + 1);
        var url = s.archive_url || (s.doc_id ? '/document-intelligence/doc/' + s.doc_id : '#');
        var page = s.page ? ' · p.' + s.page : '';
        var label = s.doc_title || s.doc_id || 'source';
        return '<a href="' + escHtml(url) + '" target="_blank" style="display:inline-flex;align-items:center;gap:4px;background:#0a2040;color:#4f8ef7;font-size:10px;padding:2px 7px;border-radius:3px;border:1px solid #1a3a60;text-decoration:none;margin:0 2px 4px 0;">' + num + '. ' + escHtml(label) + page + '</a>';
      }).join('');
      var badge = data.abstained
        ? '<span style="background:#3a1a00;color:#fbbf24;font-size:10px;padding:1px 6px;border-radius:3px;margin-bottom:6px;display:inline-block;">⚠ Insufficient evidence — partial answer</span><br>'
        : data.mode === 'ai_assisted'
          ? '<span style="background:#052e16;color:#4ade80;font-size:10px;padding:1px 6px;border-radius:3px;margin-bottom:6px;display:inline-block;">AI-assisted · CoD-verified · cited</span><br>'
          : '<span style="background:#0a2040;color:#4f8ef7;font-size:10px;padding:1px 6px;border-radius:3px;margin-bottom:6px;display:inline-block;">📎 Grounded · RAG+KG · no LLM</span><br>';

      thread.innerHTML += '<div style="margin-bottom:14px;">' +
        '<div style="background:#0d1b2e;border:1px solid #1a3560;border-radius:2px 8px 8px 8px;padding:12px 14px;max-width:88%;">' +
        badge + '<span style="color:#a8c8e0;font-size:13px;line-height:1.6;">' + answerHtml + '</span>' +
        (sourceLinks ? '<div style="margin-top:8px;">Sources: ' + sourceLinks + '</div>' : '') +
        '</div></div>';
      thread.scrollTop = thread.scrollHeight;
      _chatHistory.push({role: 'assistant', content: answer});
    })
    .catch(function() {
      document.getElementById('chat-thinking').style.display = 'none';
      thread.innerHTML += '<div style="color:#f87171;font-size:12px;padding:8px 0;">Chat request failed.</div>';
    });
}

function escHtml(s) {
  return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');
}

function runKG() {
  var label = document.getElementById('kg-label').value.trim();
  var query = document.getElementById('query-input').value.trim();
  var mode = document.getElementById('kg-mode').value;
  var entityType = document.getElementById('kg-type').value;
  var collection = document.getElementById('collection-filter').value.trim();
  var status = document.getElementById('kg-status');
  var results = document.getElementById('kg-results');
  status.textContent = 'Querying knowledge graph…';
  results.innerHTML = '';
  fetch('/document-intelligence/api/kg-explore', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({
      mode: mode,
      label: label || null,
      query: query || null,
      collection_id: collection || null,
      entity_type: entityType || null,
      limit: 100
    })
  }).then(function(r) { return r.json(); })
    .then(function(data) {
      if (data.error) { status.textContent = 'Error: ' + data.error; return; }

      if (mode === 'entities') {
        var items = data.entities || [];
        status.textContent = items.length + ' entities found' + (label ? ' matching "' + label + '"' : '');
        if (!items.length) { results.innerHTML = '<p style="color:#5a7aa0;font-size:12px;">No entities found. Upload and ingest a document first.</p>'; return; }
        var byType = {};
        items.forEach(function(e) { (byType[e.entity_type] = byType[e.entity_type] || []).push(e); });
        results.innerHTML = Object.keys(byType).map(function(t) {
          return '<div style="margin-bottom:16px;">' +
            '<div style="color:#9bb8d8;font-size:11px;text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px;">' + t + ' (' + byType[t].length + ')</div>' +
            '<div style="display:flex;flex-wrap:wrap;gap:6px;">' +
            byType[t].map(function(e) {
              return '<span onclick="drillEntity(\'' + escHtml(e.label) + '\')" style="background:#16213e;border:1px solid #1e3a6e;color:#a8c8e0;padding:4px 10px;border-radius:4px;font-size:12px;cursor:pointer;" title="Click to explore relationships">' +
                e.label + '</span>';
            }).join('') + '</div></div>';
        }).join('');

      } else if (mode === 'relations') {
        var rels = data.relationships || [];
        status.textContent = rels.length + ' relationships found for "' + label + '"';
        if (!rels.length) { results.innerHTML = '<p style="color:#5a7aa0;font-size:12px;">No relationships found for that entity.</p>'; return; }
        results.innerHTML = '<div style="background:#0b1726;border:1px solid #1a3560;border-radius:8px;overflow:hidden;">' +
          '<table style="width:100%;border-collapse:collapse;font-size:12px;">' +
          '<thead><tr style="background:#08112a;color:#6090b0;"><th style="padding:7px 12px;text-align:left;">Source</th><th style="padding:7px 12px;text-align:left;">Relationship</th><th style="padding:7px 12px;text-align:left;">Target</th></tr></thead><tbody>' +
          rels.map(function(r) {
            return '<tr style="border-top:1px solid #0d1e30;color:#a8c8e0;">' +
              '<td style="padding:6px 12px;"><span onclick="drillEntity(\'' + escHtml(r.source) + '\')" style="cursor:pointer;color:#7ab3f0;">' + escHtml(r.source) + '</span></td>' +
              '<td style="padding:6px 12px;color:#5a7aa0;font-style:italic;">' + escHtml(r.relationship) + '</td>' +
              '<td style="padding:6px 12px;"><span onclick="drillEntity(\'' + escHtml(r.target) + '\')" style="cursor:pointer;color:#7ab3f0;">' + escHtml(r.target) + '</span></td>' +
              '</tr>';
          }).join('') + '</tbody></table></div>';

      } else if (mode === 'neighbors') {
        var entity = data.entity || {};
        var nb = data.neighbors || [];
        status.textContent = nb.length + ' direct neighbors of "' + (entity.label || label) + '"';
        if (!nb.length) { results.innerHTML = '<p style="color:#5a7aa0;font-size:12px;">No neighbors found.</p>'; return; }
        results.innerHTML = '<div style="margin-bottom:10px;"><span style="background:#1a2e52;color:#7ab3f0;padding:4px 12px;border-radius:4px;font-size:12px;">' + escHtml(entity.label || label) + '</span><span style="color:#5a7aa0;font-size:11px;margin-left:8px;">' + (entity.entity_type || '') + '</span></div>' +
          '<div style="display:flex;flex-wrap:wrap;gap:8px;">' +
          nb.map(function(n) {
            return '<div onclick="drillEntity(\'' + escHtml(n.label) + '\')" style="background:#0d1b2e;border:1px solid #1a3560;border-radius:6px;padding:8px 12px;cursor:pointer;" title="' + escHtml(n.relationship) + '">' +
              '<div style="color:#a8c8e0;font-size:12px;">' + escHtml(n.label) + '</div>' +
              '<div style="color:#5a7aa0;font-size:10px;margin-top:2px;">' + escHtml(n.relationship) + ' · ' + (n.entity_type || '') + '</div>' +
              '</div>';
          }).join('') + '</div>';
      }
    })
    .catch(function() { status.textContent = 'KG query failed.'; });
}

function drillEntity(label) {
  document.getElementById('kg-label').value = label;
  document.getElementById('kg-mode').value = 'neighbors';
  runKG();
}

{% if collection_id %}
document.getElementById('collection-filter').value = '{{ collection_id }}';
{% endif %}
</script>

{% set iqe_canvas = "dic" %}
{% set iqe_api_route = "/document-intelligence/api/iqe-query" %}
{% set iqe_title = "IQE Query — Search" %}
{% set iqe_examples = [
  {"label": "All documents", "query": "foreach d in dic.documents select d.title, d.collection_id"},
  {"label": "Top KG entities", "query": "foreach e in dic.kg_entities select e.label, e.entity_type, e.centrality"},
  {"label": "KG relationships", "query": "foreach r in dic.kg_relationships select r.source, r.relationship, r.target"}
] %}
{% include "includes/iqe_query_widget.html" %}
{% endblock %}