{% extends "admin/dj_signals_panel/base.html" %}
{% load i18n admin_urls static admin_list dj_signals_panel_tags %}

{% block content %}
<div id="content-main">
    <!-- Statistics Section -->
    <div class="instance-stats">
        <div class="stats-grid">
            <div class="stat-item">
                <div class="stat-label">{% trans "Total Signals" %}</div>
                <div class="stat-value">{{ stats.total_signals }}</div>
            </div>
            <div class="stat-item">
                <div class="stat-label">{% trans "Total Receivers" %}</div>
                <div class="stat-value">{{ stats.total_receivers }}</div>
            </div>
            <div class="stat-item">
                <div class="stat-label">{% trans "No Receivers" %}</div>
                <div class="stat-value">
                    {{ stats.signals_without_receivers }}
                </div>
            </div>
        </div>
    </div>

    <!-- Search and Filter Form -->
    <div class="search-form">
        <form method="get" action="">
            <div class="search-form-row">
                <div class="search-form-fields">
                    <div class="search-field-group">
                        <label for="searchbar">{% trans "Search Signals" %}</label>
                        <input
                            type="text"
                            id="searchbar"
                            name="q"
                            value="{{ search_query }}"
                            placeholder="{% trans 'Search by name, module, or app...' %}"
                            style="width: 300px;"
                        >
                    </div>
                    <div class="search-field-group">
                        <label for="app_filter">{% trans "App" %}</label>
                        <select name="app" id="app_filter">
                            <option value="">{% trans "All" %}</option>
                            {% for app in signal_apps %}
                            <option value="{{ app }}" {% if app_filter == app %}selected{% endif %}>
                                {{ app }}
                            </option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="search-field-group">
                        <label>&nbsp;</label>
                        <input type="submit" value="{% trans 'Search' %}">
                    </div>
                </div>
                <div class="search-help">
                    <p class="help">
                        {% trans "Search across signal names and modules. Filter by app to narrow results." %}
                    </p>
                </div>
            </div>
        </form>

        {% if app_filter %}
        <div class="active-filters">
            <strong>{% trans "Active Filter:" %}</strong>
            {{ app_filter }}
            <a href="?{% if search_query %}q={{ search_query }}{% endif %}" class="filter-remove" title="{% trans 'Remove filter' %}">× {% trans "clear" %}</a>
        </div>
        {% endif %}
    </div>

    <!-- Signals Table -->
    <div class="module">
        {% if search_query or app_filter %}
        <p class="help">
            {% blocktrans count counter=total_displayed %}
                Showing {{ counter }} signal
            {% plural %}
                Showing {{ counter }} signals
            {% endblocktrans %}
        </p>
        {% endif %}

        {% if signals %}
        <table id="result_list">
            <thead>
                <tr>
                    <th scope="col">
                        <div class="text">{% trans "Signal" %}</div>
                    </th>
                    <th scope="col">
                        <div class="text">{% trans "Module" %}</div>
                    </th>
                    <th scope="col">
                        <div class="text">{% trans "App" %}</div>
                    </th>
                    <th scope="col">
                        <div class="text">{% trans "Receivers" %}</div>
                    </th>
                </tr>
            </thead>
            <tbody>
                {% for sig in signals %}
                <tr class="{% cycle 'row1' 'row2' %}">
                    <td>
                        <a href="{% url 'dj_signals_panel:signal_detail' sig.signal_id %}" class="signal-link">
                            <code>{{ sig.name }}</code>
                        </a>
                    </td>
                    <td>
                        <code class="module-path">{{ sig.module }}</code>
                    </td>
                    <td>
                        <a href="?app={{ sig.app_label }}{% if search_query %}&q={{ search_query }}{% endif %}" class="app-filter-link">
                            <span class="{{ sig.app_label|dj_signals_panel_add_badge_class }}">{{ sig.app_label }}</span>
                        </a>
                    </td>
                    <td>
                        <span class="receiver-count">
                            {{ sig.receiver_count }}
                        </span>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
        {% else %}
        <p class="paginator">
            {% if search_query %}
                {% trans "No signals match your search criteria." %}
            {% else %}
                {% trans "No signals found." %}
            {% endif %}
        </p>
        {% endif %}
    </div>
</div>
{% endblock %}