From 150caf42e7ac16133ffd7965f42ac8b2e6ed751f Mon Sep 17 00:00:00 2001
From: Julia Radzhabova <Julia.Radzhabova@onlyoffice.com>
Date: Thu, 1 Feb 2024 14:54:51 +0300
Subject: [PATCH] Fix adding custom buttons (more panel, compact buttons)

---
 apps/common/main/lib/component/Mixtbar.js     | 15 ++++++++
 .../main/lib/controller/LayoutManager.js      | 35 ++++++++++++++-----
 2 files changed, 42 insertions(+), 8 deletions(-)

diff --git a/apps/common/main/lib/component/Mixtbar.js b/apps/common/main/lib/component/Mixtbar.js
index d2ecffac2c..8de13dea3f 100644
--- a/apps/common/main/lib/component/Mixtbar.js
+++ b/apps/common/main/lib/component/Mixtbar.js
@@ -398,6 +398,10 @@ define([
                 }
             },
 
+            getMorePanel: function(tab) {
+                return tab && btnsMore[tab] ? btnsMore[tab].panel : null;
+            },
+
             getLastTabIdx: function() {
                 return config.tabs.length;
             },
@@ -459,6 +463,9 @@ define([
                             _.each($active.find('.btn-slot .x-huge'), function(item) {
                                 _btns.push($(item).closest('.btn-slot'));
                             });
+                            btnsMore[data.tab] && btnsMore[data.tab].panel && _.each(btnsMore[data.tab].panel.find('.btn-slot .x-huge'), function(item) {
+                                _btns.push($(item).closest('.btn-slot'));
+                            });
                             data.buttons = _btns;
                         }
                         if (!_flex) {
@@ -593,6 +600,14 @@ define([
                 }
             },
 
+            clearActiveData: function(tab) {
+                var panel = this.$panels.filter('[data-tab=' + tab + ']');
+                if ( panel.length ) {
+                    var data = panel.data();
+                    data.buttons = data.flex = data.rightedge = data.leftedge = undefined;
+                }
+            },
+
             resizeToolbar: function(reset) {
                 var $active = this.$panels.filter('.active'),
                     more_section = $active.find('.more-box');
diff --git a/apps/common/main/lib/controller/LayoutManager.js b/apps/common/main/lib/controller/LayoutManager.js
index 3d0480f0ad..49ea5d8b64 100644
--- a/apps/common/main/lib/controller/LayoutManager.js
+++ b/apps/common/main/lib/controller/LayoutManager.js
@@ -207,9 +207,13 @@ Common.UI.LayoutManager = new(function() {
             }
             */
             if (plugin.tab) {
-                var $panel = _getTab(toolbar, plugin.tab.id, plugin.tab.text) || _getTab(toolbar, 'plugins');
+                var $panel = _getTab(toolbar, plugin.tab.id, plugin.tab.text) || _getTab(toolbar, 'plugins'),
+                    $morepanel = toolbar.getMorePanel(plugin.tab.id),
+                    $moresection = $panel.find('.more-box'),
+                    compactcls = '';
+                ($moresection.length<1) && ($moresection = null);
                 if ($panel) {
-                    plugin.items && plugin.items.forEach(function(item) {
+                    plugin.items && plugin.items.forEach(function(item, index) {
                         var btn = _findCustomButton(toolbar, plugin.tab.id, plugin.guid, item.id),
                             _set = Common.enumLock;
                         if (btn) { // change caption, hint, disable state, menu items
@@ -235,14 +239,27 @@ Common.UI.LayoutManager = new(function() {
                             return;
                         }
 
-                        var _groups = $panel.children().filter('.group'),
-                            _group;
-                        if (_groups.length>0 && !item.separator)
+                        var _groups, _group;
+                        if ($morepanel) {
+                            _groups = $morepanel.children().filter('.group');
+                            if (_groups.length>0) {
+                                $moresection = null;
+                                $panel = $morepanel;
+                                compactcls = 'compactwidth';
+                            }
+                        }
+                        if (!_groups || _groups.length<1)
+                            _groups = $panel.children().filter('.group');
+
+                        if (_groups.length>0 && !item.separator && index>0) // add first item to new group
                             _group = $(_groups[_groups.length-1]);
                         else {
-                            item.separator && $('<div class="separator long"></div>').appendTo($panel);
+                            if (item.separator) {
+                                var el = $('<div class="separator long"></div>');
+                                $moresection ? $moresection.before(el) : el.appendTo($panel);
+                            }
                             _group = $('<div class="group"></div>');
-                            _group.appendTo($panel);
+                            $moresection ? $moresection.before(_group) : _group.appendTo($panel);
                         }
 
                         if (item.type==='button' || item.type==='big-button') {
@@ -276,12 +293,14 @@ Common.UI.LayoutManager = new(function() {
                                     _api && _api.onPluginButtonClick && _api.onPluginButtonClick(b.options.guid, b.options.value, b.pressed);
                                 });
                             }
-                            var $slot = $('<span class="btn-slot text x-huge ' + (!caption ? 'emptycaption' : '') + '"></span>').appendTo(_group);
+                            var $slot = $('<span class="btn-slot text x-huge ' + (!caption ? 'emptycaption ' : ' ') + compactcls + '"></span>').appendTo(_group);
                             btn.render($slot);
                             btns.push(btn);
                             item.disabled && Common.Utils.lockControls(_set.customLock, item.disabled, {array: [btn]});
                         }
                     });
+                    toolbar.clearActiveData(plugin.tab.id);
+                    toolbar.processPanelVisible(null, true, true);
                     if (!toolbar.customButtonsArr)
                         toolbar.customButtonsArr = [];
                     Array.prototype.push.apply(toolbar.customButtonsArr, btns);