{% set widgetId = options.id ~ '_widget' %}
<div class="box box-secondary" id="{{ widgetId }}" data-href="{{ path('tasks_pending_paginated', {'page': 1}) }}" data-reload="kimai.taskUpdate kimai.taskUnassign kimai.taskAssign kimai.pendingTaskDelete kimai.taskCreate">
    <div class="box-header">
        <h3 class="box-title">{{ title|trans }}</h3>

        <div class="box-tools pull-right" data-page="{{ options.page }}">
            {{ pagerfanta(data, 'twitter_bootstrap3_translated', { proximity: 1, css_container_class: 'pagination pagination-sm inline', routeName: 'tasks_pending_paginated' }) }}
        </div>
    </div>
    <div class="box-body">
        <ul class="todo-list ui-sortable">
            {% for entry in data %}
                {% set class = '' %}
                {% set rowClass = '' %}
                {% set tooltip = null %}
                {% if entry.end is not null %}
                    {% set tooltip = entry.end|date_full %}
                    {% set class = ' text-success' %}
                    {% set rowClass = ' success' %}
                    {% if entry.overdue %}
                        {% set class = ' text-danger' %}
                        {% set rowClass = ' danger' %}
                    {% endif %}
                {% endif %}
                {#
                    DOESN'T work with Kimai 1.7
                    <li{% if is_granted('task_edit', entry) %} data-href="{{ path('tasks_edit', {'id': entry.id}) }}" class="open-edit modal-ajax-form"{% endif %}>
                #}
                <li class="{{ rowClass }}">
                    <span class="text{{ class }}"{% if tooltip is not null %} data-toggle="tooltip" data-placement="right" title="{{ tooltip }}"{% endif %}>{{ entry.title }}</span>
                    {% set duration = entry.duration %}
                    {% if duration is not null %}
                        <small class="label label-primary hidden-xs">{{ entry.duration|duration }}</small>
                    {% endif %}
                    <div class="btn-group pull-right">
                        {% if is_granted('task_edit', entry) %}
                            <a href="{{ path('tasks_edit', {'id': entry.id}) }}" class="btn btn-default btn-xs modal-ajax-form"><i class="{{ 'edit'|icon }}"></i></a>
                        {% endif %}
                        {% if is_granted('task_assign', entry) %}
                            <a href="{{ path('assign_task', {'id': entry.id}) }}" class="btn btn-default btn-xs api-link" data-event="kimai.taskUpdate kimai.taskAssign" data-method="PATCH" data-question="{{ 'task.assign'|trans }}" data-msg-error="{{ 'action.update.error'|trans }}" data-msg-success="{{ 'action.update.success'|trans }}"><i class="fas fa-user-check"></i></a>
                        {% endif %}
                        {% if is_granted('task_delete', entry) %}
                            <a href="{{ path('delete_task', {'id': entry.id}) }}" class="btn btn-default btn-xs api-link" data-event="kimai.taskUpdate kimai.taskDelete kimai.pendingTaskDelete kimai.timesheetUpdate kimai.timesheetStop" data-method="DELETE" data-question="confirm.delete" data-msg-error="action.delete.error" data-msg-success="action.delete.success"><i class="{{ 'delete'|icon }}"></i></a>
                        {% endif %}
                    </div>
                </li>
            {% endfor %}
        </ul>
    </div>
    <div class="box-footer clearfix no-border">
        {% if is_granted('task_edit_other') %}
            <a class="btn btn-default btn-create modal-ajax-form pull-right" href="{{ path('tasks_create') }}"><i class="fas fa-plus"></i> {{ 'create'|trans }}</a>
        {% endif %}
    </div>
</div>
{% if not app.request.xmlHttpRequest %}
<script type="text/javascript">
    document.addEventListener('kimai.initialized', function() {
        KimaiPaginatedBoxWidget.create('#{{ widgetId }}');
    });
</script>
{% endif %}