From 6fdb086a1f8b775a749cf2bccd277bab75111655 Mon Sep 17 00:00:00 2001
From: "Serge Bayet (seba)" <seba@odoo.com>
Date: Tue, 19 Dec 2023 15:13:40 +0100
Subject: [PATCH] [FIX] website: resolve issue with logo transformation from
 text to image

This commit addresses an issue when the logo is in text mode and we
want to click on the `logo` check button under the `Header`/`Elements`
options.

The bug manifested itself in [this commit] during the redesign of the
website template headers. The logo button, initially assumed to have two
states, is, in fact, comprised of three: None, Text, and Logo. To
address this issue, a workaround has been implemented, treating None and
Text as a single state. Consequently, if the current state is Text or
None, toggling will transition to Logo, and conversely, if it is Logo,
the toggle will shift to None.

Steps to reproduce:
- Enter edit mode.
- Click on the header navbar.
- Click on the logo.
- Go to navbar brand options and choose "Text" in the dropdown Logo
  selector.
- The website is now saved. click on the button `LOGO` under the
  "Header" -> "Elements" option.
- An error occurs: the template is not well-formed or wrong.

[this commit]: https://github.com/odoo/odoo/commit/e5380a8e40be47cddf53aa24ff01e7c6802bbdb7

opw-3624285

closes odoo/odoo#146839

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Co-authored-by: qsm-odoo <qsm@odoo.com>
---
 .../static/src/js/editor/snippets.editor.js   | 22 +++++++++++++++++++
 addons/website/views/snippets/snippets.xml    |  2 ++
 2 files changed, 24 insertions(+)

diff --git a/addons/website/static/src/js/editor/snippets.editor.js b/addons/website/static/src/js/editor/snippets.editor.js
index ea5801786cf..0e0ea70d3c2 100644
--- a/addons/website/static/src/js/editor/snippets.editor.js
+++ b/addons/website/static/src/js/editor/snippets.editor.js
@@ -154,6 +154,28 @@ const wSnippetMenu = weSnippetEditor.SnippetsMenu.extend({
         FontFamilyPickerUserValueWidget.prototype.fontVariables = fontVariables;
         return this._super(...arguments);
     },
+    /**
+     * @override
+     */
+    _patchForComputeSnippetTemplates($html) {
+        this._super(...arguments);
+
+        // TODO adapt in master: as a stable fix we corrected the behavior of
+        // the logo button that led to an error when switching from Text to
+        // Logo. Remove me in master.
+        const logoViewName = 'website.option_header_brand_logo';
+        const logoButtonEl = $html.find(`[data-customize-website-views="${logoViewName}"]`)[0];
+        if (logoButtonEl) {
+            logoButtonEl.dataset.customizeWebsiteViews = `|website.option_header_brand_name|${logoViewName}`;
+            logoButtonEl.dataset.resetViewArch = "true";
+        }
+        const brandSelectorEl = $html.find('[data-name="option_header_brand_none"]')[0]
+            ?.closest("[data-selector]");
+        if (brandSelectorEl) {
+            brandSelectorEl.dataset.selector = brandSelectorEl.dataset.selector
+                .replace('.navbar-brand.logo', '.navbar-brand');
+        }
+    },
     /**
      * Depending of the demand, reconfigure they gmap key or configure it
      * if not already defined.
diff --git a/addons/website/views/snippets/snippets.xml b/addons/website/views/snippets/snippets.xml
index 08374a81f1f..3426d31131e 100644
--- a/addons/website/views/snippets/snippets.xml
+++ b/addons/website/views/snippets/snippets.xml
@@ -1018,6 +1018,7 @@
                     data-customize-website-views="website.header_call_to_action"
                     data-reset-view-arch="true"
                     data-reload="/"/>
+            <!-- TODO: this is patched in JS, adapt in master -->
             <we-button title="Show/hide logo" class="flex-grow-1 d-flex justify-content-center"
                     data-img="/website/static/src/img/snippets_options/header_extra_element_logo.svg"
                     data-customize-website-views="website.option_header_brand_logo"
@@ -1110,6 +1111,7 @@
         </we-select>
     </div>
 
+    <!-- TODO this is patched in JS, adapt in master -->
     <div data-selector="#wrapwrap > header nav.navbar .navbar-brand.logo"
          data-no-check="true"
          groups="website.group_website_designer">