{% extends "bitcaster/console/base.html" %}
{% load feature_flags i18n static user %}
{% block extrahead %}
    <link href="{% static "css/console.css" %}" rel="stylesheet" />
{% endblock %}
{% block content %}
    {{ last_seen }}
    <div class="p-4">
        <table id="user_messages">
            <thead>
                <tr>
                    {#                <th>#}
                    {#                    ##}
                    {#                </th>#}
                    <th>
                        Date
                    </th>
                    <th>
                        Subject
                    </th>
                    <th>
                        Event
                    </th>
                </tr>
            </thead>
            <tbody>
                {% for message in messages %}
                    <tr x-data="{}" @click="location.href ='{% url "console:detail" message.instance.pk %}'">
                        {#                    <td>#}
                        {#                        {{ message.check }}#}
                        {#                    </td>#}
                        <td>
                            {% user_datetime message.instance.created %}
                        </td>
                        <td>
                            {{ message.instance.subject }}
                        </td>
                        <td>
                            {{ message.instance.event }}
                        </td>
                        <td>
                            {% if message.instance.created > last_seen %}
                                <span class="badge badge-new">new</span>
                            {% else %}
                                {% if message.instance.read %}
                                    <span class="badge badge-read">read</span>
                                {% else %}
                                    <span class="badge badge-unread">not read</span>
                                {% endif %}
                            {% endif %}
                        </td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
        <div class="pagination m-2">
            <span class="step-links">
                {% if page_obj.has_previous %}
                    <a class="border p-2 rounded" href="?page=1">&laquo; first</a>
                    <a class="border p-2 rounded" href="?page={{ page_obj.previous_page_number }}">previous</a>
                {% else %}
                    <a class="border p-2 rounded cursor-not-allowed bg-gray-400 text-gray-500" href="#">&laquo; first</a>
                    <a class="border p-2 rounded cursor-not-allowed  bg-gray-400 text-gray-500" href="#">previous</a>
                {% endif %}
                <span class="current mx-4">
                    Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}
                </span>
                {% if page_obj.has_next %}
                    <a class="border p-2 rounded" href="?page={{ page_obj.next_page_number }}">next</a>
                    <a class="border p-2 rounded" href="?page={{ page_obj.paginator.num_pages }}">last &raquo;</a>
                {% else %}
                    <a class="border p-2 rounded cursor-not-allowed bg-gray-400 text-gray-500" href="#">next</a>
                    <a class="border p-2 rounded cursor-not-allowed  bg-gray-400 text-gray-500" href="#">last &raquo;</a>
                {% endif %}
            </span>
        </div>
    </div>
{% endblock %}