[FIX] web_timeline: order group_by field

Fix bug OCA#2266: before this fix, the lines of the timeline view were always sorted by alphabetical order, ignoring the native order of the model on which the group_by field points to.

Fix duplicate entries in the 'fields' argument when the 'colors' parameters uses the same field in multiple conditions.

Author: alexis-via

web_timeline/static/src/js/timeline_controller.js

@@ -66,6 +66,7 @@ odoo.define("web_timeline.TimelineController", function (require) {
                     kwargs: {
                         fields: fields,
                         domain: domains,
+                        order: [{name: this.renderer.arch.attrs.default_group_by}],
                     },
                     context: this.getSession().user_context,
                 }).then((data) =>

web_timeline/static/src/js/timeline_model.js

@@ -11,6 +11,7 @@ odoo.define("web_timeline.TimelineModel", function (require) {
         load: function (params) {
             this.modelName = params.modelName;
             this.fieldNames = params.fieldNames;
+            this.default_group_by = params.default_group_by;
             if (!this.preload_def) {
                 this.preload_def = $.Deferred();
                 $.when(
@@ -55,9 +56,12 @@ odoo.define("web_timeline.TimelineModel", function (require) {
             return this._rpc({
                 model: this.modelName,
                 method: "search_read",
-                context: this.data.context,
-                fields: this.fieldNames,
-                domain: this.data.domain,
+                kwargs: {
+                    fields: this.fieldNames,
+                    domain: this.data.domain,
+                    order: [{name: this.default_group_by}],
+                    context: this.data.context,
+                },
             }).then((events) => {
                 this.data.data = events;
                 this.data.rights = {

web_timeline/static/src/js/timeline_renderer.js

@@ -35,6 +35,7 @@ odoo.define("web_timeline.TimelineRenderer", function (require) {
             this.date_delay = params.date_delay;
             this.colors = params.colors;
             this.fieldNames = params.fieldNames;
+            this.default_group_by = params.default_group_by;
             this.dependency_arrow = params.dependency_arrow;
             this.modelClass = params.view.model;
             this.fields = params.fields;
@@ -377,7 +378,8 @@ odoo.define("web_timeline.TimelineRenderer", function (require) {
                 return events;
             }
             const groups = [];
-            groups.push({id: -1, content: _t("<b>UNASSIGNED</b>")});
+            groups.push({id: -1, content: _t("<b>UNASSIGNED</b>"), order: -1});
+            var seq = 1;
             for (const evt of events) {
                 const grouped_field = _.first(group_bys);
                 const group_name = evt[grouped_field];
@@ -411,14 +413,18 @@ odoo.define("web_timeline.TimelineRenderer", function (require) {
                                             }
                                         }
                                         if (!is_inside) {
+                                            vals.order = seq;
+                                            seq += 1;
                                             groups.push(vals);
                                         }
                                     }
                                 } else {
                                     groups.push({
                                         id: group_name[0],
                                         content: group_name[1],
+                                        order: seq,
                                     });
+                                    seq += 1;
                                 }
                             });
                         }
@@ -516,6 +522,7 @@ odoo.define("web_timeline.TimelineRenderer", function (require) {
                 start: date_start,
                 content: content,
                 id: evt.id,
+                order: evt.order,
                 group: group,
                 evt: evt,
                 style: `background-color: ${this.color};`,

web_timeline/static/src/js/timeline_view.js

@@ -73,7 +73,9 @@ odoo.define("web_timeline.TimelineView", function (require) {
 
             const colors = this.parse_colors();
             for (const color of colors) {
-                fieldNames.push(color.field);
+                if (!fieldNames.includes(color.field)) {
+                    fieldNames.push(color.field);
+                }
             }
 
             if (dependency_arrow) {
@@ -107,11 +109,13 @@ odoo.define("web_timeline.TimelineView", function (require) {
             this.rendererParams.date_delay = date_delay;
             this.rendererParams.colors = colors;
             this.rendererParams.fieldNames = fieldNames;
+            this.rendererParams.default_group_by = attrs.default_group_by;
             this.rendererParams.min_height = min_height;
             this.rendererParams.dependency_arrow = dependency_arrow;
             this.rendererParams.fields = fields;
             this.loadParams.modelName = this.modelName;
             this.loadParams.fieldNames = fieldNames;
+            this.loadParams.default_group_by = attrs.default_group_by;
             this.controllerParams.open_popup_action = open_popup_action;
             this.controllerParams.date_start = date_start;
             this.controllerParams.date_stop = date_stop;
@@ -122,7 +126,7 @@ odoo.define("web_timeline.TimelineView", function (require) {
 
         _preapre_vis_timeline_options: function (attrs) {
             return {
-                groupOrder: this.group_order,
+                groupOrder: "order",
                 orientation: "both",
                 selectable: true,
                 multiselect: true,
@@ -135,24 +139,6 @@ odoo.define("web_timeline.TimelineView", function (require) {
             };
         },
 
-        /**
-         * Order function for groups.
-         * @param {Object} grp1
-         * @param {Object} grp2
-         * @returns {Integer}
-         */
-        group_order: function (grp1, grp2) {
-            // Display non grouped elements first
-            if (grp1.id === -1) {
-                return -1;
-            }
-            if (grp2.id === -1) {
-                return 1;
-            }
-
-            return grp1.content.localeCompare(grp2.content);
-        },
-
         /**
          * Parse the colors attribute.
          *