<nav class="navbar navbar-shadow navbar-expand-lg navbar-light bg-light px-2 mb-2">
    {% if (navbar.label_url == nil) then %}
    <span class="me-1 text-nowrap" style="font-size: 1.1rem;" id="navbar_title">{* navbar.title *}</span><span
        class="text-muted ms-1 d-none d-lg-inline d-md-none">|</span>
    {% else %}
    <a class="navbar-brand" href="{* (navbar.label_url and navbar.label_url or '#') *}">
        <small>{* navbar.title *}</small>
    </a>
    {% end %}
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
        aria-controls="navbarNav" aria-expanded="false">
        <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse scroll-x" id="navbarNav">
        <ul class="navbar-nav">
            {% for _, item in ipairs(navbar.items_table) do %}

            {% if (not item.hidden) then %}

            {% if (item.active) then %}

            <li class="nav-item nav-link active">
                {% if tonumber(item.badge_num) and tonumber(item.badge_num) > 0 then %}
                <span class="badge rounded-pill bg-dark" style="float:right;margin-bottom:-10px;">{{ item.badge_num
                    }}</span>
                {% end %}
                <b>{* item.label *}</b>
            </li>
            {% else %}

            {%
            local url
            local c
           
            if (not isEmptyString(item.url)) then
              url = item.url
            else
              url = navbar.base_url 

              if(string.find(url , "%?")) then
                c = "&"
              else
                c = "?"
              end

              url = navbar.base_url  .. c .. "page=" .. item.page_name
            end
            %}

            <a href="{{ url }}" class="nav-item nav-link" {% if item.tooltip then %} title="{* item.tooltip *}" {% end %}>
                {% if tonumber(item.badge_num) and tonumber(item.badge_num) > 0 then %}
                <span class="badge rounded-pill bg-dark" style="float:right;margin-bottom:-10px;">{{ item.badge_num
                    }}</span>
                {% end %}
                {* item.label *}
            </a>

            {% end %}

            {% end %}

            {% end %}

        </ul>

        <ul class="navbar-nav ms-auto">

            {% for _, item in ipairs(navbar.end_items or {}) do %}

            {% if (not item.hidden) then %}

            {% if (item.active) then %}

            <li class="nav-item nav-link active">
                {% if tonumber(item.badge_num) and tonumber(item.badge_num) > 0 then %}
                <span class="badge rounded-pill bg-dark" style="float:right;margin-bottom:-10px;">{{ item.badge_num
                    }}</span>
                {% end %}
                <b>{* item.label *}</b>
            </li>
            {% else %}

            {%
            local url
            if (not isEmptyString(item.url)) then
            url = item.url
            else
            url = navbar.base_url .. "&page=" .. item.page_name
            end
            %}

            <a href="{{ url }}" class="nav-item nav-link">
                {% if tonumber(item.badge_num) and tonumber(item.badge_num) > 0 then %}
                <span class="badge rounded-pill bg-dark" style="float:right;margin-bottom:-10px;">{{ item.badge_num
                    }}</span>
                {% end %}
                {* item.label *}
            </a>

            {% end %}

            {% end %}

            {% end %}
            {% if (navbar.back_url ~= nil) then %}
            <a href="{{ navbar.back_url }}" class="nav-item nav-link text-muted">
                {% else %}
                <a href="javascript:history.back()" class="nav-item nav-link text-muted">
                    {% end %}
                    <i class="fas fa-arrow-left"></i>
                </a>
                {% if (navbar.help_link ~= nil) then %}
                <a target='_newtab' href='{* navbar.help_link *}' class='nav-item nav-link text-muted'>
                    <i class='fas fa-question-circle'></i>
                </a>

                {% end %}
        </ul>
    </div>
</nav>

<script>
    NtopUtils.reloadBSTooltips();
</script>
