{% extends '@ibexadesign/content/content_view_fields.html.twig' %}

{% block extras %}
    {% set current_language = app.request.get('languageCode') ?: content.prioritizedFieldLanguageCode %}

    {% if languages|length > 1  %}
        <form class="form-inline ibexa-raw-content-title__language-form">
            <label class="ibexa-label">{{ 'tab.view.preview'|trans()|desc('Preview') }}</label>
            {% set choices = languages|map((language) => {
                value: path('ibexa.content.translation.view', {
                    'contentId': location.contentId,
                    'locationId': location.id,
                    'languageCode': language.languageCode
                }),
                label: language.name
            }) %}
            {% set value = '' %}

            {% for language in languages %}
                {% if current_language == language.languageCode %}
                    {% set value = path('ibexa.content.translation.view', {
                        'contentId': location.contentId,
                        'locationId': location.id,
                        'languageCode': language.languageCode
                    }) %}
                {% endif %}
            {% endfor %}

            {% set source %}
                <select class="form-control ibexa-input ibexa-location-language-change">
                    {% for choice in choices %}
                        <option value="{{ choice.value }}"
                            {% if value == choice.value %} selected="selected" {% endif %}
                        >{{ choice.label }}</option>
                    {% endfor %}
                </select>
            {% endset %}

            {% include '@ibexadesign/ui/component/dropdown/dropdown.html.twig' with {
                source: source,
                choices: choices,
                value: value,
                is_small: true,
            } %}
        </form>
    {% endif %}
{% endblock %}