{% extends "admin_base.html" %}
{% block page_title %}Platform Performance{% endblock %}
{% block admin_content %}
<main id="performance-admin" data-plugin="core-performance" class="mx-auto w-full max-w-screen-2xl space-y-6">
  <header class="flex flex-col gap-4 rounded-2xl border border-divider bg-surface p-5 shadow-sm sm:flex-row sm:items-end sm:justify-between sm:p-6">
    <div class="space-y-1">
      <h1 class="flex items-center gap-3 text-xl font-semibold text-foreground"><i class="fas fa-gauge-high text-brand" aria-hidden="true"></i>Tenant resource budgets</h1>
      <p class="text-sm text-muted">Per-tenant WASM, request and scheduled-job limits for shared-host fairness.</p>
    </div>
    <button id="perf-retry" type="button" class="blocks-button blocks-button-secondary min-h-11">Refresh budgets</button>
  </header>

  <div data-perf-notice class="blocks-workspace-notice" role="status" aria-live="polite" tabindex="-1" hidden></div>

  <section class="grid grid-cols-1 gap-5 xl:grid-cols-2" aria-label="Performance activity">
    <article class="min-w-0 rounded-2xl border border-divider bg-surface p-5 shadow-sm">
      <h2 class="text-base font-semibold text-foreground">Top tenants by requests</h2>
      <p class="mt-1 text-sm text-muted">Requests observed in the last five minutes.</p>
      <ol class="mt-4 divide-y divide-divider">
        {% if perf_top_tenants is defined and perf_top_tenants | length > 0 %}
        {% for tenant in perf_top_tenants %}
        <li class="flex flex-wrap items-center justify-between gap-2 py-3 text-sm">
          <span class="min-w-0 break-all font-medium text-foreground">{{ tenant.tenant_name }}</span>
          <span class="shrink-0 text-muted">{{ tenant.requests }} requests · {{ tenant.soft }} soft / {{ tenant.hard }} hard limits</span>
        </li>
        {% endfor %}
        {% elif perf_top_tenants is defined %}
        <li class="py-4 text-sm text-muted">No request samples are available yet.</li>
        {% else %}
        <li class="py-4 text-sm text-muted">Request activity is unavailable.</li>
        {% endif %}
      </ol>
    </article>

    <article class="min-w-0 rounded-2xl border border-divider bg-surface p-5 shadow-sm">
      <h2 class="text-base font-semibold text-foreground">Recent resource violations</h2>
      <ul class="mt-4 divide-y divide-divider">
        {% if perf_violations is defined and perf_violations | length > 0 %}
        {% for violation in perf_violations %}
        <li class="space-y-1 py-3 text-sm">
          <p class="break-words font-medium text-foreground">{{ violation.message | default(value=violation.limit_kind) }}</p>
          <p class="text-xs text-muted">{{ violation.tenant_name }} · {{ violation.severity }} · {{ violation.created_at | date_in_tz(timezone=settings.timezone) }}</p>
        </li>
        {% endfor %}
        {% elif perf_violations is defined %}
        <li class="py-4 text-sm text-muted">No recent violations.</li>
        {% else %}
        <li class="py-4 text-sm text-muted">Violation activity is unavailable.</li>
        {% endif %}
      </ul>
    </article>
  </section>

  <section class="min-w-0 space-y-3 rounded-2xl border border-divider bg-surface p-4 shadow-sm sm:p-5" aria-labelledby="perf-budgets-title">
    <div>
      <h2 id="perf-budgets-title" class="text-base font-semibold text-foreground">Tenant limits</h2>
      <p class="mt-1 text-sm text-muted">Limits apply independently to each tenant.</p>
    </div>
    <div class="overflow-x-auto">
      <table class="blocks-admin-table responsive-table w-full" id="perf-budgets-table">
        <caption class="sr-only">Per-tenant resource budget values and save actions</caption>
        <thead>
          <tr>
            <th scope="col">Tenant</th>
            <th scope="col">Tier</th>
            <th scope="col">WASM concurrent</th>
            <th scope="col">Requests / second</th>
            <th scope="col">Cron in-flight</th>
            <th scope="col">Actions</th>
          </tr>
        </thead>
        <tbody id="perf-budgets-body">
          <tr><td colspan="6" role="status" class="px-4 py-6 text-center text-sm text-muted">Loading tenant budgets…</td></tr>
        </tbody>
      </table>
    </div>
  </section>
</main>
{% endblock %}