{% load i18n %}

<li class="nav-item dropdown">
    <a id="nav-timer-menu-link"
       class="nav-link dropdown-toggle"
       href="#"
       data-toggle="dropdown"
       aria-haspopup="true"
       aria-expanded="false"><i class="icon-timer" aria-hidden="true"></i>
        {% trans "Timers" %}
    </a>
    <div class="dropdown-menu" aria-labelledby="nav-timer-menu-link">
        {% if perms.core.add_timer %}
            <div class="dropdown-item">
                <form action="{% url 'core:timer-add-quick' %}" role="form" method="post" class="d-inline">
                    {% csrf_token %}
                    <button class="btn text-left p-0">
                        <i class="icon-timer" aria-hidden="true"></i> {% trans "Quick Start Timer" %}
                    </button>
                </form>
            </div>
            <a class="dropdown-item" href="{% url 'core:timer-add' %}">
                <i class="icon-add" aria-hidden="true"></i> {% trans "Start Timer" %}
            </a>
        {% endif %}
        {% if perms.core.view_timer %}
            <a class="dropdown-item" href="{% url 'core:timer-list' %}">
                <i class="icon-list" aria-hidden="true"></i> {% trans "View Timers" %}
            </a>
        {% endif %}
        {% if timers %}
            <h6 class="dropdown-header">{% trans "Active Timers" %}</h6>
            {% for timer in timers %}
                <a class="dropdown-item" href="{% url 'core:timer-detail' timer.id %}">
                    {{ timer.title_with_child }}
                </a>
            {% empty %}
                <a class="dropdown-item disabled" href="#">{% trans "None" %}</a>
            {% endfor %}
        {% endif %}
    </div>
</li>