{% extends "base.html" %}
{% from "_partials/cards.html" import doc_card, menu_hits %}
{# Document (menu "docs") and Code (menu "code") share this page. #}
{% set menu = menu | default("docs") %}
{% set page = {
  "docs": {"label": "Document", "path": "/ui/docs", "kicker": "Catalog", "noun": "documents",
           "empty": "Ingest and publish a document to see it here."},
  "tickets": {"label": "Ticket", "path": "/ui/tickets", "kicker": "Business analysis", "noun": "documents",
           "empty": "A BA repo publishes its missions and tickets with kb publish."},
  "code": {"label": "Code", "path": "/ui/code", "kicker": "Code", "noun": "documents",
           "empty": "A Dev repo publishes its code documents with kb publish."}
}[menu] %}
{% block main %}
<div class="stack-md">
  <div class="page-head">
    <p class="kicker accent">{{ page.kicker }}</p>
    <h1>{{ page.label }}</h1>
  </div>
  <form class="filter-bar menu-search" method="get" action="{{ page.path }}">
    <input type="search" name="q" value="{{ menu_q }}"
           placeholder="Search in {{ page.label }}…"
           aria-label="Search in {{ page.label }}"
           {% if not menu_q %}data-filter-list="[data-doc-card]"{% endif %}>
    {% for t in shell.tags if t.on %}
    <a class="chip on" href="{{ t.href }}">{{ t.label }} <span class="x">✕</span></a>
    {% endfor %}
    {% if not menu_q %}<span class="shown" data-filter-count data-total="{{ total_docs }}"
          data-noun="{{ page.noun }}">{{ docs | length }} of {{ total_docs }} {{ page.noun }}</span>{% endif %}
    <noscript><button type="submit" class="seg">Search</button></noscript>
  </form>
  {% if menu_q %}
  {{ menu_hits(menu_q, menu_results, page.label, page.path) }}
  {% else %}
  <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>{{ page.empty }}</p>
      {% endif %}
    </div>
    {% endfor %}
  </div>
  {% endif %}
</div>
{% endblock %}