{% extends "admin/change_list.html" %}
{% load i18n admin_urls static admin_list %}

{% block object-tools-items %}
    <li>
        <a href="import-voting-records/" class="addlink">Import Voting Records</a>
    </li>
    {{ block.super }}
{% endblock %}

{% block search %}
    {{ block.super }}
    <div class="tenant-filter-container" style="margin: 10px 0; padding: 15px; background: var(--darkened-bg, #f8f9fa); border: 1px solid var(--border-color, #dee2e6); border-radius: 4px; display: flex; align-items: center; color: var(--body-fg, #333);">
        <label for="tenant-filter-select" style="font-weight: 600; margin-right: 15px; color: var(--body-fg, #333);">Filter by Tenant:</label>
        <select id="tenant-filter-select" onchange="filterTenant(this.value)" style="padding: 6px 12px; border-radius: 4px; border: 1px solid var(--border-color, #ced4da); background-color: var(--body-bg, #fff); color: var(--body-fg, #333); min-width: 200px;">
            <option value="" style="background-color: var(--body-bg); color: var(--body-fg);">-- All Tenants --</option>
            {% for tenant in tenants %}
                <option value="{{ tenant.id }}" {% if request.GET.voter__tenant__id__exact == tenant.id|stringformat:"s" %}selected{% endif %} style="background-color: var(--body-bg); color: var(--body-fg);">
                    {{ tenant.name }}
                </option>
            {% endfor %}
        </select>
    </div>

    <script>
        function filterTenant(tenantId) {
            const url = new URL(window.location.href);
            if (tenantId) {
                url.searchParams.set('voter__tenant__id__exact', tenantId);
            } else {
                url.searchParams.delete('voter__tenant__id__exact');
            }
            // Reset to page 1 if filtering
            url.searchParams.delete('p');
            window.location.href = url.pathname + url.search;
        }
    </script>
{% endblock %}