From 23eac53911f604a389a9ea2b095d77d77b0f211e Mon Sep 17 00:00:00 2001
From: Dharmraj Jhala <dja@odoo.com>
Date: Wed, 6 Apr 2022 06:53:18 +0000
Subject: [PATCH] [FIX] base: hide technical tips in settings view
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In the settings view, we need to display the technical tip below the
setting header (h2 tag). For example, we display such tip under the
'Developer Accounts' header in social media settings.

However, when we search something in the settings, this tip is not
hidden. It happens because the hiding and showing parts of the settings
page are managed with js using some special classes or tags (like h2
tag, `.o_setting_box` class etc).

This commit fixes the issue by introducing a new class `.o_setting_tip`
specific for such technical tips, and with help of that we now hide or
show the tips based on the user search.

Note: We could have used .o_setting_box without any side-effect, but
rules linked to this class can be changed in the future and can mess
with layout of the technical tips. As those are usually small blocks of text
that give a hint to the user and not directly associated with setting box
styling, making the overall code more robust / flexible.

enterprise PR - https://github.com/odoo/enterprise/pull/25907

task-2810617

closes odoo/odoo#88117

Related: odoo/enterprise#25907
Signed-off-by: Warnon Aurélien (awa) <awa@odoo.com>
---
 .../base/static/src/js/res_config_settings.js |  6 +--
 .../base/static/tests/base_settings_tests.js  | 38 +++++++++++++++++++
 2 files changed, 40 insertions(+), 4 deletions(-)

diff --git a/odoo/addons/base/static/src/js/res_config_settings.js b/odoo/addons/base/static/src/js/res_config_settings.js
index 2d9ba33104d..1c72a6c3e35 100644
--- a/odoo/addons/base/static/src/js/res_config_settings.js
+++ b/odoo/addons/base/static/src/js/res_config_settings.js
@@ -187,8 +187,7 @@ var BaseSettingRenderer = FormRenderer.extend({
         this.searchInput.val("");
         _.each(this.modules, function (module) {
             module.settingView.addClass('o_hidden');
-            module.settingView.find('.o_setting_box').removeClass('o_hidden');
-            module.settingView.find('h2').removeClass('o_hidden');
+            module.settingView.find('h2, .o_setting_box, .o_setting_tip').removeClass('o_hidden');
             module.settingView.find('.settingSearchHeader').addClass('o_hidden');
             module.settingView.find('.o_settings_container').addClass('mt16').removeClass('mb-0');
         });
@@ -230,8 +229,7 @@ var BaseSettingRenderer = FormRenderer.extend({
         this.count = 0;
         _.each(this.modules, function (module) {
             self.inVisibleCount = 0;
-            module.settingView.find('.o_setting_box').addClass('o_hidden');
-            module.settingView.find('h2').addClass('o_hidden');
+            module.settingView.find('h2, .o_setting_box, .o_setting_tip').addClass('o_hidden');
             module.settingView.find('.settingSearchHeader').addClass('o_hidden');
             module.settingView.find('.o_settings_container').removeClass('mt16').addClass('mb-0');
 
diff --git a/odoo/addons/base/static/tests/base_settings_tests.js b/odoo/addons/base/static/tests/base_settings_tests.js
index 1ee83575a37..dda68f60ddf 100644
--- a/odoo/addons/base/static/tests/base_settings_tests.js
+++ b/odoo/addons/base/static/tests/base_settings_tests.js
@@ -157,6 +157,44 @@ QUnit.module('base_settings_tests', {
         form.destroy();
     });
 
+    QUnit.test('hide / show setting tips properly', async function (assert) {
+        assert.expect(3);
+
+        const form = await createView({
+            View: BaseSettingsView,
+            model: 'res.config.settings',
+            data: this.data,
+            arch: `
+                <form string="Settings" class="oe_form_configuration o_base_settings">
+                    <div class="o_panel">
+                        <div class="setting_search">
+                            <input type="text" class="searchInput" placeholder="Search..." />
+                        </div>
+                    </div>
+                    <div class="o_setting_container">
+                        <div class="settings_tab" />
+                        <div class="settings">
+                            <div class="notFound o_hidden">No Record Found</div>
+                            <div class="app_settings_block" string="Settings" data-key="settings">
+                                <h2>Setting Header</h2>
+                                <h3 class="o_setting_tip">Settings will appear below</h3>
+                            </div>
+                        </div>
+                    </div>
+                </form>`
+        });
+
+        assert.containsOnce(form, '.o_setting_tip:not(.o_hidden)', 'Tip should not be hidden initially');
+
+        await testUtils.fields.editAndTrigger(form.$('.searchInput'), 'Setting', 'keyup');
+        assert.containsOnce(form, '.o_setting_tip.o_hidden', 'Tip should be hidden when user searches in settings');
+
+        await testUtils.fields.editAndTrigger(form.$('.searchInput'), '', 'keyup');
+        assert.containsOnce(form, '.o_setting_tip:not(.o_hidden)', 'Tip should be displayed again');
+
+        form.destroy();
+    });
+
     QUnit.test(
         "settings views does not read existing id when coming back in breadcrumbs",
         async function (assert) {