[FIX] website, web_editor: prevent mega menu removal

The user was able to remove the mega menu snippet without removing
the corresponding link in the menu. To avoid this flow to happen
we removed the delete button for the mega menu snippet. We also
handle the case where the user remove the mega menu snippet element
by element. On last element removal we put back the original template.

task-2636545

closes odoo/odoo#77256

X-original-commit: 97810a9c40396bb27cb5779937734849d185cf1f
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

addons/web_editor/static/src/js/editor/snippets.options.js

@@ -6692,6 +6692,31 @@ registry.SelectTemplate = SnippetOptionWidget.extend({
         }
     },
 
+    //--------------------------------------------------------------------------
+    // Private
+    //--------------------------------------------------------------------------
+
+    /**
+     * Retrieves a template either from cache or through RPC.
+     *
+     * @private
+     * @param {string} xmlid
+     * @returns {string}
+     */
+    async _getTemplate(xmlid) {
+        if (!this._templates[xmlid]) {
+            this._templates[xmlid] = await this._rpc({
+                model: 'ir.ui.view',
+                method: 'render_public_asset',
+                args: [`${xmlid}`, {}],
+                kwargs: {
+                    context: this.options.context,
+                },
+            });
+        }
+        return this._templates[xmlid];
+    },
+
     //--------------------------------------------------------------------------
     // Handlers
     //--------------------------------------------------------------------------
@@ -6712,14 +6737,7 @@ registry.SelectTemplate = SnippetOptionWidget.extend({
             // TODO should be better and retrieve all rendering in one RPC (but
             // those ~10 RPC are only done once per edit mode if the option is
             // opened, so I guess this is acceptable).
-            this._templates[xmlid] = await this._rpc({
-                model: 'ir.ui.view',
-                method: 'render_public_asset',
-                args: [`${xmlid}`, {}],
-                kwargs: {
-                    context: this.options.context,
-                },
-            });
+            await this._getTemplate(xmlid);
         });
         this._templatesLoading = Promise.all(proms);
     },

addons/website/static/src/js/editor/snippets.options.js

@@ -3269,6 +3269,25 @@ options.registry.MegaMenuLayout = options.registry.SelectTemplate.extend({
         this.selectTemplateWidgetName = 'mega_menu_template_opt';
     },
 
+    //--------------------------------------------------------------------------
+    // Public
+    //--------------------------------------------------------------------------
+
+    /**
+     * @override
+     */
+    notify(name, data) {
+        if (name === 'reset_template') {
+            const xmlid = this._getCurrentTemplateXMLID();
+            this._getTemplate(xmlid).then(template => {
+                this.containerEl.insertAdjacentHTML('beforeend', template);
+                data.onSuccess();
+            });
+        } else {
+            this._super(...arguments);
+        }
+    },
+
     //--------------------------------------------------------------------------
     // Private
     //--------------------------------------------------------------------------
@@ -3278,12 +3297,41 @@ options.registry.MegaMenuLayout = options.registry.SelectTemplate.extend({
      */
     _computeWidgetState: function (methodName, params) {
         if (methodName === 'selectTemplate') {
-            const templateDefiningClass = this.containerEl.querySelector('section')
-                .classList.value.split(' ').filter(cl => cl.startsWith('s_mega_menu'))[0];
-            return `website.${templateDefiningClass}`;
+            return this._getCurrentTemplateXMLID();
         }
         return this._super(...arguments);
     },
+    /**
+     * @private
+     * @returns {string} xmlid of the current template.
+     */
+    _getCurrentTemplateXMLID: function () {
+        const templateDefiningClass = this.containerEl.querySelector('section')
+            .classList.value.split(' ').filter(cl => cl.startsWith('s_mega_menu'))[0];
+        return `website.${templateDefiningClass}`;
+    },
+});
+
+/**
+ * Hides delete button for Mega Menu block.
+ */
+options.registry.MegaMenuNoDelete = options.Class.extend({
+    forceNoDeleteButton: true,
+
+    /**
+     * @override
+     */
+    async onRemove() {
+        await new Promise(resolve => {
+            this.trigger_up('option_update', {
+                optionName: 'MegaMenuLayout',
+                name: 'reset_template',
+                data: {
+                    onSuccess: () => resolve(),
+                }
+            });
+        });
+    },
 });
 
 return {

addons/website/views/snippets/snippets.xml

@@ -1030,6 +1030,8 @@
         </we-select>
     </div>
 
+    <div data-js="MegaMenuNoDelete" data-selector=".o_mega_menu > section"/>
+
     <div data-selector=".o_mega_menu .nav > .nav-link"
          data-drop-in=".o_mega_menu nav"
          data-drop-near=".o_mega_menu .nav-link"/>