IBX-6262: Reworked ibexa/automated-translation package (#7)

ibexa · Jan 8, 2024 · d8da853 · d8da853
1 parent 20822ab
commit d8da853
Show file tree

Hide file tree

Showing 15 changed files with 112 additions and 160 deletions.
diff --git a/composer.json b/composer.json
@@ -11,6 +11,11 @@
     "homepage": "https://github.com/ibexa/automated-translation",
     "type": "ibexa-bundle",
     "authors": [
+        {
+            "name": "Ibexa AS",
+            "homepage": "https://ibexa.co",
+            "email": "[email protected]"
+        },
         {
             "name": "Novactive",
             "homepage": "http://www.novactive.us",

diff --git a/src/bundle/DependencyInjection/IbexaAutomatedTranslationExtension.php b/src/bundle/DependencyInjection/IbexaAutomatedTranslationExtension.php
@@ -13,10 +13,11 @@
 use Ibexa\Contracts\AutomatedTranslation\Encoder\Field\FieldEncoderInterface;
 use Symfony\Component\Config\FileLocator;
 use Symfony\Component\DependencyInjection\ContainerBuilder;
+use Symfony\Component\DependencyInjection\Extension\PrependExtensionInterface;
 use Symfony\Component\DependencyInjection\Loader;
 use Symfony\Component\HttpKernel\DependencyInjection\Extension;
 
-class IbexaAutomatedTranslationExtension extends Extension
+class IbexaAutomatedTranslationExtension extends Extension implements PrependExtensionInterface
 {
     /**
      * {@inheritdoc}
@@ -71,6 +72,27 @@ private function hasConfiguredClients(array $config, ContainerBuilder $container
             });
         }));
     }
+
+    public function prepend(ContainerBuilder $container): void
+    {
+        $this->prependJMSTranslation($container);
+    }
+
+    private function prependJMSTranslation(ContainerBuilder $container): void
+    {
+        $container->prependExtensionConfig('jms_translation', [
+            'configs' => [
+                'ibexa_automated_translation' => [
+                    'dirs' => [
+                        __DIR__ . '/../../',
+                    ],
+                    'excluded_dirs' => ['Behat'],
+                    'output_dir' => __DIR__ . '/../Resources/translations/',
+                    'output_format' => 'xliff',
+                ],
+            ],
+        ]);
+    }
 }
 
 class_alias(IbexaAutomatedTranslationExtension::class, 'EzSystems\EzPlatformAutomatedTranslationBundle\DependencyInjection\EzPlatformAutomatedTranslationExtension');
diff --git a/src/bundle/Form/Extension/LanguageCreateType.php b/src/bundle/Form/Extension/LanguageCreateType.php
@@ -9,6 +9,7 @@
 namespace Ibexa\Bundle\AutomatedTranslation\Form\Extension;
 
 use Ibexa\AdminUi\Form\Type\Language\LanguageCreateType as BaseLanguageCreateType;
+use JMS\TranslationBundle\Annotation\Desc;
 use Symfony\Component\Form\AbstractTypeExtension;
 use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
 use Symfony\Component\Form\FormBuilderInterface;
@@ -38,10 +39,10 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
             'languageCode',
             ChoiceType::class,
             [
-                'label' => /* @Desc("Language code") */
-                    'ibexa.language.create.language_code',
+                'label' => /* @Desc("Language code") */ 'ibexa.language.create.language_code',
                 'required' => false,
                 'choices' => array_combine($this->localeList, $this->localeList),
+                'translation_domain' => 'ibexa_automated_translation',
             ]
         );
     }

diff --git a/src/bundle/Form/Extension/TranslationAddType.php b/src/bundle/Form/Extension/TranslationAddType.php
@@ -61,6 +61,7 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
                         'value' => $client->getServiceAlias(),
                         'data' => true,
                         'required' => false,
+                        'disabled' => true,
                     ]
                 );
             $builder->addModelTransformer(new TranslationAddDataTransformer());
@@ -92,6 +93,7 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
 
                         return '';
                     },
+                    'disabled' => true,
                 ]
             );
         $builder->addModelTransformer(new TranslationAddDataTransformer());

diff --git a/src/bundle/Resources/config/admin_ui.yaml b/src/bundle/Resources/config/admin_ui.yaml
@@ -1,8 +1,14 @@
 services:
-    ibexa.automated_translation.adminui.component.javascripts:
+    ibexa.automated_translation.component.javascripts:
          parent: Ibexa\AdminUi\Component\TwigComponent
-         public: false
          arguments:
-             $template: '@@IbexaAutomatedTranslation/adminui/javascripts.html.twig'
+             $template: '@@ibexadesign/automated_translation/javascripts.html.twig'
          tags:
              - { name: ibexa.admin_ui.component, group: 'script-body' }
+
+    ibexa.automated_translation.component.add_translation_body:
+        parent: Ibexa\AdminUi\Component\TwigComponent
+        arguments:
+            $template: '@@ibexadesign/automated_translation/form_fields.html.twig'
+        tags:
+            - { name: ibexa.admin_ui.component, group: 'form-content-add-translation-body' }
diff --git a/src/bundle/Resources/public/admin/css/ibexa-automated-translation.scss b/src/bundle/Resources/public/admin/css/ibexa-automated-translation.scss
@@ -1,15 +1,3 @@
-.ibexa-automated-translation {
-    .modal-body {
-        display: flex;
-        flex-direction: column;
-        padding-bottom: 8.75rem;
-
-        .modal-body-base {
-            display: flex;
-        }
-
-        .ibexa-automated-translation-services-container {
-            padding-top: 15pt;
-        }
-    }
+.ibexa-automated-translation-services-container {
+    padding-top: 15pt;
 }
diff --git a/src/bundle/Resources/public/admin/js/ibexa-automated-translation.js b/src/bundle/Resources/public/admin/js/ibexa-automated-translation.js
@@ -1,57 +1,17 @@
-jQuery(function () {
-    let $ = jQuery;
-    let $form = $("form[name=add-translation]", "#add-translation-modal");
-    let $container = $(".ibexa-automated-translation-services-container:first", $form);
-    let $error = $(".ibexa-automated-translation-error", $container);
-
-    $form.click(function () {
-        $error.addClass("invisible");
-    });
-
-    $container.find(".ibexa-field-edit--ezboolean .ibexa-data-source__label").click(function () {
-        let $input = $(this).find("input[type='checkbox']");
-        let isChecked = $input.attr('checked') === 'checked';
-
-        if (isChecked) {
-            $input.removeAttr('checked');
-            $(this).removeClass('is-checked');
-        } else {
-            $(this).addClass('is-checked');
-            $input.attr('checked', 'checked');
-        }
-        return false;
-    });
-
-    $container.find(".ibexa-data-source__label.is-checked").each(() => {
-        $form.find('.ibexa-btn--create-translation').prop("disabled", false);
-    });
-
-    $container.find(".ibexa-dropdown__source select option:selected").each(() => {
-        $form.find('.ibexa-btn--create-translation').prop("disabled", false);
-    });
-
-    $("form[name=add-translation]").submit(function () {
-        let targetLang = $("select[name=add-translation\\[language\\]]").val();
-        let sourceLang = $("select[name=add-translation\\[base_language\\]]").val();
-        let mapping = $container.data('languages-mapping');
-        let $serviceSelector = $("#add-translation_translatorAlias");
-        let serviceAlias = $serviceSelector.val();
-        if ($serviceSelector.is("[type=checkbox]") && !$serviceSelector.is(":checked")) {
-            serviceAlias = '';
-        }
-
-        if (!serviceAlias.length) {
-            return true;
-        }
-
-        let translationAvailable = (typeof sourceLang === 'undefined' || -1 !== $.inArray(sourceLang, mapping[serviceAlias])) && (-1 !== $.inArray(targetLang, mapping[serviceAlias]));
-        if (false === translationAvailable) {
-            $error.removeClass("invisible");
-            if ($container.find(".ibexa-field-edit--ezboolean .ibexa-data-source__label").hasClass('is-checked')) {
-                $container.find(".ibexa-field-edit--ezboolean .ibexa-data-source__label").click();
-                return false;
+((doc) => {
+    const TRANSLATOR_SELECT_SELECTOR = '#add-translation_translatorAlias';
+    const BASE_LANGUAGE_SELECT_SELECTOR = '#add-translation_base_language';
+
+    const translatorSelect = doc.querySelector(TRANSLATOR_SELECT_SELECTOR);
+    const baseLanguageSelect = doc.querySelector(BASE_LANGUAGE_SELECT_SELECTOR);
+    if (baseLanguageSelect && translatorSelect) {
+        baseLanguageSelect.addEventListener('change', () => {
+            translatorSelect.disabled = !baseLanguageSelect.value;
+
+            const translationSelectWrapper = translatorSelect.closest('.ibexa-dropdown');
+            if (translationSelectWrapper) {
+                translationSelectWrapper.classList.toggle('ibexa-dropdown--disabled', !baseLanguageSelect.value);
             }
-        }
-        return true;
-    });
-});
+        });
+    }
+}) (document);
diff --git a/src/bundle/Resources/translations/forms.en.yml b/src/bundle/Resources/translations/forms.en.yml
diff --git a/src/bundle/Resources/translations/ibexa_automated_translation.en.xliff b/src/bundle/Resources/translations/ibexa_automated_translation.en.xliff
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<xliff xmlns="urn:oasis:names:tc:xliff:document:1.2" xmlns:jms="urn:jms:translation" version="1.2">
+  <file source-language="en" target-language="en" datatype="plaintext" original="not.available">
+    <header>
+      <tool tool-id="JMSTranslationBundle" tool-name="JMSTranslationBundle" tool-version="1.1.0-DEV"/>
+      <note>The source node in most cases contains the sample message as written by the developer. If it looks like a dot-delimitted string such as "form.label.firstname", then the developer has not provided a default message.</note>
+    </header>
+    <body>
+      <trans-unit id="6cd2ce682c3546de9a86ff3390701d81e46a99e2" resname="ibexa.language.create.language_code">
+        <source>Language code</source>
+        <target state="new">Language code</target>
+        <note>key: ibexa.language.create.language_code</note>
+      </trans-unit>
+      <trans-unit id="e7de62309ac728e1694040c140243cf918c33e60" resname="tab.translations.remote.translation.service">
+        <source>Use automatic translation</source>
+        <target state="new">Use automatic translation</target>
+        <note>key: tab.translations.remote.translation.service</note>
+      </trans-unit>
+      <trans-unit id="9c26b8f27857a53af3b30f1c0b0963d344fe2996" resname="tab.translations.remote.translation.service.with">
+        <source>Use automatic translation with %alias%</source>
+        <target state="new">Use automatic translation with %alias%</target>
+        <note>key: tab.translations.remote.translation.service.with</note>
+      </trans-unit>
+    </body>
+  </file>
+</xliff>
diff --git a/src/bundle/Resources/translations/messages.en.yml b/src/bundle/Resources/translations/messages.en.yml
diff --git a/src/bundle/Resources/views/themes/admin/automated_translation/form_fields.html.twig b/src/bundle/Resources/views/themes/admin/automated_translation/form_fields.html.twig
@@ -0,0 +1,18 @@
+{% trans_default_domain 'ibexa_automated_translation' %}
+
+{% if form.vars.autotranslated_data is defined %}
+    <div class="ibexa-automated-translation-services-container">
+        {% if form.translatorAlias.vars.choices is defined %}
+            {# that is a select - then multiple providers #}
+            <label class="ibexa-label form-label">
+                {{ 'tab.translations.remote.translation.service'|trans()|desc('Use automatic translation') }}
+            </label>
+            {{ form_widget(form.translatorAlias) }}
+        {% else %}
+            {# that is a checkbox - then one provider #}
+            {{ form_widget(form.translatorAlias, {
+                label: 'tab.translations.remote.translation.service.with'|trans({"%alias%": form.translatorAlias.vars.label })|desc('Use automatic translation with %alias%'),
+            }) }}
+        {% endif %}
+    </div>
+{% endif %}
diff --git a/...urces/views/adminui/javascripts.html.twig → ...tomated_translation/javascripts.html.twig b/...urces/views/adminui/javascripts.html.twig → ...tomated_translation/javascripts.html.twig
@@ -1,2 +1,2 @@
-{{ encore_entry_script_tags('ibexa-automated-translation-js', null, 'ibexa') }}
 {{ encore_entry_link_tags('ibexa-automated-translation-css', null, 'ibexa') }}
+{{ encore_entry_script_tags('ibexa-automated-translation-js', null, 'ibexa') }}
diff --git a/src/bundle/Resources/views/themes/admin/content/modal/add_translation.html.twig b/src/bundle/Resources/views/themes/admin/content/modal/add_translation.html.twig
diff --git a/src/bundle/Resources/views/themes/admin/content/remote_translate_form_fields.html.twig b/src/bundle/Resources/views/themes/admin/content/remote_translate_form_fields.html.twig
diff --git a/tests/lib/Encoder/Field/PageBuilderFieldEncoderTest.php b/tests/lib/Encoder/Field/PageBuilderFieldEncoderTest.php
@@ -8,9 +8,9 @@
 
 namespace Ibexa\Tests\AutomatedTranslation\Encoder\Field;
 
-use Ibexa\Contracts\Core\Repository\Values\Content\Field;
 use Ibexa\AutomatedTranslation\Encoder\BlockAttribute\BlockAttributeEncoderManager;
 use Ibexa\AutomatedTranslation\Encoder\Field\PageBuilderFieldEncoder;
+use Ibexa\Contracts\Core\Repository\Values\Content\Field;
 use Ibexa\Contracts\FieldTypePage\FieldType\LandingPage\Model\Attribute;
 use Ibexa\Contracts\FieldTypePage\FieldType\LandingPage\Model\BlockValue;
 use Ibexa\Contracts\FieldTypePage\FieldType\LandingPage\Model\Page;
@@ -29,11 +29,12 @@ final class PageBuilderFieldEncoderTest extends TestCase
 
     private BlockDefinitionFactory $blockDefinitionFactoryMock;
 
-    public function setUp(): void {
+    public function setUp(): void
+    {
         $this->blockAttributeEncoderManagerMock = $this->createMock(BlockAttributeEncoderManager::class);
         $this->blockDefinitionFactoryMock = $this->createMock(BlockDefinitionFactory::class);
     }
-    
+
     public function testEncode(): void
     {
         $this->blockDefinitionFactoryMock
@@ -56,7 +57,7 @@ public function testEncode(): void
 
         self::assertEquals($this->getEncodeResult(), $result);
     }
-    
+
     public function testCanEncode(): void
     {
         $field = $this->getLandingPageField();
@@ -67,7 +68,7 @@ public function testCanEncode(): void
 
         self::assertTrue($subject->canEncode($field));
     }
-    
+
     public function testDecode(): void
     {
         $this->blockAttributeEncoderManagerMock
@@ -90,7 +91,7 @@ public function testDecode(): void
         self::assertInstanceOf(Value::class, $result);
         self::assertEquals(new Value($this->getPage()), $result);
     }
-    
+
     public function testCanDecode(): void
     {
         $field = $this->getLandingPageField();