{% extends "base.html" %}
{% load static %}
{% block title %}
    Channels
{% endblock title %}
{% block content %}
    <h1>Channels</h1>
    <p>Browse all channels that can participate in drop campaigns</p>
    <form method="get" action="{% url 'twitch:channel_list' %}">
        <input type="text"
               name="search"
               value="{{ search_query }}"
               placeholder="Search channels..." />
        <button type="submit">Search</button>
        {% if search_query %}
            <a href="{% url 'twitch:channel_list' %}">Clear</a>
        {% endif %}
    </form>
    {% if channels %}
        <table>
            <thead>
                <tr>
                    <th>Channel</th>
                    <th>Username</th>
                    <th>Campaigns</th>
                </tr>
            </thead>
            <tbody>
                {% for channel in channels %}
                    <tr>
                        <td>
                            <a href="{% url 'twitch:channel_detail' channel.twitch_id %}">{{ channel.display_name }}</a>
                        </td>
                        <td>{{ channel.name }}</td>
                        <td>{{ channel.campaign_count|default:0 }}</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
        <!-- Pagination -->
        {% if is_paginated %}
            <div>
                <p>
                    {% if page_obj.has_previous %}
                        <a href="?{% if search_query %}search={{ search_query }}&{% endif %}page=1">[first]</a>
                        <a href="?{% if search_query %}search={{ search_query }}&{% endif %}page={{ page_obj.previous_page_number }}">[previous]</a>
                    {% endif %}
                    Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}
                    {% if page_obj.has_next %}
                        <a href="?{% if search_query %}search={{ search_query }}&{% endif %}page={{ page_obj.next_page_number }}">[next]</a>
                        <a href="?{% if search_query %}search={{ search_query }}&{% endif %}page={{ page_obj.paginator.num_pages }}">[last]</a>
                    {% endif %}
                </p>
                <p>Showing {{ page_obj.start_index }} to {{ page_obj.end_index }} of {{ page_obj.paginator.count }} channels</p>
            </div>
        {% endif %}
    {% else %}
        {% if search_query %}
            <p>No channels match your search query "{{ search_query }}".</p>
        {% else %}
            <p>No channels found.</p>
        {% endif %}
    {% endif %}
{% endblock content %}