{# T48 evals index page -- lists scans with at least one llm_evals row. #}
{% extends "admin_layout.html" %}

{% block page_title %}Evals{% endblock %}

{% block breadcrumb %}
  <span class="text-gray-500">Admin</span>
  <span class="px-1.5 text-gray-300">/</span>
  <span class="text-gray-900 font-medium">Evals</span>
{% endblock %}

{% block content %}
<div class="space-y-4">

  <section class="bg-white border border-gray-200 rounded-lg shadow-sm p-4">
    <div class="flex flex-wrap items-center gap-3 justify-between">
      <div>
        <h2 class="text-sm font-semibold text-gray-900 uppercase tracking-wide">Evals</h2>
        <p class="text-xs text-gray-500 mt-0.5">Side-by-side multi-model comparisons on production scans.</p>
      </div>
      <div class="flex items-center gap-2">
        <span class="text-xs text-gray-500">Today: ${{ '%.4f'|format(today_usd or 0.0) }} / ${{ '%.2f'|format(cap_usd or 0.0) }}</span>
        <button type="button"
                data-action="open-eval-modal"
                class="inline-flex items-center px-3 py-1.5 text-sm font-medium bg-blue-600 text-white rounded hover:bg-blue-700">
          Start new eval
        </button>
        <a href="/admin/scans"
           class="inline-flex items-center px-3 py-1.5 text-sm font-medium bg-white text-gray-700 border border-gray-300 rounded hover:bg-gray-50">
          Browse scans &rarr;
        </a>
      </div>
    </div>
  </section>

  <section class="bg-white border border-gray-200 rounded-lg shadow-sm overflow-hidden">
    {% if not rows %}
      <div class="px-6 py-10 text-sm text-gray-400 italic text-center">
        No evals recorded yet. Open a scan from <a href="/admin/scans" class="text-blue-600 hover:underline">/admin/scans</a> and click "Evals" on its debug page, or jump straight to <code>/admin/evals/&lt;scan_id&gt;</code> to start a fresh batch.
      </div>
    {% else %}
      <div class="overflow-x-auto">
        <table class="min-w-full divide-y divide-gray-200 text-sm">
          <thead class="bg-gray-50">
            <tr>
              <th class="text-left font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Scan</th>
              <th class="text-left font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Target</th>
              <th class="text-left font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Owner</th>
              <th class="text-right font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Evals</th>
              <th class="text-right font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Total cost</th>
              <th class="text-left font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Last eval</th>
              <th class="text-right font-medium text-gray-500 uppercase tracking-wide text-xs py-2 px-4">Action</th>
            </tr>
          </thead>
          <tbody class="divide-y divide-gray-100">
            {% for row in rows %}
              <tr class="even:bg-gray-50 hover:bg-blue-50">
                <td class="py-2 px-4 font-mono text-xs text-gray-700">{{ row.scan_id_short }}</td>
                <td class="py-2 px-4 text-gray-700 max-w-[20em] truncate">{{ row.target_url }}</td>
                <td class="py-2 px-4 text-gray-700 max-w-[14em] truncate">{{ row.owner_email or '(anonymous)' }}</td>
                <td class="py-2 px-4 text-right text-gray-900 tabular-nums">{{ row.eval_count }}</td>
                <td class="py-2 px-4 text-right text-gray-900 tabular-nums">${{ '%.4f'|format(row.total_cost) }}</td>
                <td class="py-2 px-4 text-xs text-gray-500 whitespace-nowrap">{{ row.last_eval_at }}</td>
                <td class="py-2 px-4 text-right">
                  <a href="/admin/evals/{{ row.scan_id }}" class="text-sm text-blue-600 hover:text-blue-800 font-medium">View matrix</a>
                </td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    {% endif %}
  </section>

  {# T48.1: shared modal for "Start new eval". select-scan mode -- the #}
  {# index page doesn't pin a scan id, so the picker is visible.        #}
  {% with mode='select-scan' %}
    {% include 'partials/eval_new_modal.html' %}
  {% endwith %}

</div>
{% endblock %}