{% extends "_base.html" %}
{% set active_page = "rate_limits" %}

{% block title %}Rate Limits — TaskQ Admin{% endblock %}

{% block content %}
<h2 class="text-xl font-semibold tracking-tight mb-4">Rate Limits</h2>

{% if not ratelimit_installed %}
<div class="bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 rounded-lg p-3 text-sm text-yellow-700 dark:text-yellow-300">{{ notice_text }}</div>
{% elif buckets %}
<div class="space-y-3">
    <div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-lg overflow-hidden">
        <div class="overflow-x-auto">
            <table class="w-full text-sm">
                <thead>
                    <tr class="bg-slate-50 dark:bg-slate-800 border-b border-slate-200 dark:border-slate-700">
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Bucket</th>
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Kind</th>
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Backend</th>
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Config</th>
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Status</th>
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Remaining</th>
                        {% if redis_available %}
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Redis State</th>
                        {% endif %}
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">PG State</th>
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Updated</th>
                        {% if allow_reset %}
                        <th class="px-4 py-2.5 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">Actions</th>
                        {% endif %}
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
                {% for b in buckets %}
                    {% set ls = live_states.get(b.bucket_name, {}) %}
                    <tr class="even:bg-slate-50/50 dark:even:bg-slate-800/50 hover:bg-slate-50 dark:hover:bg-slate-800 transition-colors">
                        <td class="px-4 py-2.5 font-medium">{{ b.bucket_name }}</td>
                        <td class="px-4 py-2.5">
                            <span class="px-1.5 py-0.5 rounded text-xs font-mono bg-slate-100 dark:bg-slate-800 text-slate-600 dark:text-slate-400">
                                {{ b.kind.replace("sliding_window_", "sw/") | replace("token_bucket", "tb") }}
                            </span>
                        </td>
                        <td class="px-4 py-2.5 text-xs text-slate-500">{{ b.backend }}</td>
                        <td class="px-4 py-2.5 text-xs text-slate-500 font-mono">{{ b.config_summary }}</td>
                        <td class="px-4 py-2.5">
                            {% if ls.is_exhausted is defined %}
                                {% if ls.is_exhausted %}
                                <span class="px-1.5 py-0.5 rounded text-xs font-medium bg-red-100 dark:bg-red-900/30 text-red-700 dark:text-red-400">exhausted</span>
                                {% elif ls.tokens_remaining is defined and ls.capacity is defined and ls.tokens_remaining < ls.capacity * 0.3 %}
                                <span class="px-1.5 py-0.5 rounded text-xs font-medium bg-yellow-100 dark:bg-yellow-900/30 text-yellow-700 dark:text-yellow-400">low</span>
                                {% else %}
                                <span class="px-1.5 py-0.5 rounded text-xs font-medium bg-green-100 dark:bg-green-900/30 text-green-700 dark:text-green-400">ok</span>
                                {% endif %}
                            {% else %}
                                —
                            {% endif %}
                        </td>
                        <td class="px-4 py-2.5 text-xs text-slate-500 font-mono">
                            {% if ls.remaining is defined and ls.remaining > 0 %}
                                {{ ls.remaining | round(1) }} / {{ ls.limit or "—" }} req
                            {% elif ls.tokens_remaining is defined %}
                                {{ ls.tokens_remaining | round(1) }} / {{ ls.capacity or "—" }} tokens
                            {% else %}
                                —
                            {% endif %}
                            {% if ls.retry_after_seconds is defined and ls.retry_after_seconds > 0 %}
                            <span class="text-red-500">(retry {{ ls.retry_after_seconds | round(1) }}s)</span>
                            {% endif %}
                        </td>
                        {% if redis_available %}
                        <td class="px-4 py-2.5 text-xs text-slate-500 font-mono max-w-[200px] truncate" title="{{ redis_state.get(b.bucket_name, {}) }}">{{ redis_state.get(b.bucket_name, {}) }}</td>
                        {% endif %}
                        <td class="px-4 py-2.5 text-xs text-slate-500">{{ b.pg_state or "—" }}</td>
                        <td class="px-4 py-2.5 text-xs text-slate-500 whitespace-nowrap">{{ b.updated_at or "—" }}</td>
                        {% if allow_reset %}
                        <td class="px-4 py-2.5">
                            <form method="post" action="{{ base_path }}/rate-limits/{{ b.bucket_name }}/reset" class="inline">
                                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                                <button type="submit" class="px-2 py-1 text-xs font-medium bg-red-50 dark:bg-red-900/20 text-red-600 dark:text-red-400 border border-red-200 dark:border-red-800 rounded hover:bg-red-100 dark:hover:bg-red-900/40 transition-colors" onclick="return confirm('Reset rate limit bucket \'{{ b.bucket_name }}\' to full capacity?')">
                                    Reset
                                </button>
                            </form>
                        </td>
                        {% endif %}
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
    {% if redis_configured and not redis_available and redis_state is none and buckets %}
    <div class="bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 rounded-lg p-3 text-sm text-yellow-700 dark:text-yellow-300">Redis state unavailable — showing PostgreSQL data only.</div>
    {% endif %}
    {% if has_memory_buckets %}
    <div class="bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 rounded-lg p-3 text-sm text-yellow-700 dark:text-yellow-300">In-memory rate limits (backend='memory') are per-worker and not queryable from this page.</div>
    {% endif %}
</div>
{% else %}
<div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 rounded-lg p-12 text-center">
    <p class="text-slate-400 text-sm">No rate limit buckets registered.</p>
</div>
{% endif %}
{% endblock %}