IBX-8508: Fixed translation_domain working incorrectly for dropdowns

[Steveb-p]

🎫 Issue	IBX-8508

For QA:

We will need to check label translations in other parts of admin UI. Some parts might no longer be translated, since they would be using old translation_domain option (instead of choice_translation_domain, as they should).

Description:

Relevant excerpt from discussion that was happening in a different, closed source PR:

The reason placeholder option is not run through translation is that we are overwriting choice_widget behavior in vendor/ibexa/admin-ui/src/bundle/Resources/views/themes/admin/ui/form_fields/dropdown_widget.html.twig.

What should normally happen in choice_widget_collapsed (which is the block that is usually responsible for rendering <select> element for ChoiceType) is that placeholder option should be run through translation (marked as diff so you can see the relevant part):

{%- block choice_widget_collapsed -%}
    {%- if required and placeholder is none and not placeholder_in_choices and not multiple and (attr.size is not defined or attr.size <= 1) -%}
        {% set required = false %}
    {%- endif -%}
    <select {{ block('widget_attributes') }}{% if multiple %} multiple="multiple"{% endif %}>
+        {%- if placeholder is not none -%}
+            <option value=""{% if required and value is empty %} selected="selected"{% endif %}>{{ placeholder != '' ? (translation_domain is same as(false) ? placeholder : placeholder|trans({}, translation_domain)) }}</option>
+        {%- endif -%}   
        {%- if preferred_choices|length > 0 -%}
            {% set options = preferred_choices %}
            {% set render_preferred_choices = true %}
            {{- block('choice_widget_options') -}}
            {%- if choices|length > 0 and separator is not none -%}
                <option disabled="disabled">{{ separator }}</option>
            {%- endif -%}
        {%- endif -%}
        {%- set options = choices -%}
        {%- set render_preferred_choices = false -%}
        {{- block('choice_widget_options') -}}
    </select>
{%- endblock choice_widget_collapsed -%}

However, it does not happen for our template. placeholder is still passed onto the subtemplate, but translation domain uses choice_translation_domain option. This effectively disables translation in this case.

{%- block choice_widget -%}
    {% if expanded %}
        {{- block('choice_widget_expanded') -}}
    {% else %}
        {% set attr = attr|default({})|merge({
            'class': (attr.class|default('') ~ ' ibexa-input ibexa-input--select')|trim,
        }) %}
        {% set source %}
            {{- block('choice_widget_collapsed') -}}
        {% endset %}

        {% include '@ibexadesign/ui/component/dropdown/dropdown.html.twig' with {
            source: source,
            choices: choices,
            preferred_choices: preferred_choices,
            value: form.vars.value,
            multiple: form.vars.multiple,
            custom_init: attr.dropdown_custom_init|default(false),
            class: attr.dropdown_class|default(''),
+            translation_domain: choice_translation_domain|default(false),
            custom_form: false,
            is_disabled: attr.disabled|default(false) or disabled|default(false) or dropdown_disabled|default(false),
            is_hidden: attr.dropdown_hidden|default(false),
            is_small: attr.is_small|default(false),
            is_ghost: attr.is_ghost|default(false),
            is_selector: attr.is_selector|default(false),
            is_dynamic: attr.is_dynamic|default(false),
            has_select_all_toggler: attr.has_select_all_toggler|default(false),
+            placeholder: attr.placeholder|default(placeholder),
            selected_item_template_path: selected_item_template_path|default(null),
            list_item_template_path: list_item_template_path|default(null),
            items_class: items_class|default(null),
            items_list_header: items_list_header|default(null),
        } only %}
    {% endif %}
{%- endblock choice_widget -%}

In theory placeholder and all possible options should have different translation domains (placeholder should use translation_domain, choices should use choice_translation_domain - you don't want to translate options oftentimes), but we are not respecting this setup.

You can see it when adding {{ dump(placeholder, translation_domain) }} to vendor/ibexa/admin-ui/src/bundle/Resources/views/themes/admin/ui/component/dropdown/dropdown.html.twig:

The moment I set choice_translation_domain option it changes:

but note that because of this, all choices are run through translation (which they shouldn't!) because placeholder and choices share translation domain setting.

With this approach and properly set translation_domain and choice_translation_domain:

        $builder->add('country', CountryType::class, [
            'required' => $builder->getRequired(),
            'label' => /** @Desc("Country") */ 'ibexa.address.country',
            'placeholder' => /** @Desc("Name") */ 'ibexa.address.name',
            'translation_domain' => 'ibexa_fieldtype_address',
        ]);

Documentation:

[mikadamczyk]

@Steveb-p is there any Jira issue related to this PR?

[Steveb-p]

After internal sync we decided to push this change onto 5.0 series to prevent breaks.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud