{%if system.portal %}

<div class="icon active">
    <div align="center"  class="button" onclick="window.open('{{system.parentContext}}/','_self')" style="display:grid; grid-template-columns:auto auto; gap:4px; align-items:center ">
        <i class="fa-solid fa-chevron-left" style="color:darkgray; display:block"></i>
        <img src="{{system.caller.icon}}" style="height:100%"/>
    </div>
</div>
{% else %}
    <div class="icon">
        <i class="fa-solid fa-home"></i>
    </div>
{% endif %}
{% for _name in layout.menu %}
    <div class="item">
            <div>
                <i class="{{layout.icons[_name]}}"></i>
                {{_name.replace('-', ' ').replace('_',' ')}}
            </div>
        {%if layout.menu[_name] %}
        <div class="sub-menu border-round border">
            
           {% for _item in layout.menu[_name] %}
               
                {%if _item.type == 'open' %}
                    <div class="active" onclick="window.open('{{_item.uri}}','_self')">
   
                {%elif _item.uri and _item.type not in ['dialog','embed'] %}
                    <div class="active" onclick="menu.apply('{{_item.uri}}','{{_item.text}}','{{_name}}','{{system.context}}')">
                {% else %}
                    <!-- working on links/widgets -->
                    <div class="active" onclick='menu.apply_link({{_item|tojson}},"{{system.context}}")'>
                {% endif %}
                <i class="fa-solid fa-chevron-right" style="margin-right:4px"></i>
                    {{_item.text.replace('-',' ').replace('_',' ')}}
                
            </div>
           {%endfor%}

        </div>
        {%endif%}
    </div>
{%endfor%}