apps-menu: Use customized layout manager to limit height

To avoid continuous height changes while browsing through categories,
we let the list of categories determine the overall height, and rely
on scrolling for the list of apps within a category.

We currently achieve this by assigning a fixed height via the
`style` property. This has been found to trigger a crash when
running headless, as we end up querying an actor's height request
before a valid resource scale is available.

Instead, use a custom layout manager, which seems more elegant anyway.

Close: https://gitlab.gnome.org/GNOME/gnome-shell-extensions/-/issues/472
Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell-extensions/-/merge_requests/290>
(cherry picked from commit 5652182fb3)

extensions/apps-menu/extension.js

@@ -363,6 +363,20 @@ class DesktopTarget extends EventEmitter {
     }
 }
 
+class MainLayout extends Clutter.BoxLayout {
+    static {
+        GObject.registerClass(this);
+    }
+
+    vfunc_get_preferred_height(container, forWidth) {
+        const [mainChild] = container;
+        const [minHeight, natHeight] =
+            mainChild.get_preferred_height(forWidth);
+
+        return [minHeight, natHeight + MENU_HEIGHT_OFFSET];
+    }
+}
+
 class ApplicationsButton extends PanelMenu.Button {
     static {
         GObject.registerClass(this);
@@ -530,7 +544,7 @@ class ApplicationsButton extends PanelMenu.Button {
     _createLayout() {
         let section = new PopupMenu.PopupMenuSection();
         this.menu.addMenuItem(section);
-        this.mainBox = new St.BoxLayout({vertical: false});
+        this.mainBox = new St.BoxLayout({layoutManager: new MainLayout()});
         this.leftBox = new St.BoxLayout({vertical: true});
         this.applicationsScrollBox = new St.ScrollView({
             style_class: 'apps-menu vfade',
@@ -594,12 +608,6 @@ class ApplicationsButton extends PanelMenu.Button {
 
         // Load applications
         this._displayButtons(this._listApplications(null));
-
-        let themeContext = St.ThemeContext.get_for_stage(global.stage);
-        let scaleFactor = themeContext.scale_factor;
-        let categoriesHeight = this.categoriesBox.height / scaleFactor;
-        let height = Math.round(categoriesHeight) + MENU_HEIGHT_OFFSET;
-        this.mainBox.style += `height: ${height}px`;
     }
 
     selectCategory(dir) {