From 2ddc00f9af7b879d4d970d6d7c0fb656ebe5f6c9 Mon Sep 17 00:00:00 2001
From: "Xavier Bol (xbo)" <xbo@odoo.com>
Date: Thu, 11 Jan 2024 16:48:54 +0100
Subject: [PATCH] [FIX] web: display "Remove Cover Image" button

Before this commit, when a kanban card has cover image set and the user
would like to remove it, he does not have the "Remove Cover Image"
button displayed when he goes to KanbanCoverImageDialog. The reason
is because the condition on `t-if` set on that button is always
falsy because `coverId` is undefined in the component.

This commit defines getter called `hasCoverImage` to return true
if the record displayed in the kanban card has cover image set.

task-3623759

closes odoo/odoo#150033

X-original-commit: c5d1894804c590dec208755e93d21f249714721d
Signed-off-by: Xavier Bol (xbo) <xbo@odoo.com>
---
 .../views/kanban/kanban_cover_image_dialog.js |  4 ++
 .../kanban/kanban_cover_image_dialog.xml      |  2 +-
 .../tests/views/kanban/kanban_view_tests.js   | 71 ++++++++++++++++++-
 3 files changed, 75 insertions(+), 2 deletions(-)

diff --git a/addons/web/static/src/views/kanban/kanban_cover_image_dialog.js b/addons/web/static/src/views/kanban/kanban_cover_image_dialog.js
index 8d7c85833ac..098f5b66081 100644
--- a/addons/web/static/src/views/kanban/kanban_cover_image_dialog.js
+++ b/addons/web/static/src/views/kanban/kanban_cover_image_dialog.js
@@ -33,6 +33,10 @@ export class KanbanCoverImageDialog extends Component {
         });
     }
 
+    get hasCoverImage() {
+        return Boolean(this.props.record.data[this.props.fieldName]);
+    }
+
     onUpload([attachment]) {
         if (!attachment) {
             return;
diff --git a/addons/web/static/src/views/kanban/kanban_cover_image_dialog.xml b/addons/web/static/src/views/kanban/kanban_cover_image_dialog.xml
index 80f800aeb2f..675d6082c6a 100644
--- a/addons/web/static/src/views/kanban/kanban_cover_image_dialog.xml
+++ b/addons/web/static/src/views/kanban/kanban_cover_image_dialog.xml
@@ -31,7 +31,7 @@
                             Upload and Set
                         </button>
                 </FileInput>
-                <button t-if="coverId" class="btn btn-secondary" t-on-click="removeCover">
+                <button t-if="hasCoverImage" class="btn btn-secondary" t-on-click="removeCover">
                     Remove Cover Image
                 </button>
                 <button class="btn btn-secondary" t-on-click="dialog.close">
diff --git a/addons/web/static/tests/views/kanban/kanban_view_tests.js b/addons/web/static/tests/views/kanban/kanban_view_tests.js
index 4d15eb82bee..e936689ce13 100644
--- a/addons/web/static/tests/views/kanban/kanban_view_tests.js
+++ b/addons/web/static/tests/views/kanban/kanban_view_tests.js
@@ -11055,7 +11055,7 @@ QUnit.module("Views", (hooks) => {
     );
 
     QUnit.test("set cover image", async (assert) => {
-        assert.expect(10);
+        assert.expect(11);
 
         serviceRegistry.add("dialog", dialogService, { force: true });
         serviceRegistry.add("http", {
@@ -11123,6 +11123,7 @@ QUnit.module("Views", (hooks) => {
         assert.containsOnce(document.body, ".modal .o_kanban_cover_image");
         assert.containsOnce(document.body, ".modal .btn:contains(Select)");
         assert.containsOnce(document.body, ".modal .btn:contains(Discard)");
+        assert.containsNone(document.body, ".modal .btn:contains(Remove Cover Image)");
 
         await triggerEvent(
             document.body,
@@ -11139,6 +11140,74 @@ QUnit.module("Views", (hooks) => {
         assert.verifySteps(["1", "2"], "should writes on both kanban records");
     });
 
+    QUnit.test("unset cover image", async (assert) => {
+        serverData.models.partner.records[0].displayed_image_id = 1;
+        serverData.models.partner.records[1].displayed_image_id = 2;
+        serviceRegistry.add("dialog", dialogService, { force: true });
+        serviceRegistry.add("http", {
+            start: () => ({}),
+        });
+        await makeView({
+            type: "kanban",
+            resModel: "partner",
+            serverData,
+            arch:
+                `<kanban>
+                    <templates>
+                        <t t-name="kanban-menu">
+                            <a type="set_cover" data-field="displayed_image_id" class="dropdown-item">Set Cover Image</a>
+                        </t>
+                        <t t-name="kanban-box">
+                            <div class="oe_kanban_global_click">
+                                <field name="name"/>
+                                <div>
+                                    <field name="displayed_image_id" widget="attachment_image"/>
+                                </div>
+                            </div>
+                        </t>
+                    </templates>
+                </kanban>`,
+            async mockRPC(_route, { model, method, args }) {
+                if (model === "partner" && method === "web_save") {
+                    assert.step(String(args[0][0]));
+                    assert.strictEqual(args[1].displayed_image_id, false);
+                }
+            },
+        });
+
+        await toggleRecordDropdown(target, 0);
+        await click(getCard(target, 0), ".oe_kanban_action");
+
+        assert.containsOnce(getCard(target, 0), 'img[data-src*="/web/image/1"]');
+        assert.containsOnce(getCard(target, 1), 'img[data-src*="/web/image/2"]');
+
+        assert.containsOnce(document.body, ".modal .o_kanban_cover_image");
+        assert.containsOnce(document.body, ".modal .btn:contains(Select)");
+        assert.containsOnce(document.body, ".modal .btn:contains(Discard)");
+        assert.containsOnce(document.body, ".modal .btn:contains(Remove Cover Image)");
+
+        await click(document.querySelector(".modal .modal-footer .btn-secondary")); // click on "Remove Cover Image" button
+
+        assert.containsNone(getCard(target, 0), "img", "The cover image should be removed.");
+
+        await toggleRecordDropdown(target, 1);
+        const coverButton = getCard(target, 1).querySelector("a");
+        assert.strictEqual(coverButton.innerText.trim(), "Set Cover Image");
+        await click(coverButton);
+
+        await triggerEvent(
+            document.body,
+            ".modal .o_kanban_cover_image img",
+            "dblclick",
+            { bubbles: true },
+            { skipVisibilityCheck: true }
+        );
+
+        assert.containsNone(getCard(target, 1), "img", "The cover image should be removed.");
+
+        assert.verifySteps(["1", "2"], "should writes on both kanban records");
+    });
+
     QUnit.test("ungrouped kanban with handle field", async (assert) => {
         assert.expect(3);