Issues with menu module

Hello I have tried to change the menu twig file to create a custom one for my menu. However, I am having the issue where only 2 items are being displayed in the menu, while the others are being dispayed separately like the image below:

https://i.stack.imgur.com/o2EEM.png

Here is my twig file that I created:

<div id="show_treeview" style="display: none">
  <button class="btn_show" title="Ouvrir le menu"><i class="fas fa-arrow-right"></i></button>
</div>

<div id="treeview">
  <div id="control_tree">
    <table width=100%>
      <tbody>
        <tr valign="middle">
          <td id="treeview_hide">
            <button class="btn_hide" title="Cacher le menu"><span class="fas fa-arrow-left"></span></button>
          </td>
          <td align="right" valign="middle">
            <div id="treecontrol">
              <div class="tree_close_opt">
                <button class="btn1"><span class="fas fa-minus-square"></span></button>
                <span class="closetreeview">Fermer tout</span>
              </div>
              <div class="tree_open_opt">
                <button class="btn2"><span class="fas fa-plus-square"></span></button>
                <span class="opentreeview">Ouvrir tout</span>
              </div>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>

  {% macro menu_links(items, attributes, menu_level) %}
    {% import _self as menus %}
    {% for item in items %}
      {% if item.below %}
        <li class="parent-element--expanded"><i class="far fa-plus-square parent-toggle" ></i>
      {% else %}
        <ul class="menu block-contentmenu__submenu collapsed-submenu"><li class="child-element">
      {% endif %}
        {{ link(item.title, item.url) }}
        {% if item.below %}
          {{ menus.menu_links(item.below, menu_level + 1) }}
        {% endif %}
      </li>
    </ul>
    {% endfor %}
  {% endmacro %}

  {% import _self as menus %}
  <div id="treeview_menu">
    <ul class="menu hierarchical-content-menu block-contentmenu__menu">
      <span class="level-0">
        <span class="far fa-folder-open fa-md"><a id ="treeview_level0" href="{{ url('<front>') }}">{{ 'Les instruments de recherche'|t }}</a></span>
      </span>
      {{ menus.menu_links(items, attributes, 0) }}
    </ul>
  </div>
</div>

Any help would be most welcome. I have been trying to correct this for days without success.