{% extends "base.html" %}
{% block content %}
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem;">
    <h2 style="margin: 0;">{{ resource.plural_name }}</h2>
    {% if resource.can_create %}
    <a href="{{ resource.path_new }}" class="btn btn-primary">+ New {{ resource.name }}</a>
    {% endif %}
</div>

<form method="GET" style="display: flex; gap: 1rem; margin-bottom: 1.5rem;">
    <input type="text" name="search" value="{{ query.search | default(value='') }}" placeholder="Search..." class="form-control" style="max-width: 300px;">
    <button type="submit" class="btn btn-primary">Search</button>
</form>

<table>
    <thead>
        <tr>
            {% for col in columns %}
            <th>
                <a href="{{ resource.path_list }}?sort_by={{ col.key }}" style="color: inherit; text-decoration: none; display: block;">
                    {{ col.label }}
                    {% if query.sort_by | default(value='') == col.key %}
                        {% if query.sort_dir | default(value='asc') == 'asc' %}▲{% else %}▼{% endif %}
                    {% endif %}
                </a>
            </th>
            {% endfor %}
            {% if resource.can_delete %}
            <th>Actions</th>
            {% endif %}
        </tr>
    </thead>
    <tbody>
        {% for row in rows %}
        <tr>
            {% for col in columns %}
            <td>
                {% if col.column_type == 'Boolean' %}
                    {% if row[col.key] %}Yes{% else %}No{% endif %}
                {% else %}
                    {{ row[col.key] }}
                {% endif %}
            </td>
            {% endfor %}
            {% if resource.can_delete %}
            <td>
                <a href="{{ resource.path_edit }}{{ row.id }}" class="btn" style="border: 1px solid var(--border);">Edit</a>
                <form action="{{ resource.path_delete }}{{ row.id }}" method="POST" style="display: inline;" onsubmit="return confirm('Are you sure?');">
                    <button type="submit" class="btn btn-danger">Delete</button>
                </form>
            </td>
            {% endif %}
        </tr>
        {% else %}
        {% set col_count = columns | length %}
        <tr>
            <td colspan="{% if resource.can_delete %}{{ col_count + 1 }}{% else %}{{ col_count }}{% endif %}" style="text-align: center; padding: 3rem; color: var(--text-light);">
                No records found.
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>

<div class="pagination">
    {% if total_pages > 1 %}
        {% if page > 1 %}
        <a href="{{ resource.path_list }}?page={{ page - 1 }}" class="btn">&laquo; Prev</a>
        {% endif %}
        
        <span style="margin: 0 1rem;">Page {{ page }} of {{ total_pages }}</span>
        
        {% if page < total_pages %}
        <a href="{{ resource.path_list }}?page={{ page + 1 }}" class="btn">Next &raquo;</a>
        {% endif %}
    {% endif %}
</div>
{% endblock %}