[WebProfilerBundle] Update main menu to display active panels first

javiereguiluz · fabpot · commit 05e9192ae2fc · 2024-03-28T16:48:26.000+01:00
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/base_js.html.twig
@@ -11,13 +11,32 @@
 
     class SymfonyProfiler {
         constructor() {
+            this.#reorderMainMenuItems();
             this.#createTabs();
             this.#createTableSearchFields();
             this.#createToggles();
             this.#createCopyToClipboard();
             this.#convertDateTimesToUserTimezone();
         }
 
+        #reorderMainMenuItems() {
+            /* reorder the main menu items to always display first the non-disabled items */
+            const mainMenuElement = document.querySelector('#menu-profiler');
+            const firstDisabledMenuItem = mainMenuElement.querySelector('li a > span.disabled')?.parentNode?.parentNode;
+
+            if (!firstDisabledMenuItem) {
+                return;
+            }
+
+            const mainMenuItems = mainMenuElement.querySelectorAll('li');
+            mainMenuItems.forEach(menuItem => {
+                const isDisabled = null !== menuItem.querySelector('a > span.disabled');
+                if (!isDisabled) {
+                    mainMenuElement.insertBefore(menuItem, firstDisabledMenuItem);
+                }
+            });
+        }
+
         #createTabs() {
             /* the accessibility options of this component have been defined according to: */
             /* www.w3.org/WAI/ARIA/apg/example-index/tabs/tabs-manual.html */
