From 5f89007b1c260cb2c216ea19f3398dcb798448f9 Mon Sep 17 00:00:00 2001
From: Rodolpho Lima <rcdl@odoo.com>
Date: Thu, 24 Aug 2023 16:13:23 +0200
Subject: [PATCH] [FIX] web_editor: save image as attachment in forms

Before this commit, when the Wysiwyg was used in a html form (like
website_forum), its `savePendingImages` method was not called. This
resulted in keeping pasted or dropped images as base-64 encoded sources
instead of converting them to attachments.

This commit ensures such conversion takes place.

task-3499058

closes odoo/odoo#137073

X-original-commit: 00aad6aa92c8ad476f9f78779b7a24cb5f7af2ff
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
Signed-off-by: Rodolpho Cammarosano de Lima (rcdl) <rcdl@odoo.com>
---
 .../js/frontend/loadWysiwygFromTextarea.js    | 20 ++++++++++++++-----
 .../static/src/js/wysiwyg/wysiwyg.js          |  7 ++++++-
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/addons/web_editor/static/src/js/frontend/loadWysiwygFromTextarea.js b/addons/web_editor/static/src/js/frontend/loadWysiwygFromTextarea.js
index 275ef43b2de..3fd0e2b9aba 100644
--- a/addons/web_editor/static/src/js/frontend/loadWysiwygFromTextarea.js
+++ b/addons/web_editor/static/src/js/frontend/loadWysiwygFromTextarea.js
@@ -49,11 +49,21 @@ export async function loadWysiwygFromTextarea(parent, textarea, options) {
     // o_we_selected_image has not always been removed when
     // saving a post so we need the line below to remove it if it is present.
     $form.find('.note-editable').find('img.o_we_selected_image').removeClass('o_we_selected_image');
-    $form.on('click', 'button[type=submit]', (e) => {
-        $form.find('.note-editable').find('img.o_we_selected_image').removeClass('o_we_selected_image');
-        // float-start class messes up the post layout OPW 769721
-        $form.find('.note-editable').find('img.float-start').removeClass('float-start');
-        $textarea.html(wysiwyg.getValue());
+
+    let b64imagesPending = true;
+    $form.on('click', 'button[type=submit]', (ev) => {
+        if (b64imagesPending) {
+            ev.preventDefault();
+            wysiwyg.savePendingImages().finally(() => {
+                b64imagesPending = false;
+                ev.currentTarget.click();
+            });
+        } else {
+            $form.find('.note-editable').find('img.o_we_selected_image').removeClass('o_we_selected_image');
+            // float-start class messes up the post layout OPW 769721
+            $form.find('.note-editable').find('img.float-start').removeClass('float-start');
+            $textarea.html(wysiwyg.getValue());
+        }
     });
 
     return wysiwyg;
diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
index 188cfa83d29..f955f9467f7 100644
--- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
+++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
@@ -39,6 +39,7 @@ import {
     onWillDestroy,
     onWillUpdateProps,
     markup,
+    status,
 } from "@odoo/owl";
 import { requireWysiwygLegacyModule } from "@web_editor/js/frontend/loader";
 import { isCSSColor } from '@web/core/utils/colors';
@@ -142,6 +143,7 @@ export class Wysiwyg extends Component {
 
     setup() {
         this.orm = this._useService('orm');
+        this.rpc = this._useService('rpc');
         this.getColorPickerTemplateService = this._useService('get_color_picker_template');
         this.notification = this._useService("notification");
         this.popover = this._useService("popover");
@@ -3354,13 +3356,16 @@ export class Wysiwyg extends Component {
         payload.callback(result);
     }
     _serviceRpc(route, params, settings = {}) {
+        if (status(this) === "destroyed") {
+            return;
+        }
         if (params && params.kwargs) {
             params.kwargs.context = {
                 ...this.env.services.user.context,
                 ...params.kwargs.context,
             };
         }
-        return this.env.services.rpc(route, params, {
+        return this.rpc(route, params, {
             silent: settings.shadow,
             xhr: settings.xhr,
         });