{% extends "base.html" %}

{% block title %}TAPDB Admin - Metrics{% endblock %}

{% block content %}
<h1 style="margin-bottom: 2rem;">Admin Metrics</h1>

<div class="card">
    <h2 class="card-title">DB Metrics (TSV)</h2>
    <div style="display: grid; gap: 0.35rem;">
        <div>enabled: <code>{{ "yes" if metrics_enabled else "no" }}</code></div>
        <div>period start (UTC): <code>{{ period_start_utc }}</code></div>
        <div>file: <code>{{ metrics_file }}</code></div>
        <div>dropped (process): <code>{{ dropped_count }}</code></div>
    </div>
    {% if metrics_message %}
        <div style="margin-top: 0.9rem; color: var(--text-muted);">
            {{ metrics_message }}
        </div>
    {% endif %}
    <form method="get" action="{{ tapdb_url(request, '/admin/metrics') }}" class="filter-bar" style="margin-top: 1rem;">
        <label>
            Tail lines
            <input type="number" name="limit" min="1" max="20000" value="{{ limit }}" />
        </label>
        <button class="btn" type="submit">Refresh</button>
    </form>
</div>

<div class="stats-grid">
    <div class="card stat-card">
        <div class="stat-value">{{ summary.count }}</div>
        <div class="stat-label">Rows Parsed</div>
    </div>
    <div class="card stat-card">
        <div class="stat-value">{{ "%.1f"|format(summary.p50_ms) }}</div>
        <div class="stat-label">p50 ms</div>
    </div>
    <div class="card stat-card">
        <div class="stat-value">{{ "%.1f"|format(summary.p95_ms) }}</div>
        <div class="stat-label">p95 ms</div>
    </div>
    <div class="card stat-card">
        <div class="stat-value">{{ "%.1f"|format(summary.p99_ms) }}</div>
        <div class="stat-label">p99 ms</div>
    </div>
    <div class="card stat-card">
        <div class="stat-value">{{ "%.1f"|format(summary.max_ms) }}</div>
        <div class="stat-label">max ms</div>
    </div>
</div>

<div class="card">
    <h2 class="card-title">Slowest Queries (Top 25)</h2>
    <table>
        <thead>
            <tr>
                <th>ms</th>
                <th>ok</th>
                <th>op</th>
                <th>table</th>
                <th>path</th>
                <th>user</th>
                <th>error</th>
                <th>ts</th>
            </tr>
        </thead>
        <tbody>
        {% for row in summary.slowest %}
            <tr>
                <td>{{ "%.3f"|format(row.duration_ms) }}</td>
                <td>{{ "1" if row.ok else "0" }}</td>
                <td>{{ row.op }}</td>
                <td>{{ row.table_hint }}</td>
                <td>{{ row.method }} {{ row.path }}</td>
                <td>{{ row.username }}</td>
                <td>{{ row.error_type }}</td>
                <td><code>{{ row.ts_utc }}</code></td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
</div>

<div class="card">
    <h2 class="card-title">By Route (p95)</h2>
    <table>
        <thead>
            <tr>
                <th>route</th>
                <th>count</th>
                <th>p95 ms</th>
                <th>max ms</th>
            </tr>
        </thead>
        <tbody>
        {% for row in summary.by_path[:25] %}
            <tr>
                <td>{{ row.path }}</td>
                <td>{{ row.count }}</td>
                <td>{{ "%.3f"|format(row.p95_ms) }}</td>
                <td>{{ "%.3f"|format(row.max_ms) }}</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
</div>

<div class="card">
    <h2 class="card-title">By Table Hint (p95)</h2>
    <table>
        <thead>
            <tr>
                <th>table</th>
                <th>count</th>
                <th>p95 ms</th>
                <th>max ms</th>
            </tr>
        </thead>
        <tbody>
        {% for row in summary.by_table[:25] %}
            <tr>
                <td>{{ row.table_hint }}</td>
                <td>{{ row.count }}</td>
                <td>{{ "%.3f"|format(row.p95_ms) }}</td>
                <td>{{ "%.3f"|format(row.max_ms) }}</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
</div>

{% endblock %}