{% load i18n wagtailadmin_tags %}
{% load l10n %}

<table class="listing">
    <thead>
        <tr>
            <th>
                {% trans 'Status' %}
            </th>
            <th>
                {% trans 'Tasks' %}
            </th>
            <th>
                {% trans 'Requested by' %}
            </th>
            <th>
                {% trans 'Started at' %}
            </th>
        </tr>
    </thead>
    <tbody>
        {% if workflow_states %}
            {% page_permissions page as page_perms %}
            {% for workflow_state in workflow_states %}
                <tr>
                    <td>
                        <a href="{% url 'wagtailadmin_pages:workflow_history_detail' page.id workflow_state.id %}" class="status-tag primary">
                            {{ workflow_state.get_status_display }}
                        </a>
                    </td>
                    <td>
                        <h2>{{ workflow_name }}</h2>
                        {% trans 'Approved task' as approved_title %}
                        {% trans 'Incomplete task' as incomplete_title %}
                        {% for task in workflow_state.all_tasks_with_status %}
                            <span data-wagtail-tooltip="{{ task.name }}: {{ task.status_display }}">
                                {% if task.status == 'approved' %}
                                    {% icon "success" title=approved_title class_name="initial" %}
                                {% else %}
                                    {% icon "radio-empty" title=incomplete_title class_name="initial" %}
                                {% endif %}
                            </span>
                        {% endfor %}
                    </td>
                    <td>{{ workflow_state.requested_by|user_display_name }}</td>
                    <td>
                        <div class="human-readable-date" title="{{ workflow_state.created_at|date:"d M Y H:i" }}">
                            {% blocktrans with time_period=workflow_state.created_at|timesince %}{{ time_period }} ago{% endblocktrans %}
                        </div>
                    </td>
                </tr>
            {% endfor %}
        {% else %}
            {% block no_results %}<tr><td class="no-results-message"><p>{% trans "This page hasn't been submitted for moderation yet" %}</p></td></tr>{% endblock %}
        {% endif %}
    </tbody>
</table>
