{% import '@PimUI/Default/page_elements.html.twig' as elements %}

{% block head_script %}
    {% if form.permissions is defined %}
    <script type="text/javascript" nonce="{{ js_nonce() }}">
        require(
            ['jquery', 'pimee/manage-permissions'],
            function ($, managePermissions) {
                'use strict';

                $(function () {
                    var options = {
                        elementId: '#{{form.permissions.vars.id}}',
                        changeBlockLabel: '{{ 'Changes'|trans }}',
                        grantMessage: 'pimee_enrich.entity.locale.module.permissions.grant',
                        revokeMessage: 'pimee_enrich.entity.locale.module.permissions.revoke',
                        update: {
                            add: {
                                '{{ form.permissions.edit.vars.id }}': ['{{ form.permissions.view.vars.id }}']
                            },
                            remove: {
                                '{{ form.permissions.view.vars.id }}': ['{{ form.permissions.edit.vars.id }}'],
                            }
                        }
                    };
                    managePermissions(options);
                });
            });
    </script>
    {% endif %}
{% endblock %}

{% block content %}
    <div class="AknDefault-mainContent">
    {{ form_start(form, {
        'action': path('pimee_enrich_locale_edit', { id: form.vars.value.id }),
        'attr': {
            'data-updated-title': 'pim_enrich.entity.fallback.module.edit.leave'|trans,
            'data-updated-message': 'confirmation.discard changes'|trans({ '%entity%': 'locale.title'|trans })
        }
    }) }}

        {% set title = form.vars.value.code %}

        {% set buttons %}
            {{ elements.submitBtn('', 'ok') }}
        {% endset %}

        {{ elements.page_header(
            {
                title: title,
                buttons: buttons,
                state: elements.updated(form.vars.id)
            }
        ) }}

        {% set tabs = ['pim_common.properties'] %}
        {% if form.permissions is defined %}
            {% set tabs = tabs|merge(['pim_common.permissions']) %}
        {% endif %}
        {% if dictionaryEnabled is same as(true) %}
            {% set tabs = ['akeneo_data_quality_insights_dictionary']|merge(tabs) %}
        {% endif %}

        {{ elements.form_navbar(tabs, '') }}

        <div class="AknTabContainer-content tab-content">
            {{ elements.form_errors(form) }}

            {% if dictionaryEnabled is same as(true) %}
                <div class="tab-pane active" id="akeneo_data_quality_insights_dictionary">
                    <div id="dqi-dictionary-container"></div>
                </div>
            {% endif %}
            <div class="tab-pane {{ dictionaryEnabled is same as(false) ? 'active' : '' }}" id="pim_common-properties">
                {% set generalProperties %}
                    {{ form_row(form.code) }}
                {% endset %}
                {{ elements.tabSections({ 'pane.accordion.general_properties': elements.form_container(generalProperties) }) }}
            </div>
            {% if form.permissions is defined %}
            <div class="tab-pane" id="pim_common-permissions">
                {{ elements.tabSections({ '': elements.form_container(form_widget(form.permissions)) }) }}
            </div>
            {% endif %}
        </div>
    {{ form_end(form) }}
    </div>
{% endblock %}

<script nonce="{{ js_nonce() }}">
    window.flashMessages = JSON.parse(`{{ app.session.flashbag.all|json_encode()|raw }}`);
</script>

<script nonce="{{ js_nonce() }}">
    require(
        [
            'pim/common/breadcrumbs',
            'pim/fetcher-registry',
            'pim/form-builder'
        ],
        function(
            Breadcrumbs,
            FetcherRegistry,
            FormBuilder
        ) {
            $(function() {
                var breadcrumbs = new Breadcrumbs({
                    config: {
                        tab: 'pim-menu-settings',
                        item: 'pim-menu-settings-locale'
                    }
                });
                breadcrumbs.configure().then(function () {
                    breadcrumbs.render();
                    $('*[data-drop-zone="breadcrumbs"]').append(breadcrumbs.$el);
                });

                FetcherRegistry.initialize().done(function () {
                    FormBuilder.build('pim-menu-user-navigation').then(function (form) {
                        $('.user-menu').append(form.el);
                        form.render();
                    }.bind(this));
                });

                if(document.getElementById('dqi-dictionary-container') !== null) {
                    FormBuilder
                        .build('akeneo-data-quality-insights-locale-dictionary')
                        .then((form) => {
                            form.setLocaleCode("{{ form.vars.value.code }}").render();
                        });
                }
            });
        }
    );
</script>