chore: Add lazy loading for UI elements in split view

src/browser/base/content/ZenViewSplitter.mjs

@@ -1,19 +1,78 @@
 
 var gZenViewSplitter = {
   init() {
+    this.initializeUI();
     console.log(gZenSplitViewsBase)
   },
 
-  onLocationChange(browser) {
+  initializeUI() {
+    this.initializeUpdateContextMenuItems();
+    this.initializeTabContextMenu();
   },
 
-  contextCanSplitTabs() {
+  initializeTabContextMenu() {
+    const fragment = window.MozXULElement.parseXULToFragment(`
+      <menuseparator/>
+      <menuitem id="context_zenSplitTabs"
+                data-lazy-l10n-id="tab-zen-split-tabs"
+                oncommand="gZenViewSplitter.contextSplitTabs();"/>
+    `);
+    document.getElementById("tabContextMenu").appendChild(fragment);
+  },
+
+  /**
+   * context menu item display update
+   */
+  initializeUpdateContextMenuItems() {
+    const contentAreaContextMenu = document.getElementById("tabContextMenu");
+    const tabCountInfo = JSON.stringify({
+      tabCount:
+        (window.gContextMenu?.contextTab.multiselected &&
+          window.gBrowser.multiSelectedTabsCount) ||
+        1,
+    });
+
+    contentAreaContextMenu.addEventListener("popupshowing", () => {
+      document
+        .getElementById("context_zenSplitTabs")
+        .setAttribute("data-l10n-args", tabCountInfo);
+      document.getElementById("context_zenSplitTabs").disabled =
+        !this.contextCanSplitTabs();
+    });
+  },
+
+  onLocationChange(browser) {
+    gZenSplitViewsBase.onLocationChange(browser);
   },
 
   openSplitViewPanel(event) {
   },
 
+  contextCanSplitTabs() {
+    let tabs = window.gBrowser.selectedTabs;
+    if (tabs.length < 2) {
+      return false;
+    }
+    // Check if there are 2 tabs in different groups
+    // Or if all the selected tabs are in the same group
+    let group = gZenSplitViewsBase.getTabView(tabs[0]);
+    for (let i = 1; i < tabs.length; i++) {
+      // Check if they are not in the same group, but we do allow
+      // if they are ungrouped
+      let tabGroup = gZenSplitViewsBase.getTabView(tabs[i]);
+      if (tabGroup === -1) {
+        continue;
+      }
+      if (group !== tabGroup) {
+        return false;
+      }
+    }
+    return true;
+  },
+
   contextSplitTabs() {
+    let selectedTabs = gBrowser.selectedTabs;
+    
   },
 };
 

src/browser/base/content/main-popupset-inc-xhtml.patch

@@ -1,21 +1,8 @@
 diff --git a/browser/base/content/main-popupset.inc.xhtml b/browser/base/content/main-popupset.inc.xhtml
-index ef8245938ea669227c255d85422a26b99cb2290b..48c061796072e976a45f7bd0ca1c8b3913728fc7 100644
+index a2725d45b2c40ee9c718142dd48e22985adfdbd6..888c91058b3266e5a17aea98f7efaee2d11ec9e5 100644
 --- a/browser/base/content/main-popupset.inc.xhtml
 +++ b/browser/base/content/main-popupset.inc.xhtml
-@@ -80,6 +80,12 @@
+@@ -169,6 +169,10 @@
-     <menuitem id="context_closeDuplicateTabs"
-               data-lazy-l10n-id="tab-context-close-duplicate-tabs"
-               oncommand="gBrowser.removeDuplicateTabs(TabContextMenu.contextTab);"/>
-+    <menuseparator/>
-+    <menuitem id="context_zenSplitTabs"
-+              data-lazy-l10n-id="tab-zen-split-tabs"
-+              data-l10n-args='{"tabCount": 1}'
-+              oncommand="gZenViewSplitter.contextSplitTabs();"/>
-+    <menuseparator/>
-     <menu id="context_closeTabOptions"
-           data-lazy-l10n-id="tab-context-close-multiple-tabs">
-       <menupopup id="closeTabOptions">
-@@ -169,6 +175,10 @@
             hidden="true"
             tabspecific="true"
             aria-labelledby="editBookmarkPanelTitle">
@@ -26,7 +13,7 @@ index ef8245938ea669227c255d85422a26b99cb2290b..48c061796072e976a45f7bd0ca1c8b39
        <box class="panel-header">
          <html:h1>
            <html:span id="editBookmarkPanelTitle"/>
-@@ -191,12 +201,14 @@
+@@ -191,12 +195,14 @@
                    class="footer-button"
                    data-l10n-id="bookmark-panel-save-button"
                    default="true"
@@ -41,7 +28,7 @@ index ef8245938ea669227c255d85422a26b99cb2290b..48c061796072e976a45f7bd0ca1c8b39
      </panel>
    </html:template>
  
-@@ -514,6 +526,8 @@
+@@ -523,6 +529,8 @@
  
  #include popup-notifications.inc
  

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

@@ -1,5 +1,5 @@
 diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js
-index 2674dc2bebf436529a46d45c52cb56e86b82c03f..960c0039cd511a9d2c78e2a0c8c78080464950ee 100644
+index 2674dc2bebf436529a46d45c52cb56e86b82c03f..06d30b3e33562d8eaa04522d3719728126c59a81 100644
 --- a/browser/components/tabbrowser/content/tabbrowser.js
 +++ b/browser/components/tabbrowser/content/tabbrowser.js
 @@ -3208,6 +3208,11 @@
@@ -25,15 +25,3 @@ index 2674dc2bebf436529a46d45c52cb56e86b82c03f..960c0039cd511a9d2c78e2a0c8c78080
            if (select) {
              tabToSelect = tab;
            }
-@@ -7878,6 +7887,11 @@ var TabContextMenu = {
-       this.contextTab.linkedBrowser,
-       document.getElementById("context_sendTabToDevice")
-     );
-+
-+    document
-+      .getElementById("context_zenSplitTabs")
-+      .setAttribute("data-l10n-args", tabCountInfo);
-+    document.getElementById("context_zenSplitTabs").disabled = !gZenViewSplitter.contextCanSplitTabs();
-   },
- 
-   handleEvent(aEvent) {