[IMP] website, web_editor: re-introduce cancel dialog

The cancel dialog is now using the new Dialog API and disables buttons
when the process is ongoing.

This is needed because prior to this commit, the iframe would reload,
but it would still be possible to click on the buttons.
So one could cancel then click on save and a traceback would show up.

See merge commit for more information.

task-2687506

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

@@ -3406,11 +3406,11 @@ var SnippetsMenu = Widget.extend({
      * On click on discard button.
      */
     _onDiscardClick: function () {
-        this._buttonClick(() => {
+        this._buttonClick(after => {
             this.snippetEditors.forEach(editor => {
                 editor.toggleOverlay(false);
             });
-            this.trigger_up('request_cancel');
+            this.trigger_up('request_cancel', {onReject: after});
         }, this.$el[0].querySelector('button[data-action=cancel]'));
     },
     /**
@@ -3465,12 +3465,18 @@ var SnippetsMenu = Widget.extend({
             return;
         }
         this._buttonAction = true;
-        dom.addButtonLoadingEffect(button);
+        const removeLoadingEffect = dom.addButtonLoadingEffect(button);
         const actionButtons = this.$el[0].querySelectorAll('[data-action]');
         for (const actionButton of actionButtons) {
             actionButton.disabled = true;
         }
-        await action();
+        const after = () =>  {
+            removeLoadingEffect();
+            for (const actionButton of actionButtons) {
+                actionButton.disabled = false;
+            }
+        };
+        await action(after);
         this._buttonAction = false;
     },
 

addons/website/static/src/components/wysiwyg_adapter/wysiwyg_adapter.js

@@ -7,6 +7,7 @@ import { useWowlService } from '@web/legacy/utils';
 import { useHotkey } from '@web/core/hotkeys/hotkey_hook';
 
 import { EditMenuDialog, MenuDialog } from "../dialog/edit_menu";
+import { WebsiteDialog } from '../dialog/dialog';
 import { PageOption } from "./page_options";
 
 const { onWillStart, useEffect } = owl;
@@ -559,7 +560,16 @@ export class WysiwygAdapterComponent extends ComponentAdapter {
      * @private
      */
     _onCancelRequest(event) {
-        return this.props.quitCallback();
+        const isDirty = this.widget.isDirty();
+        if (isDirty) {
+            this.dialogs.add(WebsiteDialog, {
+                body: _t("If you discard the current edits, all unsaved changes will be lost. You can cancel to return to edit mode."),
+                primaryClick: () => this.props.quitCallback(),
+                secondaryClick: event.data.onReject,
+            });
+        } else {
+            return this.props.quitCallback();
+        }
     }
     /***
      * Starts the widgets inside the dropped snippet.