{% extends "base.html" %}

{% block content %}
<div class="filters-bar">
    <form method="get" action="/analytics/agents" class="filter-form">
        <select name="group_by">
            <option value="class" {% if group_by == 'class' %}selected{% endif %}>Group by Class</option>
            <option value="instance" {% if group_by == 'instance' %}selected{% endif %}>Group by Instance</option>
        </select>
        <button type="submit" class="btn btn-primary">Apply</button>
    </form>
</div>

<section class="card">
    <div class="card-header">
        <h3>Agent Usage (by {{ group_by }})</h3>
    </div>
    {% if agents %}
    <table class="data-table">
        <thead>
            <tr>
                {% if group_by == 'instance' %}
                <th>Agent Name</th>
                <th>Class</th>
                {% else %}
                <th>Agent Class</th>
                {% endif %}
                <th>Requests</th>
                <th>Input Tokens</th>
                <th>Output Tokens</th>
                <th>Cached Tokens</th>
                <th>Total Tokens</th>
                <th>Total Cost</th>
                <th>Avg Latency</th>
                <th>Avg Iterations</th>
            </tr>
        </thead>
        <tbody>
            {% for a in agents %}
            <tr>
                {% if group_by == 'instance' %}
                <td><strong>{{ a.component_name }}</strong></td>
                <td>{{ a.component_class }}</td>
                {% else %}
                <td><strong>{{ a.component_class }}</strong></td>
                {% endif %}
                <td>{{ a.request_count }}</td>
                <td>{{ "{:,}".format(a.total_input_tokens | default(0) | int) }}</td>
                <td>{{ "{:,}".format(a.total_output_tokens | default(0) | int) }}</td>
                <td>{{ "{:,}".format(a.total_cached_tokens | default(0) | int) }}</td>
                <td>{{ "{:,}".format(a.total_tokens | default(0) | int) }}</td>
                <td>${{ "%.4f" | format(a.total_cost | default(0) | float) }}</td>
                <td>{{ "%.0f" | format(a.avg_duration_ms | default(0) | float) }}ms</td>
                <td>{{ "%.1f" | format(a.avg_iterations | default(0) | float) }}</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
    {% else %}
    <p>No agent usage data available yet.</p>
    {% endif %}
</section>
{% endblock %}
