From 490a10745790dc74934c18c8d32675e7e65a8b0e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Krier?= <ced@b2ck.com>
Date: Tue, 11 Jan 2022 23:08:57 +0100
Subject: [PATCH] Set expander to the first visible column

issue11071
review380041002
---
 src/view/tree.js | 92 +++++++++++++++++++++++++++++++-----------------
 1 file changed, 60 insertions(+), 32 deletions(-)

diff --git a/src/view/tree.js b/src/view/tree.js
index 657ac10444..e54813de55 100644
--- a/src/view/tree.js
+++ b/src/view/tree.js
@@ -202,6 +202,23 @@
                 this.table.append(this.tfoot);
             }
 
+            if (this.children_field) {
+                this.expander = jQuery('<span/>', {
+                    'class': 'expander',
+                }).append(jQuery('<img/>', {
+                    'tabindex': 0,
+                    'class': 'icon',
+                }));
+                this.update_expander('more');
+                this.expander.on('click keypress',
+                    Sao.common.click_press(this.unfold.bind(this)));
+                Sao.common.ICONFACTORY.get_icon_url(
+                    'tryton-unfold-' + this.expander.action)
+                    .then(function(url) {
+                        this.expander.children().attr('src', url);
+                    }.bind(this));
+            }
+
             this.columns.forEach(function(column, i) {
                 col = jQuery('<col/>', {
                     'class': column.attributes.widget,
@@ -209,23 +226,6 @@
                 th = jQuery('<th/>', {
                     'class': column.attributes.widget,
                 });
-                if ((i === 0) && this.children_field) {
-                    this.expander = jQuery('<img/>', {
-                        'tabindex': 0,
-                        'class': 'icon',
-                    });
-                    this.update_expander('more');
-                    this.expander.on('click keypress',
-                        Sao.common.click_press(this.unfold.bind(this)));
-                    Sao.common.ICONFACTORY.get_icon_url(
-                        'tryton-unfold-' + this.expander.action)
-                        .then(function(url) {
-                            this.expander.attr('src', url);
-                        }.bind(this));
-                    th.append(jQuery('<span>', {
-                        'class': 'expander',
-                    }).append(this.expander));
-                }
                 var label = jQuery('<label/>')
                     .text(column.attributes.string)
                     .attr('title', column.attributes.string);
@@ -327,7 +327,7 @@
             Sao.common.ICONFACTORY.get_icon_url(
                 'tryton-unfold-' + this.expander.action)
                 .then(function(url) {
-                    this.expander.attr('src', url);
+                    this.expander.children().attr('src', url);
                 }.bind(this));
             if (jQuery.isEmptyObject(this.selected_records)) {
                 this.expander.css('visibility', 'hidden');
@@ -797,6 +797,19 @@
                     column.col.show();
                 }
             }.bind(this));
+            if (this.children_field) {
+                this.columns.every(function(column) {
+                    if (column.col.hasClass('draggable-handle') ||
+                        column.header.hasClass('invisible')) {
+                        return true;
+                    } else {
+                        if (this.expander.parent()[0] !== column.header[0]) {
+                            column.header.prepend(this.expander);
+                        }
+                        return false;
+                    }
+                }.bind(this));
+            }
             this.table.css('min-width', 'calc(' + min_width.join(' + ') + ')');
             this.scrollbar.css('min-width', this.table.css('min-width'));
             this.tbody.find('tr.more-row > td').attr(
@@ -1392,6 +1405,18 @@
                 this.select_column(event_.data.index);
             }.bind(this);
 
+            if (this.children_field) {
+                this.expander = jQuery('<span/>', {
+                    'class': 'expander',
+                }).append('<img/>', {
+                    'tabindex': 0,
+                    'class': 'icon',
+                });
+                this.expander.children().html('&nbsp;');
+                this.expander.on('click keypress',
+                        Sao.common.click_press(this.toggle_row.bind(this)));
+            }
+
             for (var i = 0; i < this.tree.columns.length; i++) {
                 var column = this.tree.columns[i];
                 if (column instanceof Sao.View.Tree.ButtonColumn) {
@@ -1419,18 +1444,6 @@
                     'class': 'cell',
                 });
                 td.append(cell);
-                if ((i === 0) && this.children_field) {
-                    this.expander = jQuery('<img/>', {
-                        'tabindex': 0,
-                        'class': 'icon',
-                    });
-                    this.expander.html('&nbsp;');
-                    this.expander.on('click keypress',
-                            Sao.common.click_press(this.toggle_row.bind(this)));
-                    cell.append(jQuery('<span/>', {
-                        'class': 'expander'
-                    }).append(this.expander));
-                }
                 var j;
                 if (column.prefixes) {
                     for (j = 0; j < column.prefixes.length; j++) {
@@ -1543,6 +1556,21 @@
                     }
                 }
             }
+            if (this.children_field) {
+                this.tree.columns.every(function(column, i) {
+                    if (column.col.hasClass('draggable-handle') ||
+                        column.header.hasClass('invisible')) {
+                        return true;
+                    } else {
+                        var td = this._get_column_td(i);
+                        var cell = td.find('.cell');
+                        if (this.expander.parent()[0] !== cell[0]) {
+                            cell.prepend(this.expander);
+                        }
+                        return false;
+                    }
+                }.bind(this));
+            }
             this._drawed_record = this.record.identity;
 
             var row_id_path = this.get_id_path();
@@ -1553,7 +1581,7 @@
                 if (Sao.i18n.rtl) {
                     margin = 'margin-right';
                 }
-                this.expander.css(margin, (depth - 1) + 'em');
+                this.expander.children().css(margin, (depth - 1) + 'em');
 
                 var update_expander = function() {
                     var length = this.record.field_get_client(
@@ -1617,7 +1645,7 @@
             }
             Sao.common.ICONFACTORY.get_icon_url(icon)
                 .then(function(url) {
-                    this.expander.attr('src', url);
+                    this.expander.children().attr('src', url);
                 }.bind(this));
         },
         collapse_children: function() {