[FIX] web: kanban do not allow to drag grouped by readonly fields

When the kanban is grouped on a readonly fields,
it shouldn't be possible to drag and drop a record from
one column to another.

It was the case when the field was part of the view architecture,
but not when the fields wasn't part of the architecture,
despite we have the information as we have the field description
through the search view / the control panel.

This is a bug which has been introduced during the OWL conversion.
For instance, in 15.0, when grouping CRM leads by sanitized phone,
it wasn't possible to drag and drop records from one column
to another.
In master this is possible.
Besides, in the legacy code, the readonly information
is read from both the field in the architecture and the general
field descriptions:
- https://github.com/odoo/odoo/blob/67191359f2e71be85e6e72d64720bb2748008b3f/addons/web/static/src/legacy/js/views/kanban/kanban_renderer.js#L506-L515

In addition, compared to before,
this revision allows a new possibility compared to before:
Make draggable when grouped by a field which is by default
readonly in the model,
but which is set as `readonly="0"` in the view.
This is to be uniform with what is done in the list and form views.

closes odoo/odoo#101041

X-original-commit: 2a0f8d9ddba754cfc297b2a0de6e2c56990b1e61
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>

addons/web/static/src/views/kanban/kanban_renderer.js

@@ -158,10 +158,10 @@ export class KanbanRenderer extends Component {
         if (!this.props.list.groupByField) {
             return true;
         }
-        const { groupByField } = this.props.list;
+        const { groupByField, fields } = this.props.list;
         const { modifiers, type } = groupByField;
         return Boolean(
-            !(modifiers && modifiers.readonly) &&
+            !(modifiers ? modifiers.readonly : fields[groupByField.name].readonly) &&
                 (isAllowedDateField(groupByField) || MOVABLE_RECORD_TYPES.includes(type))
         );
     }
@@ -170,11 +170,12 @@ export class KanbanRenderer extends Component {
         if (!this.props.list.isGrouped) {
             return false;
         }
-        const { modifiers, type } = this.props.list.groupByField;
+        const { groupByField, fields } = this.props.list;
+        const { modifiers, type } = groupByField;
         const { groupsDraggable } = this.props.archInfo;
         return (
             groupsDraggable &&
-            !(modifiers && modifiers.readonly) &&
+            !(modifiers ? modifiers.readonly : fields[groupByField.name].readonly) &&
             DRAGGABLE_GROUP_TYPES.includes(type)
         );
     }

addons/web/static/tests/views/kanban_view_tests.js

@@ -4307,7 +4307,22 @@ QUnit.module("Views", (hooks) => {
     });
 
     QUnit.test("prevent drag and drop of record if grouped by readonly", async (assert) => {
+        // Whether the kanban is grouped by state, foo or bar
+        // the user must not be able to drag and drop from one group to another,
+        // as state, foo or bar are made readonly one way or another.
+        // However, product_id must be draggable: by default, in the models, it's readonly,
+        // but a counter order is given in the view architecture: readonly="0".
+        // state must not be draggable:
+        // state is not readonly in the model. state is passed in the arch specifying readonly="1".
+        // foo must not be draggable:
+        // foo is readonly in the model fields. foo is passed in the arch but without specifying readonly.
+        // bar must not be draggable:
+        // bar is readonly in the model fields. bar is not passed in the arch.
+        // product_id must be draggable:
+        // product_id is readonly in the model fields. product_id is passed in the arch specifying readonly="0".
         serverData.models.partner.fields.foo.readonly = true;
+        serverData.models.partner.fields.bar.readonly = true;
+        serverData.models.partner.fields.product_id.readonly = true;
         const kanban = await makeView({
             type: "kanban",
             resModel: "partner",
@@ -4317,6 +4332,7 @@ QUnit.module("Views", (hooks) => {
                 "<templates>" +
                 '<t t-name="kanban-box"><div>' +
                 '<field name="foo"/>' +
+                '<field name="product_id" readonly="0" invisible="1"/>' +
                 '<field name="state" readonly="1"/>' +
                 "</div></t>" +
                 "</templates>" +
@@ -4326,7 +4342,8 @@ QUnit.module("Views", (hooks) => {
                 if (route === "/web/dataset/resequence") {
                     return true;
                 }
-                if (args.model === "partner" && args.method === "write") {
+                if (args.model === "partner" && args.method === "write" && !(args.args && args.args[1] && args.args[1].product_id)) {
+                    // In the test, nothing should be draggable except the test on product_id
                     throw new Error("should not be draggable");
                 }
             },
@@ -4374,6 +4391,49 @@ QUnit.module("Views", (hooks) => {
 
         // should still be able to resequence
         assert.deepEqual(getCardTexts(0), ["blipGHI", "blipDEF"]);
+
+        await reload(kanban, { groupBy: ["bar"] });
+
+        assert.containsN(target, ".o_kanban_group:first-child .o_kanban_record", 1);
+        assert.containsN(target, ".o_kanban_group:nth-child(2) .o_kanban_record", 3);
+        assert.containsN(target, ".o_kanban_group:nth-child(3) .o_kanban_record", 0);
+
+        assert.deepEqual(getCardTexts(0), ["blipGHI"]);
+
+        // first record of first column moved to the bottom of second column
+        await dragAndDrop(
+            ".o_kanban_group:first-child .o_kanban_record",
+            ".o_kanban_group:nth-child(2)"
+        );
+
+        // should not be draggable
+        assert.containsN(target, ".o_kanban_group:first-child .o_kanban_record", 1);
+        assert.containsN(target, ".o_kanban_group:nth-child(2) .o_kanban_record", 3);
+        assert.containsN(target, ".o_kanban_group:nth-child(3) .o_kanban_record", 0);
+
+        assert.deepEqual(getCardTexts(0), ["blipGHI"]);
+
+        await reload(kanban, { groupBy: ["product_id"] });
+
+        assert.containsN(target, ".o_kanban_group:first-child .o_kanban_record", 2);
+        assert.containsN(target, ".o_kanban_group:nth-child(2) .o_kanban_record", 2);
+        assert.containsN(target, ".o_kanban_group:nth-child(3) .o_kanban_record", 0);
+
+        assert.deepEqual(getCardTexts(0), ["yopABC", "gnapGHI"]);
+
+        // first record of first column moved to the bottom of second column
+        await dragAndDrop(
+            ".o_kanban_group:first-child .o_kanban_record",
+            ".o_kanban_group:nth-child(2)"
+        );
+
+        // should be draggable
+        assert.containsN(target, ".o_kanban_group:first-child .o_kanban_record", 1);
+        assert.containsN(target, ".o_kanban_group:nth-child(2) .o_kanban_record", 3);
+        assert.containsN(target, ".o_kanban_group:nth-child(3) .o_kanban_record", 0);
+
+        assert.deepEqual(getCardTexts(0), ["gnapGHI"]);
+
     });
 
     QUnit.test("prevent drag and drop if grouped by date/datetime field", async (assert) => {