{% from "_macros.html" import media_pill, cover_url, availability_pill %}
{% from "_partials/empty_state.html" import empty_state %}
{% set works = page.works if page else [] %}
{% set avail = page.availability if page else {} %}
{% if not works %}
  {% if q %}
    {{ empty_state('No results for "' ~ q ~ '"', "Try a broader search or a different field.") }}
  {% else %}
    {{ empty_state("No works in catalog yet", "Add items to start building your collection.", cta_href="/ui/items/new", cta_label="Add a work") }}
  {% endif %}
{% else %}
  {% if page %}
  <p><small>{{ page.total }} result{{ 's' if page.total != 1 else '' }}{% if page.total > page.page_size %} — page {{ page.page }} of {{ ((page.total - 1) // page.page_size) + 1 }}{% endif %}</small></p>
  {% endif %}
<ul class="work-list">
  {% for work in works %}
  <li>
    <a class="work-card-link" href="/ui/catalog/{{ work.id }}">
      <div class="cover-thumb{% if not work.cover_image_url %} cover-thumb-empty{% endif %}"
           {% if not work.cover_image_url %}data-media-type="{{ work.media_type.code if work.media_type else 'book' }}"{% endif %}
           aria-hidden="true">
        {% if work.cover_image_url %}
        <img src="{{ cover_url(work.cover_image_url, work.updated_at) }}" alt="" loading="lazy">
        {% endif %}
      </div>
      <div class="work-entry">
        <div class="work-entry-title">{{ work.title }}</div>
        {% if work.creators %}
        <div class="work-entry-creators">
          {% for wc in work.creators %}{{ wc.creator.display_name }}{% if not loop.last %}, {% endif %}{% endfor %}
        </div>
        {% endif %}
        {% if work.publisher or work.publication_year %}
        <div class="work-entry-meta">
          {% if work.publisher %}{{ work.publisher }}{% endif %}
          {% if work.publisher and work.publication_year %} · {% endif %}
          {% if work.publication_year %}{{ work.publication_year }}{% endif %}
        </div>
        {% endif %}
        <div class="work-entry-pills">
          {{ availability_pill(avail.get(work.id, '')) }}
          {{ media_pill(work.media_type) }}
        </div>
      </div>
      <span class="work-card-punch" aria-hidden="true"></span>
    </a>
  </li>
  {% endfor %}
</ul>
{% if page and (page.has_prev or page.has_next) %}
<nav class="pagination">
  {% if page.has_prev %}<a href="?{{ filters_qs }}&page={{ page.page - 1 }}" role="button" class="outline">&larr; Prev</a>{% endif %}
  {% if page.has_next %}<a href="?{{ filters_qs }}&page={{ page.page + 1 }}" role="button" class="outline">Next &rarr;</a>{% endif %}
</nav>
{% endif %}
{% endif %}