{% extends "base.html" %}
{% from "_partials/cards.html" import doc_card %}
{% block main %}
<div class="stack-md">
  <div class="page-head">
    <p class="kicker accent">Catalog</p>
    <h1>Documents</h1>
  </div>
  <form class="filter-bar" method="get" action="/ui/docs">
    <input type="search" name="filter" value="{{ filter_value }}"
           placeholder="Filter documents by name, id or tag…"
           aria-label="Filter documents" data-filter-list="[data-doc-card]">
    {% for t in shell.tags if t.on %}
    <a class="chip on" href="{{ t.href }}">{{ t.label }} <span class="x">✕</span></a>
    {% endfor %}
    <span class="shown" data-filter-count data-total="{{ total_docs }}"
          data-noun="documents">{{ docs | length }} of {{ total_docs }} documents</span>
    <noscript><button type="submit" class="seg">Apply</button></noscript>
  </form>
  <div class="stack-md" style="gap:10px">
    {% for d in docs %}{{ doc_card(d) }}
    {% else %}
    <div class="empty-state">
      {% if browse_tags %}
      <p>No documents match those tags.</p>
      <p>Check the tag spelling or browse all documents.</p>
      {% else %}
      <p>No documents in the store yet.</p>
      <p>Ingest and publish a document to see it here.</p>
      {% endif %}
    </div>
    {% endfor %}
  </div>
</div>
{% endblock %}