Merge pull request #10890 from nextcloud/bugfix/10857/app-menu-resize

Fix app menu calculation for random size of the right header

2 files changed, 9 insertions, 4 deletions

diff --git a/core/js/js.js b/core/js/js.js
index fd6e0a68da5..026cc6bb0d6 100644
--- a/core/js/js.js
+++ b/core/js/js.js
@@ -1562,13 +1562,14 @@ function initCore() {
 
 	var resizeMenu = function() {
 		var appList = $('#appmenu li');
-		var headerWidth = $('.header-left').outerWidth() - $('#nextcloud').outerWidth();
+		var rightHeaderWidth = $('.header-right').outerWidth();
+		var headerWidth = $('header').outerWidth();
 		var usePercentualAppMenuLimit = 0.33;
 		var minAppsDesktop = 8;
-		var availableWidth = headerWidth - $(appList).width();
+		var availableWidth =  headerWidth - $('#nextcloud').outerWidth() - (rightHeaderWidth > 210 ? rightHeaderWidth : 210)
 		var isMobile = $(window).width() < 768;
 		if (!isMobile) {
-			availableWidth = headerWidth * usePercentualAppMenuLimit;
+			availableWidth = availableWidth * usePercentualAppMenuLimit;
 		}
 		var appCount = Math.floor((availableWidth / $(appList).width()));
 		if (isMobile && appCount > minAppsDesktop) {
@@ -1613,7 +1614,7 @@ function initCore() {
 		}
 	};
 	$(window).resize(resizeMenu);
-	resizeMenu();
+	setTimeout(resizeMenu, 0);
 
 	// just add snapper for logged in users
 	if($('#app-navigation').length && !$('html').hasClass('lte9')) {
diff --git a/core/js/tests/specs/coreSpec.js b/core/js/tests/specs/coreSpec.js
index 67b7d77be6c..63c02048a34 100644
--- a/core/js/tests/specs/coreSpec.js
+++ b/core/js/tests/specs/coreSpec.js
@@ -573,6 +573,10 @@ describe('Core base tests', function() {
 		});
 		it('Clicking menu toggle toggles navigation in', function() {
 			window.initCore();
+			// fore show more apps icon since otherwise it would be hidden since no icons are available
+			clock.tick(1 * 1000);
+			$('#more-apps').show();
+			
 			expect($navigation.is(':visible')).toEqual(false);
 			$toggle.click();
 			clock.tick(1 * 1000);