desktop/src/browser/components/tabbrowser/content/tabs-js.patch

diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
index 258b9627aaa8a1d26e8aeb987a0b4c67bc1b7abc..97badc8daa59b38862706d05ad3db5d53fbe1155 100644
--- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js
@@ -411,7 +411,7 @@
       // and we're not hitting the scroll buttons.
       if (
         event.button != 0 ||
-        event.target != this.arrowScrollbox ||
+        !event.target.classList.contains("zen-workspace-empty-space") ||
         event.composedTarget.localName == "toolbarbutton"
       ) {
         return;
@@ -492,7 +492,6 @@
             });
           }
         } else if (isTabGroupLabel(event.target)) {
-          event.target.group.saveAndClose();
         } else if (
           event.originalTarget.closest("scrollbox") &&
           !Services.prefs.getBoolPref(
@@ -528,6 +527,9 @@
     }
 
     on_keydown(event) {
+      if (document.documentElement.getAttribute('zen-renaming-tab') === 'true') {
+        return;
+      }
       let { altKey, shiftKey } = event;
       let [accel, nonAccel] =
         AppConstants.platform == "macosx"
@@ -720,7 +722,6 @@
 
       this.toggleAttribute("overflow", true);
       this._updateCloseButtons();
-      this._handleTabSelect(true);
 
       document
         .getElementById("tab-preview-panel")
@@ -780,7 +781,7 @@
     }
 
     get newTabButton() {
-      return this.querySelector("#tabs-newtab-button");
+      return gZenWorkspaces.activeWorkspaceStrip.querySelector("#tabs-newtab-button");
     }
 
     get verticalMode() {
@@ -796,6 +797,7 @@
     }
 
     get overflowing() {
+      gZenWorkspaces.updateOverflowingTabs();
       return this.hasAttribute("overflow");
     }
 
@@ -809,29 +811,54 @@
       if (pinnedChildren?.at(-1)?.id == "pinned-tabs-container-periphery") {
         pinnedChildren.pop();
       }
-      let unpinnedChildren = Array.from(this.arrowScrollbox.children);
+      let unpinnedChildren = gZenWorkspaces.tabboxChildren;
       // remove arrowScrollbox periphery element.
       unpinnedChildren.pop();
 
       // explode tab groups and split view wrappers
       // Iterate backwards over the array to preserve indices while we modify
       // things in place
-      for (let i = unpinnedChildren.length - 1; i >= 0; i--) {
-        if (
-          unpinnedChildren[i].tagName == "tab-group" ||
-          unpinnedChildren[i].tagName == "tab-split-view-wrapper"
-        ) {
-          unpinnedChildren.splice(i, 1, ...unpinnedChildren[i].tabs);
+      const pinnedTabs = [...gZenWorkspaces.getCurrentEssentialsContainer().children, ...pinnedChildren];
+      const expandTabs = (tabs) => {
+        for (let i = tabs.length - 1; i >= 0; i--) {
+          const tab = tabs[i];
+          if (isTabGroup(tab)) {
+            // remove the group from the list
+            tabs.splice(i, 1);
+            // add the tabs in the group to the list
+            tabs.splice(i, 0, ...tab.tabs);
+          }
+        }
+      };
+      expandTabs(pinnedTabs);
+      expandTabs(unpinnedChildren);
+      const allTabs = [
+        ...pinnedTabs,
+        ...unpinnedChildren,
+      ];
+      const lastPinnedTabIdx = pinnedTabs.length - 1;
+      let i = 0;
+      for (const tab of [...allTabs]) {
+        // add glance tabs (tabs inside tabs) to the list
+        const glanceTab = tab.glanceTab;
+        if (glanceTab) {
+          // insert right after the parent tab. note: it must be inserted before
+          // the last pinned tab so it can be inserted in the correct order
+          allTabs.splice(Math.max(i++ + 1, lastPinnedTabIdx), 0, glanceTab);
+        } else if (tab.classList.contains("pinned-tabs-container-separator")) {
+          // remove the separator from the list
+          allTabs.splice(i, 1);
+          i--;
         }
+        i++;
       }
-
-      this.#allTabs = [...pinnedChildren, ...unpinnedChildren];
+      this.#allTabs = allTabs;
       return this.#allTabs;
     }
 
     get allGroups() {
       let children = Array.from(this.arrowScrollbox.children);
-      return children.filter(node => node.tagName == "tab-group");
+      return gZenWorkspaces.allTabGroups;
     }
 
     /**
@@ -964,6 +991,7 @@
     _invalidateCachedTabs() {
       this.#allTabs = null;
       this._invalidateCachedVisibleTabs();
+      gZenWorkspaces._allStoredTabs = null;
     }
 
     _invalidateCachedVisibleTabs() {
@@ -1067,7 +1095,7 @@
 
       if (node == null) {
         // We have a container for non-tab elements at the end of the scrollbox.
-        node = this.arrowScrollbox.lastChild;
+        node = gZenWorkspaces.activeWorkspaceStrip.lastChild;
       }
 
       node.before(tab);
@@ -1162,7 +1190,7 @@
           // There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and
           // for when the tab strip is overflowed (which is shared by vertical and horizontal tabs);
           // Attach the long click popup to all of them.
-          const newTab = document.getElementById("new-tab-button");
+          const newTab = gZenWorkspaces.activeWorkspaceStrip.querySelector("#tabs-newtab-button");
           const newTab2 = this.newTabButton;
           const newTabVertical = document.getElementById(
             "vertical-tabs-newtab-button"
@@ -1263,8 +1291,10 @@
      */
     _handleTabSelect(aInstant) {
       let selectedTab = this.selectedItem;
+      if (!selectedTab) return;
       this.#ensureTabIsVisible(selectedTab, aInstant);
 
+      gZenCompactModeManager.flashSidebarIfNecessary(aInstant);
       selectedTab._notselectedsinceload = false;
     }
 
@@ -1273,7 +1303,7 @@
      * @param {boolean} [shouldScrollInstantly=false]
      */
     #ensureTabIsVisible(tab, shouldScrollInstantly = false) {
-      let arrowScrollbox = tab.closest("arrowscrollbox");
+      let arrowScrollbox = this.arrowScrollbox;
       if (arrowScrollbox?.overflowing) {
         arrowScrollbox.ensureElementIsVisible(tab, shouldScrollInstantly);
       }