{% extends "base.html" %}
{% set active_nav = "costs" %}

{% block title %}Costs - Distill{% endblock %}

{% block content %}
<h1>Costs</h1>
<p class="subtitle">Total spend: ${{ "%.2f"|format(total_spend) }}</p>

{% if not entries and not topic_rollups and not source_rollups and not biggest_prompts %}
<section class="card empty-state" aria-labelledby="empty-costs-title">
  <p class="eyebrow">Operator view</p>
  <h2 id="empty-costs-title">No spend recorded yet</h2>
  <p>Cost rows appear after a real or preview run that uses a model route. Local operational evidence stays on disk; Distill does not phone home for product analytics.</p>
  <ol>
    <li>Ledger: <code>library/.distill/cost_log.jsonl</code> (legacy: <code>library/cost_log.jsonl</code>)</li>
    <li>Per-call tokens: <code>library/.distill/telemetry.jsonl</code></li>
    <li>CLI: <code>distill costs</code> or <code>distill --json costs</code></li>
    <li>Budget mode: <code>distill --cost-mode no-metered doctor</code> refuses API-billed routes before calls</li>
  </ol>
  <p class="empty-state-note">If you expected spend here, run <code>distill doctor</code> and confirm the active library path and cost mode.</p>
</section>
{% else %}
<div class="grid-2">
  {% if topic_rollups %}
  <div class="card">
    <h2>By Topic (30d)</h2>
    <table>
      <thead><tr><th>Topic</th><th>Cost</th><th>Runs</th></tr></thead>
      <tbody>
        {% for topic_name, cost, runs in topic_rollups %}
        <tr>
          <td><a href="/topics/{{ topic_name }}">{{ topic_name }}</a></td>
          <td>${{ "%.2f"|format(cost) }}</td>
          <td>{{ runs }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% endif %}

  {% if source_rollups %}
  <div class="card">
    <h2>By Source (30d)</h2>
    <table>
      <thead><tr><th>Source</th><th>Cost</th><th>Runs</th></tr></thead>
      <tbody>
        {% for source, cost, runs in source_rollups %}
        <tr>
          <td>{{ source }}</td>
          <td>${{ "%.2f"|format(cost) }}</td>
          <td>{{ runs }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% endif %}
</div>

{% if biggest_prompts %}
<div class="card" style="margin-top:16px;">
  <h2>Biggest Prompts</h2>
  <table>
    <thead><tr><th>When</th><th>Workload</th><th>Call Type</th><th>Model</th><th>Provider</th><th>Tokens</th><th>Time</th></tr></thead>
    <tbody>
      {% for record in biggest_prompts %}
      <tr>
        <td>{{ record.timestamp|format_timestamp }}</td>
        <td>{{ record.workload_tag or '-' }}</td>
        <td>{{ record.call_type or '-' }}</td>
        <td>{{ record.model or '-' }}</td>
        <td>{{ record.provider or '-' }}</td>
        <td>{{ record.tokens_label }}</td>
        <td>{{ "%.1f"|format(record.elapsed_seconds|float) }}s</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endif %}

<div class="card" style="margin-top:16px;">
  <h2>Recent Runs</h2>
  <table>
    <thead><tr><th>When</th><th>Command</th><th>Topic</th><th>Cost</th><th>Time</th><th>Videos</th></tr></thead>
    <tbody>
      {% for entry in entries %}
      {% set meta = entry.get('metadata', {}) or {} %}
      <tr>
        <td>{{ entry.get('timestamp', '')|format_timestamp }}</td>
        <td>{{ entry.get('command', 'unknown') }}</td>
        <td>{% if meta.get('topic') %}<a href="/topics/{{ meta.topic }}">{{ meta.topic }}</a>{% else %}-{% endif %}</td>
        <td>${{ "%.2f"|format(entry.get('actual_cost', 0)|float) }}</td>
        <td>{{ "%.1f"|format(entry.get('elapsed_seconds', 0)|float) }}s</td>
        <td>{{ meta.get('videos_processed', '-') }}</td>
      </tr>
      {% else %}
      <tr><td colspan="6" style="color:var(--muted)">No runs logged yet</td></tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endif %}
{% endblock %}