Recursive menu rendering in Voog

MobileMenuItem.tpl

<li class="{% if item.selected? %}open{% endif %}">
  {% if item.selected_with_children? %}<div class="mobile-menu-arr"></div>{% endif %}
  {% menulink item selected-class="active" %}
  {% if item.selected_with_children? %}
    <ul>
    {% for item in item.visible_children %}
      {% include "MobileMenuItem" with item %}
    {% endfor %}
    {% if editmode %}{% menuadd parent="item" %}{% endif %}
    </ul>
  {% endif %}
</li>

mobilemenus.tpl

<div id="mobile-menu">
  <div class="mobile-menu-header">
    <a href="#" class="mobile-menu-toggler">
      <span class="line"></span>
      <span class="line line-2"></span>
      <span class="line line-3"></span>
    </a>
    
    {% include "LangmenuSelect" %}
  </div>
  <div class="mobile-menu-inner">
    <ul>
      {% menulink site.root_item wrapper-tag="li" %}
      {% for item in site.visible_menuitems %}
        {% include "MobileMenuItem" with item %}
      {% endfor %}
      {% if editmode %}{% menuadd %}{% endif %}
    </ul>
  </div>
</div>