{% load group_filter %}

<div class="nano">
    <div class="nano-content">
        <nav id="menu" class="nav-main" role="navigation">
            <ul class="nav nav-main">
                {% if request.path == '/accueil/' %}
                    <li class="nav-active">
                {% else %}
                    <li>
                {% endif %}
                        <a href="/accueil" id="menu-dashboard">
                            <i class="fa fa-home" aria-hidden="true"></i>
                            <span>Accueil</span>
                        </a>
                    </li>
                {% if user.is_authenticated %}
                    {% if request.path == '/reseau/' %}
                        <li class="nav-active">
                    {% else %}
                        <li>
                    {% endif %}
                            <a href="/reseau" id="menu-water-network">
                                <span class="pull-right label label-primary hidden">Notification</span>
                                <i class="fa fa-tint" aria-hidden="true"></i>
                                <span>Réseau</span>
                            </a>
                        </li>
                    {% if request.path == '/reseau/gis' %}
                        <li class="nav-active">
                    {% else %}
                        <li>
                    {% endif %}
                            <a href="/reseau/gis" id="menu-map">
                                <span class="pull-right label label-primary hidden">Notification</span>
                                <i class="fas fa-map-marked-alt" aria-hidden="true"></i>
                                <span>Carte</span>
                            </a>
                        </li>
                    {% if user|has_group:"Gestionnaire de zone" %}
                        {% if request.path == '/gestion/' %}
                            <li class="nav-active">
                        {% else %}
                            <li>
                        {% endif %}
                                <a href="/gestion/" id="menu-zone-management">
                                    <span class="pull-right label label-primary hidden">Notification</span>
                                    <i class="fa fa-wrench" aria-hidden="true"></i>
                                    <span>Gestion de zone</span>
                                </a>
                            </li>
                            {% if request.path == '/historique/' %}
                                <li class="nav-active">
                            {% else %}
                                <li>
                            {% endif %}
                                    <a href="/historique/" id="menu-logs">
                                        <span class="pull-right label label-primary hidden">Notification</span>
                                        <i class="fas fa-history" aria-hidden="true"></i>
                                        <span>Historique</span>
                                    </a>
                                </li>
                    {% endif %}
                    {% if request.path == '/rapport/' %}
                        <li class="nav-active">
                    {% else %}
                        <li>
                    {% endif %}
                            <a href="/rapport/" id="menu-report">
                                <span class="pull-right label label-primary hidden">Notification</span>
                                <i class="fas fa-sticky-note" aria-hidden="true"></i>
                                <span>Rapports</span>
                            </a>
                        </li>
                    {% if request.path == '/consommateurs/' %}
                        <li class="nav-active">
                    {% else %}
                        <li>
                    {% endif %}
                            <a href="/consommateurs" id="menu-consumers">
                                <span class="pull-right label label-primary hidden">Notification</span>
                                <i class="fa fa-users" aria-hidden="true"></i>
                                <span>Consommateurs</span>
                            </a>
                        </li>
                    {% if request.path == '/finances/' %}
                        <li class="nav-active">
                    {% else %}
                        <li>
                    {% endif %}
                            <a href="/finances" id="menu-financial">
                                <span class="pull-right label label-primary hidden">Notification</span>
                                <i class="fas fa-coins" aria-hidden="true"></i>
                                <span>Finances</span>
                            </a>
                        </li>
                    <hr class="separator" />
               {% endif %}

                {% if request.path == '/aide/' %}
                    <li class="nav-active">
                {% else %}
                    <li>
                {% endif %}
                        <a href="/aide" id="menu-help">
                            <i class="fa fa-question" aria-hidden="true"></i>
                            <span>Aide</span>
                        </a>
                    </li>
            </ul>
        </nav>
    </div>
</div>