{% import "_globals.html" as globals with context %}
{% set user_queries = api.queries[:config['sidebar-show-queries']] %}
{% if api.sidebar_links %}
    <h3>{{ _('Custom Links') }}</h3>
    <ul class="navigation">
        {% for label, link in api.sidebar_links %}
            <li><a href="{{ link }}" data-remote=true>{{ label }}</a></li>
        {% endfor %}
    </ul>
{% endif %}
    <h3>{{ _('Reports') }}</h3>
{% for title_, menuitems in globals.navigation_bar %}
    {% if title_ %}<h3>{{ title_ }}</h3>{% endif %}
    <ul class="navigation">
    {% for id in menuitems %}
        <li><a{% if id == active_page %} class="selected"{% endif %} data-key="{{ globals.all_pages[id].1 }}" href="{{ url_for('report', report_name=id) }}">{{ globals.all_pages[id].0 }}
            {% if id == "events" and api.upcoming_events %}
                <span class="bubble">{{ api.upcoming_events|length }}</span>
            {% endif %}
        </a>
        {% if id == "query" and user_queries %}
            <ul class="submenu">
            {% for query in user_queries %}
                <li><a{% if query.name == name %} class="selected"{% endif %} href="{{ url_for('query', query_string=query.query_string, name=query.name) }}">{{ query.name|truncate(25, True, ' …') }}</a></li>
            {% endfor %}
            </ul>
        {% endif %}
        {% if id == "editor" %}
            <button id="add-transaction-button" class="add-transaction-button">+</button>
        {% endif %}
        </li>
        {% if id == "editor" and api.errors %}
            <li class="error">
                <a href="{{ url_for('report', report_name='errors') }}">
                {{ _('Errors') }} <span class="bubble">{{ api.errors|length }}</span>
                </a>
            </li>
        {% endif %}
    {% endfor %}
    </ul>
{% endfor %}