{% extends "base.html" %}
{% block title %}Review — Libris{% endblock %}
{% block content %}
<div class="max-w-5xl">
  <div class="flex items-center gap-4 mb-5">
    <h1 class="text-xl font-bold">Review Queue</h1>
    {% if records %}
    <span class="bg-gray-100 text-gray-600 text-xs font-semibold px-2.5 py-0.5 rounded-full">{{ records|length }}</span>
    {% endif %}
  </div>

  {% if error %}
  <div class="alert alert-red">{{ error }}</div>
  {% endif %}

  {% if stale_count %}
  <div class="alert alert-amber">
    ⚠ {{ stale_count }} stale record(s) point to missing files and are not shown.
    Run <code class="bg-amber-100 px-1 rounded">libris review-discard --stale</code> to clean them up.
  </div>
  {% endif %}

  {% if not records and not error %}
  <div class="bg-white rounded-lg border border-gray-200 p-12 text-center text-gray-400">
    <div class="text-3xl mb-2">✅</div>
    <div class="font-medium">Review queue is empty</div>
    <div class="text-sm mt-1">All files have been imported or discarded.</div>
  </div>
  {% else %}

  <div class="bg-white rounded-lg border border-gray-200 overflow-hidden">
    <table class="queue w-full">
      <thead>
        <tr>
          <th class="w-8">#</th>
          <th>File</th>
          <th>Match</th>
          <th>Type</th>
          <th>Score</th>
          <th>Age</th>
          <th>Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for r in records %}
        <tr id="row-{{ r.id }}"
            class="{{ 'bg-amber-50' if r._is_dup else '' }}"
            hx-swap="outerHTML swap:200ms">
          <td class="text-xs text-gray-400 text-center">{{ loop.index }}</td>
          <td class="max-w-xs">
            <div class="text-xs font-mono text-gray-600 truncate" title="{{ r.current_path }}">
              {{ r.current_path.split('/')[-1] }}
            </div>
            {% if r._is_dup %}
            <div class="text-xs text-amber-700 mt-0.5 truncate" title="{{ r.error_msg }}">⚠ {{ r.error_msg }}</div>
            {% endif %}
          </td>
          <td class="max-w-xs">
            {% if r.matched_title %}
            <div class="text-sm font-medium truncate">{{ r.matched_title }}</div>
            {% if r.matched_author %}
            <div class="text-xs text-gray-500 truncate">
              {{ r.matched_author }}{% if r.matched_year %} · {{ r.matched_year }}{% endif %}
            </div>
            {% endif %}
            {% else %}
            <span class="text-xs text-red-500">No match found</span>
            {% endif %}
          </td>
          <td>
            {% if r.media_type == 'audiobook' %}
            <span class="tag tag-audio">audio</span>
            {% elif r._is_dup %}
            <span class="tag tag-dup">dup</span>
            {% else %}
            <span class="tag tag-ebook">ebook</span>
            {% endif %}
          </td>
          <td>
            {% if r.confidence is not none %}
            <div class="flex items-center gap-1.5">
              <span class="conf-bar"><span class="conf-fill {{ 'conf-hi' if r.confidence >= 0.8 else 'conf-md' if r.confidence >= 0.6 else 'conf-lo' }}" style="width:{{ (r.confidence * 100)|int }}%"></span></span>
              <span class="text-xs tabular-nums">{{ "%.2f"|format(r.confidence) }}</span>
            </div>
            {% else %}
            <span class="text-xs text-gray-400">—</span>
            {% endif %}
          </td>
          <td class="text-xs text-gray-400 whitespace-nowrap">{{ r._age }}</td>
          <td>
            <div class="flex items-center gap-1">
              {% if r._has_match %}
              <button type="button" class="btn btn-green btn-sm"
                      hx-post="/api/review/{{ r.id }}/accept"
                      hx-target="#row-{{ r.id }}"
                      hx-swap="outerHTML swap:200ms"
                      title="Force-import using cached metadata">
                Accept
              </button>
              {% else %}
              <button type="button" class="btn btn-ghost btn-sm" disabled
                      title="No metadata match yet — run: libris rematch --id {{ loop.index }}"
                      style="opacity:0.4;cursor:not-allowed">
                Accept
              </button>
              {% endif %}
              <button type="button" class="btn btn-danger btn-sm"
                      hx-post="/api/review/{{ r.id }}/discard"
                      hx-target="#row-{{ r.id }}"
                      hx-swap="outerHTML swap:200ms"
                      hx-confirm="Delete '{{ r.current_path.split('/')[-1] }}' from disk?">
                Discard
              </button>
            </div>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  <div class="mt-4 p-3 bg-gray-50 rounded-lg border border-gray-200 text-xs text-gray-500">
    <span class="font-semibold">Tip:</span>
    Accept imports using cached metadata (no API call). A greyed-out Accept means no match found yet —
    rematch via CLI: <code class="bg-gray-100 px-1 rounded">libris rematch --id N</code>.
    Discard permanently deletes the file.
  </div>

  {% endif %}
</div>
{% endblock %}