Add feature: Split New tab on Right with URL focus using shortcut (As seen on Arc Browser)

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

@@ -756,7 +756,7 @@ class ZenKeyboardShortcutsLoader {
 }
 
 class ZenKeyboardShortcutsVersioner {
-  static LATEST_KBS_VERSION = 8;
+  static LATEST_KBS_VERSION = 9;
 
   constructor() {}
 
@@ -937,6 +937,21 @@ class ZenKeyboardShortcutsVersioner {
         )
       );
     }
+    if (version < 9) {
+      // Migrate from 8 to 9
+      // In this new version, we add the "Add a Split New Tab to the Right" shortcut
+      data.push(
+        new KeyShortcut(
+          'zen-split-view-new-tab-to-right',
+          '+',
+          '',
+          ZEN_SPLIT_VIEW_SHORTCUTS_GROUP,
+          KeyShortcutModifiers.fromObject({ accel: true, shift: true }),
+          'code:gZenViewSplitter.createSplitNewTabToRight()',
+          'zen-split-view-shortcut-add-new-tab-to-right'
+        )
+      );
+    }
     return data;
   }
 }

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

@@ -1506,6 +1506,74 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     this.splitTabs(selected_tabs, gridType);
   }
 
+  /**
+   * Creates a vertical split with a new tab and focuses the URL bar
+   * Used for Ctrl+Shift+'+' shortcut
+   * Can be called repeatedly to add more tabs to the right
+   */
+  createSplitNewTabToRight() {
+    const currentTab = window.gBrowser.selectedTab;
+
+    if (currentTab.splitView) {
+      const groupIndex = this._data.findIndex((group) => group.tabs.includes(currentTab));
+      if (groupIndex >= 0) {
+        const group = this._data[groupIndex];
+        if (group.tabs.length < this.MAX_TABS) {
+          const newTab = this.openAndSwitchToTab('about:newtab');
+          group.tabs.push(newTab);
+
+          // Get the root node of the layout tree
+          const rootNode = group.layoutTree;
+
+          // For 'vsep' layout, add the new tab to the right end of the row
+          if (group.gridType === 'vsep' || rootNode.direction === 'row') {
+            // Calculate new sizes for all tabs
+            const newSize = 100 / (rootNode.children.length + 1);
+            const resizeFactor = newSize / (100 / rootNode.children.length);
+
+            // Resize existing tabs
+            rootNode.children.forEach((child) => {
+              child.sizeInParent *= resizeFactor;
+            });
+
+            // Add new tab at the end (not using addChild which puts it at the beginning)
+            const newNode = new SplitLeafNode(newTab, newSize);
+            newNode.parent = rootNode;
+            rootNode.children.push(newNode);
+
+            // Move tab to the group if needed
+            let splitGroup = this._getSplitViewGroup(group.tabs);
+            if (splitGroup) {
+              gBrowser.moveTabToGroup(newTab, splitGroup);
+            }
+
+            // Activate the updated layout
+            this.activateSplitView(group, true);
+
+            window.gBrowser.selectedTab = newTab;
+            window.gURLBar.select();
+            document.getElementById('Browser:OpenLocation').doCommand();
+            return;
+          }
+        }
+      }
+
+      // If we reached the maximum or layout isn't compatible, notify user
+      // (or silently do nothing)
+      return;
+    }
+
+    // First time pressing shortcut - create initial split
+    const newTab = this.openAndSwitchToTab('about:newtab');
+    this.splitTabs([currentTab, newTab], 'vsep');
+
+    window.gBrowser.selectedTab = newTab;
+
+    // Focus the URL bar
+    window.gURLBar.select();
+    document.getElementById('Browser:OpenLocation').doCommand();
+  }
+
   /**
    * @description removes the tab from the split
    * @param container - The container element