[FIX] web: list: care about allow_order option

Some overrides of search might allow to sort on non sortable fields like
my_activity_date_deadline on crm_lead. An option allow_order was used
to indicate that to the legacy list view. The new list view introduced
with odoo@bc0a0ce
no longer consider that option and consequently the Pipeline list view
of crm can now longer be sorted by my_activity_date_deadline. The same
happens in some other views.

In this commit, we reintroduce the use of that option in the list view
and fix that problem.

closes odoo#101837

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

addons/web/static/src/views/list/list_renderer.js

@@ -561,9 +561,8 @@ export class ListRenderer extends Component {
     }
 
     getColumnClass(column) {
-        const field = this.fields[column.name];
         const classNames = ["align-middle"];
-        if (field.sortable && column.hasLabel) {
+        if (this.isSortable(column)) {
             classNames.push("o_column_sortable", "position-relative", "cursor-pointer");
         } else {
             classNames.push("cursor-default");
@@ -594,10 +593,16 @@ export class ListRenderer extends Component {
         return ["float", "integer", "monetary"].includes(type);
     }
 
+    isSortable(column) {
+        const { hasLabel, name } = column;
+        const { sortable } = this.fields[name];
+        const { options } = this.props.list.activeFields[name];
+        return (sortable || options.allow_order) && hasLabel;
+    }
+
     getSortableIconClass(column) {
-        const { sortable } = this.fields[column.name];
         const { orderBy } = this.props.list;
-        const classNames = sortable && column.hasLabel ? ["fa", "fa-lg", "px-2"] : ["d-none"];
+        const classNames = this.isSortable(column) ? ["fa", "fa-lg", "px-2"] : ["d-none"];
         if (orderBy.length && orderBy[0].name === column.name) {
             classNames.push(orderBy[0].asc ? "fa-angle-up" : "fa-angle-down");
         } else {
@@ -829,7 +834,7 @@ export class ListRenderer extends Component {
         }
         const fieldName = column.name;
         const list = this.props.list;
-        if (this.fields[fieldName].sortable && column.hasLabel) {
+        if (this.isSortable(column)) {
             if (list.isGrouped) {
                 const isSortable =
                     list.groups[0].getAggregates(fieldName) || list.groupBy.includes(fieldName);
@@ -1583,11 +1588,7 @@ export class ListRenderer extends Component {
     onHoverSortColumn(ev, column) {
         if (this.props.list.orderBy.length && this.props.list.orderBy[0].name === column.name) {
             return;
-        } else if (
-            this.fields[column.name].sortable &&
-            column.widget !== "handle" &&
-            column.hasLabel
-        ) {
+        } else if (this.isSortable(column) && column.widget !== "handle") {
             ev.target.classList.toggle("table-active", ev.type == "mouseenter");
         }
     }

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

@@ -15208,4 +15208,36 @@ QUnit.module("Views", (hooks) => {
             "Groups should contains correct records"
         );
     });
+
+    QUnit.test("sort on a non sortable field with allow_order option", async function (assert) {
+        serverData.models.foo.records = [{ bar: true }, { bar: false }, { bar: true }];
+
+        await makeView({
+            type: "list",
+            resModel: "foo",
+            serverData,
+            arch: `
+                <list>
+                    <field name="bar" options="{ 'allow_order': true }"/>
+                </list>
+            `,
+        });
+
+        assert.deepEqual(
+            [...target.querySelectorAll("[name=bar] input")].map((el) => el.checked),
+            [true, false, true]
+        );
+        assert.hasClass(target.querySelectorAll("th[data-name=bar]"), "o_column_sortable");
+        assert.doesNotHaveClass(target.querySelectorAll("th[data-name=bar]"), "table-active");
+
+        await click(target, "th[data-name=bar]");
+
+        assert.deepEqual(
+            [...target.querySelectorAll("[name=bar] input")].map((el) => el.checked),
+            [false, true, true]
+        );
+        assert.hasClass(target.querySelectorAll("th[data-name=bar]"), "o_column_sortable");
+        assert.hasClass(target.querySelectorAll("th[data-name=bar]"), "table-active");
+        assert.hasClass(target.querySelectorAll("th[data-name=bar] i"), "fa-angle-up");
+    });
 });