<h3>
    <span class="fas fa-language"></span>
    {% trans %}Translation UI{% endtrans %}
    {{ pageSetVar('title', 'Translation UI'|trans) }}
</h3>
{{ pageAddAsset('stylesheet', asset('bundles/translation/css/webui.css')) }}

<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container">
        <ul class="navbar-nav mr-auto">
            <li class="nav-item"><span class="navbar-text">{% trans %}Configs:{% endtrans %}</span></li>
            <li class="nav-item{% if configName == 'zikula' %} active{% endif %}">
                <a class="nav-link" href="{{ path('translation_index', {configName: 'zikula'}) }}">
                    {% trans %}Zikula Core{% endtrans %}
                </a>
            </li>
            <li class="nav-item dropdown">
                <a class="nav-link{% if configName ends with 'module' %} active{% endif %} dropdown-toggle" href="#" id="modulesDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {% trans %}Modules{% endtrans %}
                </a>
                <div class="dropdown-menu" aria-labelledby="modulesDropdown">
                    {% for c in configNames|filter(c => c ends with 'module')|sort %}
                        <a href="{{ path('translation_index', {configName: c}) }}" class="dropdown-item{% if configName == c %} active{% endif %}">
                            {{ c }}
                        </a>
                    {% endfor %}
                </div>
            </li>
            <li class="nav-item dropdown">
                <a class="nav-link{% if configName ends with 'theme' %} active{% endif %} dropdown-toggle" href="#" id="themesDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {% trans %}Themes{% endtrans %}
                </a>
                <div class="dropdown-menu" aria-labelledby="themesDropdown">
                    {% for c in configNames|filter(c => c ends with 'theme')|sort %}
                        <a href="{{ path('translation_index', {configName: c}) }}" class="dropdown-item{% if configName == c %} active{% endif %}">
                            {{ c }}
                        </a>
                    {% endfor %}
                </div>
            </li>
        </ul>
    </div>
</nav>

{% block _translation_bundle_body %}{% endblock %}

{% block _translation_bundle_js %}
    {{ pageAddAsset('javascript', asset('bundles/translation/js/webui.js')) }}
{% endblock %}
