{% set metaFormItemsCount = 0 %}

{%- set formMetas -%}
    {%- for item in ['metaTitle', 'metaDescription'] -%}
        {%- if form[item] is defined -%}
            {%- set metaFormItemsCount = metaFormItemsCount + 1 -%}
            {{- form_row(form[item]) -}}
        {%- endif -%}
    {%- endfor -%}
{%- endset -%}

{%- set formOpenGraph -%}
    {%- for item in ['ogTitle', 'ogDescription', 'ogImage'] -%}
        {%- if form[item] is defined -%}
            {%- set metaFormItemsCount = metaFormItemsCount + 1 -%}
            {{- form_row(form[item]) -}}
        {%- endif -%}
    {%- endfor -%}
{%- endset -%}

{%- set formOthers -%}
    {%- for item in ['name', 'template'] -%}
        {%- if form[item] is defined -%}
            {%- set metaFormItemsCount = metaFormItemsCount + 1 -%}
            {{- form_row(form[item]) -}}
        {%- endif -%}
    {%- endfor -%}
{%- endset -%}

{% set hasMetaForm = (formMetas ~ formOpenGraph ~ formOthers)|length > 0 %}
{% set hasBlockForm = form.children|length > (metaFormItemsCount + 1) %}
{% set activeMetaForm = formMetas|length ? 'metas' : (formOpenGraph|length ? 'openGraph' : 'others') %}

<div class="row">
    {% set nodes = entity.nodes %}

    {% if nodes|length %}
        <div class="col-12">
            {% for node in nodes %}
                <a href="{{ path('admin_site_tree_navigation', {
                    navigation: node.menu.navigation.id,
                    'data-modal': path('admin_site_node_edit', {entity: node.id}),
                }) }}" class="btn btn-sm btn-light mr-1" target="_blank">
                    {{ node.label }} ({{ node.menu.navigation.label }})
                </a>
            {% endfor %}
        </div>
    {% endif %}

    {% if hasBlockForm %}
        <div class="{% if hasMetaForm %}col-md-8{% else %}col-md-12{% endif %} p-2" id="page-main-form">
            {{ form_widget(form, {attr: {class: 'row'}}) }}
        </div>
    {% endif %}

    {% if hasMetaForm %}
        <div class="{% if hasBlockForm %}col-md-4{% else %}col-md-12{% endif %} p-md-3" id="page-metas-form">
            <ul class="nav nav-pills">
                {% if formMetas|length > 0 %}
                    <li class="nav-item mb-1">
                        <a class="nav-link {% if activeMetaForm == 'metas' %}active{% endif %}" data-toggle="tab" href="#form-page-metas">
                            <span class="fa fa-code"></span>
                            <span class="d-none d-md-inline">
                                {{ 'Meta datas'|trans }}
                            </span>
                        </a>
                    </li>
                {% endif %}
                {% if formOpenGraph|length > 0 %}
                    <li class="nav-item mb-1">
                        <a class="nav-link {% if activeMetaForm == 'openGraph' %}active{% endif %}" data-toggle="tab" href="#form-page-og">
                            <span class="fa fa-share"></span>
                            <span class="d-none d-md-inline">
                                {{ 'OpenGraph'|trans }}
                            </span>
                        </a>
                    </li>
                {% endif %}
                {% if formOthers|length > 0 %}
                    <li class="nav-item">
                        <a class="nav-link {% if activeMetaForm == 'others' %}active{% endif %}" data-toggle="tab" href="#form-page-others">
                            <span class="fa fa-cog"></span>
                            <span class="d-none d-md-inline">
                                {{ 'Others'|trans }}
                            </span>
                        </a>
                    </li>
                {% endif %}
            </ul>

            <div class="tab-content">
                {% if formMetas|length > 0 %}
                    <div class="tab-pane {% if activeMetaForm == 'metas' %}show active{% endif %} p-3" id="form-page-metas">
                        {{ formMetas|raw }}
                    </div>
                {% endif %}
                {% if formOpenGraph|length > 0 %}
                    <div class="tab-pane {% if activeMetaForm == 'openGraph' %}show active{% endif %} p-3" id="form-page-og">
                        {{ formOpenGraph|raw }}
                    </div>
                {% endif %}
                {% if formOthers|length > 0 %}
                    <div class="tab-pane {% if activeMetaForm == 'others' %}show active{% endif %} p-3" id="form-page-others">
                        {{ formOthers|raw }}
                    </div>
                {% endif %}
            </div>
        </div>
    {% endif %}
</div>