{# When we are rendering the top nav bar (wide screens) we use bootstrap dropdowns, #}
{# when we render the sidebar (narrow screens) use collapse instead. #}
{# TODO: If you have a section uncollapsed and then expand the width of your screen, weird shit happens #}
{% if in_header %}
{% set toggle="dropdown" %}
{% set list_class="dropdown-menu" %}
{% else %}
{% set toggle="collapse" %}
{% set list_class="collapse" %}
{% endif %}

<nav class="navbar-nav">
  <ul class="bd-navbar-elements navbar-nav">
    {% if theme_navbar_links %}
      {%- for navlink in theme_navbar_links %}
        {% if navlink[1] is not string %}
          <li class="nav-item dropdown ms-2 has-children">
              <a class="nav-link dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-bs-toggle="{{ toggle }}" data-bs-target="#{{ navlink[0] }}" aria-haspopup="true" aria-expanded="false">{{ navlink[0] }}<b class="caret"></b></a>
              <ul class="{{ list_class }}" id="{{ navlink[0] }}" aria-labelledby="dropdownMenuLink">
              {%- for link in navlink[1] %}
                <li class="nav-item">
                    <a class="nav-link" href="{{ sst_pathto(*link[1:]) }}">{{ link[0] }}</a>
                </li>
              {%- endfor %}
              </ul>
          </li>
        {% else %}
          <li class="nav-item ms-2"><a class="nav-link" role="button" href="{{ sst_pathto(*navlink[1:]) }}">{{ navlink[0] }}</a></li>
        {% endif %}
      {%- endfor %}
    {% endif %}
    {% if theme_external_links %}
      {%- for external_link in theme_external_links %}
          <li class="nav-item ms-2"><a class="nav-link nav-external" role="button" href="{{ external_link['url'] }}">{{ external_link['name'] }}</a></li>
      {%- endfor %}
    {% endif %}
  </ul>
</nav>
