Merge branch 'dev' into new-onboarding

src/browser/base/content/ZenStartup.mjs

@@ -87,7 +87,7 @@
     _initSidebarScrolling() {
       // Disable smooth scroll
       const canSmoothScroll = Services.prefs.getBoolPref('zen.startup.smooth-scroll-in-tabs', false);
-      const tabsWrapper = document.getElementById('zen-browser-tabs-wrapper');
+      const tabsWrapper = document.getElementById('zen-tabs-wrapper');
       gBrowser.tabContainer.addEventListener('wheel', (event) => {
         if (canSmoothScroll) return;
         event.preventDefault(); // Prevent the smooth scroll behavior

src/browser/base/content/ZenUIManager.mjs

@@ -63,7 +63,7 @@ var gZenUIManager = {
     if (this._tabsWrapper) {
       return this._tabsWrapper;
     }
-    this._tabsWrapper = document.getElementById('zen-browser-tabs-wrapper');
+    this._tabsWrapper = document.getElementById('zen-tabs-wrapper');
     return this._tabsWrapper;
   },
 
@@ -241,9 +241,7 @@ var gZenVerticalTabsManager = {
     window.addEventListener('customizationstarting', this._preCustomize.bind(this));
     window.addEventListener('aftercustomization', this._postCustomize.bind(this));
 
-    window.addEventListener('DOMContentLoaded', updateEvent, { once: true });
-
-    const tabs = document.getElementById('tabbrowser-tabs');
+    window.addEventListener('MozAfterPaint', updateEvent, { once: true });
 
     if (!this.isWindowsStyledButtons) {
       document.documentElement.setAttribute('zen-window-buttons-reversed', true);

src/browser/base/content/navigator-toolbox-inc-xhtml.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml
-index a0a382643a2f74b6d789f3641ef300eed202d5e9..fd60aceee18e22d40c7d86506408803e3f4ffd45 100644
+index a0a382643a2f74b6d789f3641ef300eed202d5e9..7a2be5fe6cdecb771ce3326008085ae402a465de 100644
 --- a/browser/base/content/navigator-toolbox.inc.xhtml
 +++ b/browser/base/content/navigator-toolbox.inc.xhtml
 @@ -2,7 +2,7 @@
@@ -46,7 +46,7 @@ index a0a382643a2f74b6d789f3641ef300eed202d5e9..fd60aceee18e22d40c7d86506408803e
                stopwatchid="FX_TAB_CLICK_MS">
 +<html:div id="zen-essentials-container" skipintoolbarset="true"></html:div>
 +<hbox id="zen-current-workspace-indicator-container"></hbox>
-+<html:div id="zen-browser-tabs-wrapper">
++<html:div id="zen-tabs-wrapper">
 +<html:div id="zen-browser-tabs-container">
            <hbox class="tab-drop-indicator" hidden="true"/>
  # If the name (tabbrowser-arrowscrollbox) or structure of this changes

src/browser/base/content/navigator-toolbox-js.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/base/content/navigator-toolbox.js b/browser/base/content/navigator-toolbox.js
-index 64ded8fb2c08f1dbfec8fe08ab427a24b53f1169..3434a833c4d1220554b4df6eeeed83f500c6f812 100644
+index 64ded8fb2c08f1dbfec8fe08ab427a24b53f1169..9e1e888554279b6e1df3bc1cb907afd2ccb330ca 100644
 --- a/browser/base/content/navigator-toolbox.js
 +++ b/browser/base/content/navigator-toolbox.js
 @@ -8,7 +8,7 @@
@@ -15,7 +15,7 @@ index 64ded8fb2c08f1dbfec8fe08ab427a24b53f1169..3434a833c4d1220554b4df6eeeed83f5
          #reload-button ,
          #urlbar-go-button,
          #reader-mode-button,
-+        #zen-browser-tabs-wrapper,
++        #zen-tabs-wrapper,
          #picture-in-picture-button,
          #shopping-sidebar-button,
          #urlbar-zoom-button,
@@ -23,7 +23,7 @@ index 64ded8fb2c08f1dbfec8fe08ab427a24b53f1169..3434a833c4d1220554b4df6eeeed83f5
          case "vertical-tabs-newtab-button":
          case "tabs-newtab-button":
          case "new-tab-button":
-+        case "zen-browser-tabs-wrapper":
++        case "zen-tabs-wrapper":
            gBrowser.handleNewTabMiddleClick(element, event);
            break;
  

src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css

@@ -365,7 +365,7 @@
   }
 }
 
-#zen-browser-tabs-wrapper {
+#zen-tabs-wrapper {
   min-height: fit-content;
   overflow-y: auto;
   height: 100%;

src/browser/base/zen-components/ZenPinnedTabManager.mjs

@@ -69,7 +69,9 @@
         return;
       }
 
-      await this._refreshPinnedTabs(newWorkspace, { init: onInit });
+      if (onInit) {
+        await this._refreshPinnedTabs(newWorkspace, { init: onInit });
+      }
     }
 
     log(message) {
@@ -152,7 +154,7 @@
       const pinsToCreate = new Set(pins.map((p) => p.uuid));
 
       // First pass: identify existing tabs and remove those without pins
-      for (let tab of gBrowser.tabs) {
+      for (let tab of ZenWorkspaces.allStoredTabs) {
         const pinId = tab.getAttribute('zen-pin-id');
         if (!pinId) {
           continue;
@@ -178,10 +180,6 @@
           continue; // Skip pins that already have tabs
         }
 
-        if (!this._shouldShowPin(pin, currentWorkspace, workspaces)) {
-          continue; // Skip pins not relevant to current workspace
-        }
-
         let params = {
           skipAnimation: true,
           allowInheritPrincipal: false,
@@ -234,6 +232,12 @@
 
         this.log(`Created new pinned tab for pin ${pin.uuid} (isEssential: ${pin.isEssential})`);
         gBrowser.pinTab(newTab);
+        if (!pin.isEssential) {
+          const contaienr = document.querySelector(
+            `#vertical-pinned-tabs-container .zen-workspace-tabs-section[zen-workspace-id="${pin.workspaceUuid}"]`
+          );
+          contaienr.insertBefore(newTab, contaienr.lastChild);
+        }
 
         newTab.initialize();
       }
@@ -246,43 +250,6 @@
       gBrowser._updateTabBarForPinnedTabs();
     }
 
-    _shouldShowPin(pin, currentWorkspace, workspaces) {
-      const isEssential = pin.isEssential;
-      const pinWorkspaceUuid = pin.workspaceUuid;
-      const pinContextId = pin.containerTabId ? pin.containerTabId.toString() : '0';
-      const workspaceContextId = currentWorkspace.containerTabId?.toString() || '0';
-      const containerSpecificEssentials = ZenWorkspaces.containerSpecificEssentials;
-
-      // Handle essential pins
-      if (isEssential) {
-        if (!containerSpecificEssentials) {
-          return true; // Show all essential pins when containerSpecificEssentials is false
-        }
-
-        if (workspaceContextId !== '0') {
-          // In workspaces with default container: Show essentials that match the container
-          return pinContextId === workspaceContextId;
-        } else {
-          // In workspaces without a default container: Show essentials that aren't in container-specific workspaces
-          // or have userContextId="0" or no userContextId
-          return (
-            !pinContextId ||
-            pinContextId === '0' ||
-            !workspaces.workspaces.some((workspace) => workspace.containerTabId === parseInt(pinContextId, 10))
-          );
-        }
-      }
-
-      // For non-essential pins
-      if (!pinWorkspaceUuid) {
-        // Pins without a workspace belong to all workspaces (if that's your desired behavior)
-        return true;
-      }
-
-      // Show if pin belongs to current workspace
-      return pinWorkspaceUuid === currentWorkspace.uuid;
-    }
-
     _onPinnedTabEvent(action, event) {
       if (!this.enabled) return;
       const tab = event.target;
@@ -675,7 +642,7 @@
         }
       }
       // Check for normal tabs container
-      else if (tabsTarget || event.target.id === 'zen-browser-tabs-wrapper') {
+      else if (tabsTarget || event.target.id === 'zen-tabs-wrapper') {
         if (draggedTab.pinned && !draggedTab.hasAttribute('zen-essential')) {
           gBrowser.unpinTab(draggedTab);
           moved = true;

src/browser/base/zen-components/ZenPinnedTabsStorage.mjs

@@ -46,7 +46,6 @@ var ZenPinnedTabsStorage = {
         CREATE INDEX IF NOT EXISTS idx_zen_pins_changes_uuid ON zen_pins_changes(uuid)
       `);
 
-      await SessionStore.promiseInitialized;
       this._resolveInitialized();
     });
   },

src/browser/base/zen-components/ZenWorkspaces.mjs

@@ -28,13 +28,17 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     this._resolvePinnedInitialized = resolve;
   });
 
+  promiseSectionsInitialized = new Promise((resolve) => {
+    this._resolveSectionsInitialized = resolve;
+  });
+
   workspaceIndicatorXUL = `
     <hbox class="zen-current-workspace-indicator-icon"></hbox>
     <hbox class="zen-current-workspace-indicator-name"></hbox>
   `;
 
   async waitForPromises() {
-    await Promise.all([this.promiseDBInitialized, this.promisePinnedInitialized, SessionStore.promiseAllWindowsRestored]);
+    await Promise.all([this.promiseDBInitialized, this.promisePinnedInitialized]);
   }
 
   async init() {
@@ -75,18 +79,25 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     );
     ChromeUtils.defineLazyGetter(this, 'tabContainer', () => document.getElementById('tabbrowser-tabs'));
     this._activeWorkspace = Services.prefs.getStringPref('zen.workspaces.active', '');
-    this._delayedStartup();
+    await SessionStore.promiseInitialized;
+    if (!this._hasInitializedTabsStrip) {
+      await this.delayedStartup();
+    }
+    await this.promiseSectionsInitialized;
+    window.addEventListener(
+      'MozAfterPaint',
+      async () => {
+        await SessionStore.promiseAllWindowsRestored;
+        await this.afterLoadInit();
+      },
+      { once: true }
+    );
   }
 
-  async _delayedStartup() {
-    if (!this.workspaceEnabled) {
-      return;
-    }
-    this._pinnedTabsResizeObserver = new ResizeObserver(this.onPinnedTabsResize.bind(this));
-    await this.waitForPromises();
-    await this.initializeWorkspaces();
+  async afterLoadInit() {
     console.info('ZenWorkspaces: ZenWorkspaces initialized');
 
+    await this.initializeWorkspaces();
     if (Services.prefs.getBoolPref('zen.workspaces.swipe-actions', false) && this.workspaceEnabled) {
       this.initializeGestureHandlers();
       this.initializeWorkspaceNavigation();
@@ -103,6 +114,16 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     );
   }
 
+  async delayedStartup() {
+    if (!this.workspaceEnabled) {
+      return;
+    }
+    this._pinnedTabsResizeObserver = new ResizeObserver(this.onPinnedTabsResize.bind(this));
+    await this.waitForPromises();
+    await this.initializeTabsStripSections();
+    this._resolveSectionsInitialized();
+  }
+
   registerPinnedResizeObserver() {
     if (!this._hasInitializedTabsStrip) {
       return;
@@ -117,7 +138,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   get activeWorkspaceStrip() {
-    if (!this.workspaceEnabled || !this._hasInitializedTabsStrip) {
+    if (!this._hasInitializedTabsStrip) {
       return gBrowser.tabContainer.arrowScrollbox;
     }
     const activeWorkspace = this.activeWorkspace;
@@ -147,7 +168,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
 
   async initializeTabsStripSections() {
     const perifery = document.getElementById('tabbrowser-arrowscrollbox-periphery');
-    const tabs = gBrowser.tabContainer.allTabs.filter((tab) => !tab.pinned);
+    const tabs = gBrowser.tabContainer.allTabs;
     const workspaces = await this._workspaces();
     for (const workspace of workspaces.workspaces) {
       this._createWorkspaceTabsSection(workspace, tabs, perifery);
@@ -156,11 +177,17 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
       const defaultSelectedContainer = document.querySelector(
         `#tabbrowser-arrowscrollbox .zen-workspace-tabs-section[zen-workspace-id="${this.activeWorkspace}"]`
       );
+      const pinnedContainer = document.querySelector(
+        `#vertical-pinned-tabs-container .zen-workspace-tabs-section[zen-workspace-id="${this.activeWorkspace}"]`
+      );
       for (const tab of tabs) {
+        if (tab.pinned) {
+          pinnedContainer.insertBefore(tab, pinnedContainer.lastChild);
+          continue;
+        }
         // before to the last child (perifery)
         defaultSelectedContainer.insertBefore(tab, defaultSelectedContainer.lastChild);
       }
-      this.tabContainer._invalidateCachedTabs();
     }
     perifery.setAttribute('hidden', 'true');
     this._hasInitializedTabsStrip = true;
@@ -210,7 +237,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
         section.appendChild(tab);
       }
     }
-    this.tabContainer._invalidateCachedTabs();
   }
 
   initializeWorkspaceNavigation() {
@@ -512,7 +538,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
       await this.workspaceBookmarks();
       window.addEventListener('TabBrowserInserted', this.onTabBrowserInserted.bind(this));
       window.addEventListener('TabOpen', this.updateTabsContainers.bind(this));
-      window.addEventListener('TabClose', this.updateTabsContainers.bind(this));
       let workspaces = await this._workspaces();
       let activeWorkspace = null;
       if (workspaces.workspaces.length === 0) {
@@ -528,11 +553,11 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
           this.activeWorkspace = activeWorkspace?.uuid;
         }
       }
-      await this.initializeTabsStripSections();
       try {
         if (activeWorkspace) {
           window.gZenThemePicker = new ZenThemePicker();
           await this.changeWorkspace(activeWorkspace, { onInit: true });
+          gBrowser.tabContainer._positionPinnedTabs();
         }
       } catch (e) {
         console.error('ZenWorkspaces: Error initializing theme picker', e);
@@ -1335,8 +1360,10 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     let tab = gZenUIManager.openAndChangeToTab(BROWSER_NEW_TAB_URL);
 
     if (window.uuid) {
-      this.moveTabToWorkspace(tab, window.uuid);
+      tab.setAttribute('zen-workspace-id', window.uuid);
     }
+
+    return tab;
   }
 
   async saveWorkspaceFromCreate() {
@@ -1401,8 +1428,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     if (!this.workspaceEnabled || this._inChangingWorkspace) {
       return;
     }
-
-    await SessionStore.promiseInitialized;
     this._inChangingWorkspace = true;
     try {
       await this._performWorkspaceChange(window, ...args);
@@ -1648,10 +1673,10 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
 
     gZenThemePicker.onWorkspaceChange(window);
 
-    document.getElementById('zen-browser-tabs-wrapper').style.scrollbarWidth = 'none';
+    document.getElementById('zen-tabs-wrapper').style.scrollbarWidth = 'none';
     await this._animateTabs(window, !onInit && !this._animatingChange, tabToSelect);
     await this._organizeWorkspaceStripLocations(window, true);
-    document.getElementById('zen-browser-tabs-wrapper').style.scrollbarWidth = '';
+    document.getElementById('zen-tabs-wrapper').style.scrollbarWidth = '';
 
     // Notify listeners
     if (this._changeListeners?.length) {
@@ -1742,7 +1767,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   onPinnedTabsResize(entries) {
-    if (!this.workspaceEnabled || !this._hasInitializedTabsStrip) {
+    if (!this._hasInitializedTabsStrip) {
       return;
     }
     for (const entry of entries) {
@@ -1790,7 +1815,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
       }
 
       // Switch workspace if needed
-      if (workspaceID && workspaceID !== activeWorkspace.uuid) {
+      if (workspaceID && workspaceID !== activeWorkspace.uuid && parent.ZenWorkspaces._hasInitializedTabsStrip) {
         await parent.ZenWorkspaces.changeWorkspace({ uuid: workspaceID });
       }
     }