From 332ce66d0fe50636d0b03697dfaa5fcdd76febc6 Mon Sep 17 00:00:00 2001
From: Botis <botis@smile.fr>
Date: Wed, 20 Oct 2021 19:06:51 +0200
Subject: [PATCH]  #ESP-295 [Optimizers] UX update

 * Move "apply products" fieldset on "general" fieldset
 * Move customer segment fieldset at the bottom
 * Reset previews fildsets when the model is changed
---
 .../Adminhtml/Optimizer/RuleCondition.php     |  2 +-
 .../i18n/en_US.csv                            |  1 +
 .../i18n/fr_FR.csv                            |  1 +
 ...le_elasticsuite_catalog_optimizer_form.xml | 60 ++++++++++---------
 .../form/optimizer/fieldset-visibility.js     |  8 +--
 .../form/optimizer/optimizer-preview.js       | 19 +++++-
 6 files changed, 54 insertions(+), 37 deletions(-)

diff --git a/src/module-elasticsuite-catalog-optimizer/Block/Adminhtml/Optimizer/RuleCondition.php b/src/module-elasticsuite-catalog-optimizer/Block/Adminhtml/Optimizer/RuleCondition.php
index 5ab946a56..df21334b9 100644
--- a/src/module-elasticsuite-catalog-optimizer/Block/Adminhtml/Optimizer/RuleCondition.php
+++ b/src/module-elasticsuite-catalog-optimizer/Block/Adminhtml/Optimizer/RuleCondition.php
@@ -103,7 +103,7 @@ private function getForm()
         $ruleConditionField = $form->addField(
             'rule_condition',
             'text',
-            ['name' => 'rule_condition', 'label' => __('Rule conditions'), 'container_id' => 'rule_condition']
+            ['name' => 'rule_condition', 'label' => __('Apply to products'), 'container_id' => 'rule_condition']
         );
 
         $ruleConditionField->setValue($rule);
diff --git a/src/module-elasticsuite-catalog-optimizer/i18n/en_US.csv b/src/module-elasticsuite-catalog-optimizer/i18n/en_US.csv
index b57006803..c9e89061c 100644
--- a/src/module-elasticsuite-catalog-optimizer/i18n/en_US.csv
+++ b/src/module-elasticsuite-catalog-optimizer/i18n/en_US.csv
@@ -76,3 +76,4 @@ Active,Active
 Inactive,Inactive
 Status,Status
 "Using extreme boost values complicates achieving a balance between optimizers.","Using extreme boost values complicates achieving a balance between optimizers."
+"Boost & Bury","Boost & Bury"
diff --git a/src/module-elasticsuite-catalog-optimizer/i18n/fr_FR.csv b/src/module-elasticsuite-catalog-optimizer/i18n/fr_FR.csv
index 702ea05fc..e6fff58f5 100644
--- a/src/module-elasticsuite-catalog-optimizer/i18n/fr_FR.csv
+++ b/src/module-elasticsuite-catalog-optimizer/i18n/fr_FR.csv
@@ -78,3 +78,4 @@ Active,Activé
 Inactive,Désactivé
 Status,Statut
 "Using extreme boost values complicates achieving a balance between optimizers.","L'utilisation de valeurs extrêmes complique l'equilibrage des optimiseurs."
+"Boost & Bury","Booster & Déclasser"
diff --git a/src/module-elasticsuite-catalog-optimizer/view/adminhtml/ui_component/smile_elasticsuite_catalog_optimizer_form.xml b/src/module-elasticsuite-catalog-optimizer/view/adminhtml/ui_component/smile_elasticsuite_catalog_optimizer_form.xml
index 462a7da06..1ec4c29f3 100644
--- a/src/module-elasticsuite-catalog-optimizer/view/adminhtml/ui_component/smile_elasticsuite_catalog_optimizer_form.xml
+++ b/src/module-elasticsuite-catalog-optimizer/view/adminhtml/ui_component/smile_elasticsuite_catalog_optimizer_form.xml
@@ -192,6 +192,23 @@
                 </item>
             </argument>
         </field>
+        <container name="optimizer_rule_container">
+            <argument name="data" xsi:type="array">
+                <item name="config" xsi:type="array">
+                    <item name="sortOrder" xsi:type="number">80</item>
+                </item>
+            </argument>
+            <htmlContent name="rule_condition">
+                <argument name="block" xsi:type="object">Smile\ElasticsuiteCatalogOptimizer\Block\Adminhtml\Optimizer\RuleCondition</argument>
+                <argument name="data" xsi:type="array">
+                    <item name="config" xsi:type="array">
+                        <item name="sortOrder" xsi:type="number">10</item>
+                        <item name="component" xsi:type="string">Smile_ElasticsuiteCatalogRule/js/component/catalog/product/form/rule</item>
+                        <item name="dataScope" xsi:type="string">rule_condition</item>
+                    </item>
+                </argument>
+            </htmlContent>
+        </container>
     </fieldset>
 
     <fieldset name="quick_search_container">
@@ -445,6 +462,7 @@
                         <item name="imports" xsi:type="array">
                             <item name="searchContainers" xsi:type="string">${ $.provider }:data.search_containers</item>
                         </item>
+                        <item name="searchInput" xsi:type="string">query_text_preview</item>
                         <item name="additionalClasses" xsi:type="string">optimizer-preview</item>
                     </item>
                 </argument>
@@ -694,6 +712,7 @@
                         <item name="imports" xsi:type="array">
                             <item name="searchContainers" xsi:type="string">${ $.provider }:data.search_containers</item>
                         </item>
+                        <item name="searchInput" xsi:type="string">category_preview</item>
                         <item name="additionalClasses" xsi:type="string">optimizer-preview</item>
                     </item>
                 </argument>
@@ -705,9 +724,15 @@
     <fieldset name="constant_score">
         <argument name="data" xsi:type="array">
             <item name="config" xsi:type="array">
-                <item name="label" xsi:type="string" translate="true">Configuration</item>
+                <item name="label" xsi:type="string" translate="true"><![CDATA[Boost & Bury]]></item>
                 <item name="sortOrder" xsi:type="number">80</item>
                 <item name="component" xsi:type="string">Smile_ElasticsuiteCatalogOptimizer/js/components/form/optimizer/fieldset-visibility</item>
+                <item name="imports" xsi:type="array">
+                    <item name="initValue" xsi:type="string">${ $.provider }:data.model</item>
+                </item>
+                <item name="listens" xsi:type="array">
+                    <item name="${ $.provider }:data.model" xsi:type="string">onChange</item>
+                </item>
             </item>
         </argument>
         <field name="config">
@@ -742,9 +767,15 @@
     <fieldset name="attribute_value">
         <argument name="data" xsi:type="array">
             <item name="config" xsi:type="array">
-                <item name="label" xsi:type="string" translate="true">Configuration</item>
+                <item name="label" xsi:type="string" translate="true"><![CDATA[Boost & Bury]]></item>
                 <item name="sortOrder" xsi:type="number">100</item>
                 <item name="component" xsi:type="string">Smile_ElasticsuiteCatalogOptimizer/js/components/form/optimizer/fieldset-visibility</item>
+                <item name="imports" xsi:type="array">
+                    <item name="initValue" xsi:type="string">${ $.provider }:data.model</item>
+                </item>
+                <item name="listens" xsi:type="array">
+                    <item name="${ $.provider }:data.model" xsi:type="string">onChange</item>
+                </item>
             </item>
         </argument>
 
@@ -835,30 +866,5 @@
         </field>
     </fieldset>
 
-    <fieldset name="optimizer_rule_fieldset">
-        <argument name="data" xsi:type="array">
-            <item name="config" xsi:type="array">
-                <item name="label" xsi:type="string" translate="true">Apply to products</item>
-                <item name="sortOrder" xsi:type="number">120</item>
-            </item>
-        </argument>
 
-        <container name="optimizer_rule_container">
-            <argument name="data" xsi:type="array">
-                <item name="config" xsi:type="array">
-                    <item name="sortOrder" xsi:type="number">20</item>
-                </item>
-            </argument>
-            <htmlContent name="rule_condition">
-                <argument name="block" xsi:type="object">Smile\ElasticsuiteCatalogOptimizer\Block\Adminhtml\Optimizer\RuleCondition</argument>
-                <argument name="data" xsi:type="array">
-                    <item name="config" xsi:type="array">
-                        <item name="sortOrder" xsi:type="number">10</item>
-                        <item name="component" xsi:type="string">Smile_ElasticsuiteCatalogRule/js/component/catalog/product/form/rule</item>
-                        <item name="dataScope" xsi:type="string">rule_condition</item>
-                    </item>
-                </argument>
-            </htmlContent>
-        </container>
-    </fieldset>
 </form>
diff --git a/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/fieldset-visibility.js b/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/fieldset-visibility.js
index 7d7cfb851..b8b741cc1 100644
--- a/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/fieldset-visibility.js
+++ b/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/fieldset-visibility.js
@@ -14,12 +14,6 @@
 define(['Magento_Ui/js/form/components/fieldset', 'underscore'], function(Fieldset, _) {
     return Fieldset.extend({
         defaults: {
-            imports: {
-                "initValue": "${ $.provider }:data.model"
-            },
-            listens: {
-                "${ $.provider }:data.model" : "onChange"
-            },
             displayedForValues : {}
         },
         initialize: function() {
@@ -27,7 +21,7 @@ define(['Magento_Ui/js/form/components/fieldset', 'underscore'], function(Fields
             this.observe(['disableChildren']);
             this.onChange(this.initValue);
         },
-        onChange: function(value)  {
+        onChange: function(value) {
 
             var isVisible = this.index == value;
 
diff --git a/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/optimizer-preview.js b/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/optimizer-preview.js
index 3578d1305..a0e9e2d90 100644
--- a/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/optimizer-preview.js
+++ b/src/module-elasticsuite-catalog-optimizer/view/adminhtml/web/js/components/form/optimizer/optimizer-preview.js
@@ -15,8 +15,9 @@ define([
     'Magento_Ui/js/form/element/abstract',
     'jquery',
     'Smile_ElasticsuiteCatalogOptimizer/js/components/form/optimizer/preview/item',
+    'uiRegistry',
     'MutationObserver'
-], function (Component, $, Product) {
+], function (Component, $, Product, uiRegistry) {
     'use strict';
 
     return Component.extend({
@@ -25,6 +26,9 @@ define([
             template: "Smile_ElasticsuiteCatalogOptimizer/form/element/optimizer-preview",
             refreshFields: {},
             maxRefreshInterval: 200,
+            listens: {
+                "${ $.provider }:data.model" : "resetPreview"
+            },
             imports: {
                 formData: "${ $.provider }:data"
             },
@@ -106,6 +110,17 @@ define([
         showMoreProducts: function () {
             this.currentSize(this.currentSize() + this.pageSize);
             this.refreshProductList();
-        }
+        },
+
+        resetPreview: function () {
+            this.baseProducts([]);
+            this.optimizedProducts([]);
+            this.countTotalProducts(0)
+            this.currentSize(this.pageSize);
+            let searchInput = uiRegistry.get(this.parentName + '.' + this.searchInput);
+            if (searchInput !== undefined) {
+                searchInput.reset();
+            }
+        },
     });
 });