clay-server 2.47.0-beta.6 → 3.0.0-beta.2

package/lib/public/modules/app-messages.js

@@ -19,6 +19,8 @@ import { renderKnowledgeList, handleKnowledgeContent } from './mate-knowledge.js
 import { renderMemoryList } from './mate-memory.js';
 import { handlePaletteSessionSwitch, setPaletteVersion } from './command-palette.js';
 import { handleFindInSessionResults } from './session-search.js';
+import { syncPaneTitles, maybeRestoreSplitGroup, openGroup } from './split-view.js';
+import { showPairDialog, handlePairCreated, handleSplitDelegation } from './split-pair-ui.js';
 import { handleInputSync, autoResize, builtinCommands, setScheduleBtnDisabled } from './input.js';
 import { startThinking, appendThinking, stopThinking, resetThinkingGroup, createToolItem, updateToolExecuting, updateToolResult, markAllToolsDone, closeToolGroup, removeToolFromGroup, resetToolState, getTools, getPlanContent, setPlanContent, renderPlanBanner, renderPlanCard, getTodoTools, handleTodoWrite, handleTaskCreate, handleTaskUpdate, applyDeadSessionTodoCompaction, isPlanFilePath, enableMainInput, addTurnMeta, updateSubagentActivity, addSubagentToolEntry, markSubagentDone, initSubagentStop, updateSubagentProgress, updateSubagentTaskStatus, renderAskUserQuestion, markAskUserAnswered, renderPermissionRequest, markPermissionCancelled, markPermissionResolved, renderElicitationRequest, markElicitationResolved, renderUserDialogRequest, markUserDialogResolved, updateThinkingTokens } from './tools.js';
 import { showDoneNotification, playDoneSound, isNotifAlertEnabled, isNotifSoundEnabled } from './notifications.js';
@@ -46,6 +48,7 @@ import { setActivity, startUrgentBlink, stopUrgentBlink, blinkSessionDot, update
 import { setStatus } from './app-connection.js';
 import { handleWhatsNewState, handleWhatsNewSeenResult, setKnownEntries as setWhatsNewKnownEntries } from './whats-new.js';
 import { closeArticle as closeWhatsNewArticle } from './whats-new-article.js';
+import { resolvePaneSession, resolveSwitchedVendor } from './pane-session.js';
 import { getModelEffortLevels, accumulateUsage, updateUsagePanel, accumulateContext, updateContextPanel, renderCtxPopover, updateStatusPanel } from './app-panels.js';
 import { updateProjectList, updateTitleBarProjectIdentity, resetClientState, showUpdateAvailable, handleRemoveProjectCheckResult, handleRemoveProjectResult, handleBrowseDirResult, handleAddProjectResult, handleCloneProgress } from './app-projects.js';
 import { updateHistorySentinel, prependOlderHistory } from './app-header.js';
@@ -549,9 +552,42 @@ export function processMessage(msg) {
       case "session_list":
         renderMateSessionList(msg.sessions || []);
         renderSessionList(msg.sessions || []);
+        syncPaneTitles();
+        var panePin = resolvePaneSession(store.get('paneMode'), store.get('panePinPending'), store.get('paneSessionId'), msg.sessions);
+        if (panePin.consumed) {
+          store.set({ panePinPending: false });
+          if (panePin.sessionId && getWs() && getWs().readyState === 1) {
+            getWs().send(JSON.stringify({ type: "switch_session", id: panePin.sessionId }));
+          }
+        }
         handlePaletteSessionSwitch();
         break;
 
+      case "split_groups":
+        store.set({ splitGroups: msg.groups || [] });
+        renderSessionList(null);
+        maybeRestoreSplitGroup();
+        syncPaneTitles();
+        break;
+
+      case "split_group_result":
+        if (!msg.ok && msg.error) showToast(msg.error, "error");
+        break;
+
+      case "pair_session_options":
+        showPairDialog(msg);
+        break;
+
+      case "pair_session_created":
+        var createdPairGroup = handlePairCreated(msg);
+        if (createdPairGroup) openGroup(createdPairGroup);
+        break;
+
+      case "split_delegation":
+        handleSplitDelegation(msg);
+        syncPaneTitles();
+        break;
+
       case "session_presence":
         updateSessionPresence(msg.presence || {});
         break;
@@ -611,11 +647,14 @@ export function processMessage(msg) {
         var _effectiveTerminalId = (typeof msg.runtimeTerminalId === "number")
           ? msg.runtimeTerminalId
           : (typeof msg.terminalId === "number" ? msg.terminalId : null);
-        store.set({ activeSessionId: msg.id, cliSessionId: msg.cliSessionId || null, vendorCapabilities: msg.capabilities || {}, sessionIsProcessing: !!msg.isProcessing, activeSessionMode: _effectiveMode, activeTerminalId: _effectiveTerminalId, sessionHasHistory: !!msg.hasHistory });
+        store.set({ activeSessionId: msg.id, cliSessionId: msg.cliSessionId || null, currentModel: msg.model || store.get('currentModel'), currentEffort: msg.effort || store.get('currentEffort'), vendorCapabilities: msg.capabilities || {}, sessionIsProcessing: !!msg.isProcessing, activeSessionMode: _effectiveMode, activeTerminalId: _effectiveTerminalId, sessionHasHistory: !!msg.hasHistory, sessionFullAccess: msg.permissionMode === "bypassPermissions", currentMode: msg.permissionMode || store.get('currentMode') });
         // TUI sessions swap the chat UI for an embedded xterm running
         // `claude` inside a real PTY. Mount or tear down before the rest of
         // the chat-side bookkeeping runs so we don't waste work on hidden DOM.
-        if (_effectiveMode === "tui" && typeof _effectiveTerminalId === "number") {
+        // With a split open the native app is hidden behind the pane iframes,
+        // but the TUI host is position:fixed on body -- attaching it here
+        // would overlay the split. Members render inside their own panes.
+        if (_effectiveMode === "tui" && typeof _effectiveTerminalId === "number" && !store.get('splitPanes')) {
           attachTuiView(_effectiveTerminalId, msg.id, msg.vendor || null);
         } else {
           detachTuiView();
@@ -624,9 +663,10 @@ export function processMessage(msg) {
         // (the composer is hidden; clicking Resume spawns claude --resume).
         setTuiSuspendedView(!!msg.tuiSuspended, msg.id);
         if (msg.vendor) {
-          if (!store.get('vendorSelectionLocked') || msg.hasHistory) {
-            store.set({ currentVendor: msg.vendor });
-          }
+          // session_switched is authoritative. The lock rejects stale
+          // model_info responses; it must not block an intentional switch to
+          // a blank session owned by another vendor.
+          store.set({ currentVendor: resolveSwitchedVendor(store.get('currentVendor'), msg.vendor) });
           // Sessions with history have their vendor structurally bound to
           // the session: lock so a late-arriving default-adapter model_info
           // can't flip the UI back. Previously this branch unlocked, which
@@ -703,6 +743,19 @@ export function processMessage(msg) {
         if (!("ontouchstart" in window)) {
           inputEl.focus();
         }
+        // Reload survival: a restored active session that is a split-group
+        // member reopens its group (no-op when a split is already open).
+        maybeRestoreSplitGroup();
+        break;
+
+      case "session_full_access_changed":
+        if (msg.id === store.get('activeSessionId')) {
+          store.set({ sessionFullAccess: !!msg.enabled, currentMode: msg.permissionMode || "default" });
+        }
+        break;
+
+      case "session_full_access_result":
+        if (!msg.ok && msg.error) showToast(msg.error, "error");
         break;
 
       case "session_id":
@@ -733,7 +786,7 @@ export function processMessage(msg) {
           renderPlanCard(msg.planContent);
           addUserMessage("Execute the following plan. Do NOT re-enter plan mode — just implement it step by step.", msg.images || null, msg.pastes || null, msg.from, msg.fromName);
         } else {
-          addUserMessage(msg.text, msg.images || null, msg.pastes || null, msg.from, msg.fromName);
+          addUserMessage(msg.text, msg.images || null, msg.pastes || null, msg.from, msg.fromName, msg.delegated ? msg : null);
         }
         break;
 

package/lib/public/modules/app-panels.js

@@ -6,6 +6,7 @@ import { escapeHtml, showToast } from "./utils.js";
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
 import { VENDOR_NAMES } from './app-rendering.js';
+import { reportPaneContext } from './pane-bridge.js';
 
 // --- Module-owned state (not in store) ---
 var sessionUsage = { cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
@@ -150,12 +151,30 @@ function modeDisplayName(value) {
   return value;
 }
 
-function effortDisplayName(value) {
+export function effortDisplayName(value) {
   if (!value) return "";
   if (value === "xhigh") return "X-High";
   return value.charAt(0).toUpperCase() + value.slice(1);
 }
 
+// Effort levels for an arbitrary vendor/model pair (pure; the pair dialog
+// uses this for sessions other than the active one). Falls back from the
+// model's own supportedEffortLevels to the vendor table.
+export function effortLevelsFor(vendor, models, modelValue) {
+  var defaults = EFFORT_LEVELS_BY_VENDOR[vendor] || EFFORT_LEVELS;
+  var list = models || [];
+  for (var i = 0; i < list.length; i++) {
+    var value = typeof list[i] === "string" ? list[i] : (list[i] && (list[i].value || list[i].id)) || "";
+    if (value === modelValue) {
+      if (list[i].supportedEffortLevels && list[i].supportedEffortLevels.length > 0) {
+        return list[i].supportedEffortLevels;
+      }
+      return defaults;
+    }
+  }
+  return defaults;
+}
+
 function thinkingDisplayName(value) {
   if (value === "disabled") return "Off";
   if (value === "adaptive") return "Adaptive";
@@ -179,22 +198,25 @@ function hasBeta(name) {
 
 function rebuildModelList() {
   if (!configModelList) return;
-  // Picker visibility by vendor+mode:
-  //   Claude TUI -> shown, free (Claude TUI accepts mid-thread model swaps).
-  //   GUI (Claude SDK + Codex) -> shown, but locked once the session has
-  //                 history. Both bind the model at session creation and
-  //                 changing mid-thread breaks tool schemas / cache reuse,
-  //                 so we allow the pick only before the first message.
-  //                 sdk-bridge setModel stores into sm.currentModel when
-  //                 there's no active queryInstance, so a pick made before
-  //                 the first message takes effect on session start.
+  // Picker lock policy is capability-based (yoke midSessionModelSwitch):
+  //   Claude -> free. The SDK supports mid-thread swaps on a live query
+  //             (query.setModel: "Change the model used for subsequent
+  //             responses"), and sdk-bridge already routes set_model to
+  //             queryInstance.setModel. Cache re-priming on switch is a
+  //             cost, not a breakage.
+  //   Codex / Kiro -> locked once the session has history: their threads
+  //             bind the model at creation and a mid-thread change would be
+  //             silently ignored. Picks made before the first message still
+  //             work everywhere (sdk-bridge stores into sm.currentModel when
+  //             there's no active queryInstance).
   var modelSection = configModelList.parentElement;
   var s = store.snap();
   var vendor = s.currentVendor || "claude";
   if (modelSection) modelSection.style.display = "";
   configModelList.innerHTML = "";
 
-  var lockedForGui = s.activeSessionMode === "gui" && !!s.sessionHasHistory;
+  var caps = s.vendorCapabilities || {};
+  var lockedForGui = s.activeSessionMode === "gui" && !!s.sessionHasHistory && !caps.midSessionModelSwitch;
 
   var list = s.currentModels.length > 0 ? s.currentModels : (s.currentModel ? [{ value: s.currentModel, displayName: s.currentModel }] : []);
   for (var i = 0; i < list.length; i++) {
@@ -210,7 +232,7 @@ function rebuildModelList() {
     btn.textContent = label;
     if (lockedForGui) {
       btn.disabled = true;
-      btn.title = "Model is locked after the first message in a GUI session. Start a new session to change it.";
+      btn.title = "This vendor binds the model when the session starts. Start a new session to change it.";
     } else {
       btn.addEventListener("click", function () {
         var model = this.dataset.model;
@@ -228,7 +250,7 @@ function rebuildModelList() {
   if (lockedForGui) {
     var hint = document.createElement("div");
     hint.className = "config-model-hint";
-    hint.textContent = "Locked after first message — start a new session to change.";
+    hint.textContent = "Locked after first message. Start a new session to change models.";
     configModelList.appendChild(hint);
   }
 }
@@ -471,6 +493,9 @@ export function initPanels() {
       }
       updateContextPanel();
     }
+    // Split opened/closed -> show or hide the title-bar context gauge
+    if (state.splitPanes !== prev.splitPanes) updateContextPanel();
+
     // Vendor changed -> switch model list and current model to match
     if (state.currentVendor !== prev.currentVendor && state.currentVendor) {
       var ws = getWs();
@@ -670,18 +695,7 @@ export function getModelSupportsEffort() {
 
 export function getModelEffortLevels() {
   var s = store.snap();
-  var vendor = s.currentVendor || "claude";
-  var defaultLevels = EFFORT_LEVELS_BY_VENDOR[vendor] || EFFORT_LEVELS;
-  if (!s.currentModels || s.currentModels.length === 0) return defaultLevels;
-  for (var i = 0; i < s.currentModels.length; i++) {
-    if (s.currentModels[i].value === s.currentModel) {
-      if (s.currentModels[i].supportedEffortLevels && s.currentModels[i].supportedEffortLevels.length > 0) {
-        return s.currentModels[i].supportedEffortLevels;
-      }
-      return defaultLevels;
-    }
-  }
-  return defaultLevels;
+  return effortLevelsFor(s.currentVendor || "claude", s.currentModels || [], s.currentModel);
 }
 
 // --- Usage panel ---
@@ -807,6 +821,7 @@ export function updateContextPanel() {
   var win = contextData.contextWindow;
   var pct = win > 0 ? Math.min(100, (used / win) * 100) : 0;
   var cls = contextPctClass(pct);
+  reportPaneContext({ pct: pct, used: used, win: win, cls: cls, model: contextData.model, cost: contextData.cost });
   // Panel bar
   contextBarFill.style.width = pct.toFixed(1) + "%";
   contextBarFill.className = "context-bar-fill" + cls;
@@ -819,8 +834,15 @@ export function updateContextPanel() {
   if (contextMiniLabel) {
     contextMiniLabel.textContent = (win > 0 ? formatTokens(used) + "/" + formatTokens(win) : "0%");
   }
-  // Header bar
-  if (pct > 0) {
+  // Header bar. A split group has no meaningful group-level context usage:
+  // the two members have separate windows, and the parent shell's own numbers
+  // are whatever it last viewed natively. Each pane header carries its own
+  // chip instead, so hide the title-bar gauge while a split is open.
+  var splitOpen = !!store.get('splitPanes');
+  var headerCtxEl = store.get('headerContextEl');
+  if (headerCtxEl) headerCtxEl.classList.toggle("hidden", splitOpen);
+  if (contextMini) contextMini.classList.toggle("split-hidden", splitOpen);
+  if (pct > 0 && !splitOpen) {
     var statusArea = document.querySelector(".title-bar-content .status");
     var hCtxEl = store.get('headerContextEl');
     if (statusArea && !hCtxEl) {

package/lib/public/modules/app-rendering.js

@@ -416,12 +416,14 @@ export function finalizeAssistantBlock() {
   store.set({ currentMsgEl: null, currentFullText: "" });
 }
 
-export function addUserMessage(text, images, pastes, fromUserId, fromUserName) {
+export function addUserMessage(text, images, pastes, fromUserId, fromUserName, delegatedMeta) {
   if (!text && (!images || images.length === 0) && (!pastes || pastes.length === 0)) return;
   var myUserId = store.get('myUserId');
-  var isOtherUser = fromUserId && fromUserId !== myUserId;
+  var isDelegated = !!delegatedMeta;
+  var isOtherUser = isDelegated || (fromUserId && fromUserId !== myUserId);
   var div = document.createElement("div");
   div.className = "msg-user" + (isOtherUser ? " msg-user-other" : "");
+  if (isDelegated) div.classList.add("msg-user-delegated");
   div.dataset.turn = ++turnCounter;
   if (shouldGroupMessage("msg-user")) div.classList.add("grouped");
   var bubble = document.createElement("div");
@@ -482,7 +484,10 @@ export function addUserMessage(text, images, pastes, fromUserId, fromUserName) {
   var cachedAllUsers = store.get('cachedAllUsers');
   var _targetUser;
   var _displayName;
-  if (isOtherUser) {
+  if (isDelegated) {
+    _targetUser = null;
+    _displayName = "from " + (delegatedMeta.delegatedByTitle || "Driver");
+  } else if (isOtherUser) {
     _targetUser = cachedAllUsers.find(function (u) { return u.id === fromUserId; });
     _displayName = fromUserName || (_targetUser && (_targetUser.displayName || _targetUser.username)) || "User";
   } else {
@@ -498,7 +503,9 @@ export function addUserMessage(text, images, pastes, fromUserId, fromUserName) {
 
   var avi = document.createElement("img");
   avi.className = "dm-bubble-avatar" + (isOtherUser ? " dm-bubble-avatar-other" : " dm-bubble-avatar-me");
-  avi.src = isOtherUser
+  avi.src = isDelegated
+    ? (VENDOR_AVATARS[delegatedMeta.delegatedByVendor] || VENDOR_AVATARS.claude)
+    : isOtherUser
     ? userAvatarUrl(_targetUser || { id: fromUserId }, 36)
     : (document.body.dataset.myAvatarUrl || userAvatarUrl(_targetUser || { id: myUserId }, 36));
   div.appendChild(avi);

package/lib/public/modules/pane-bridge.js

@@ -0,0 +1,41 @@
+// Pane-side postMessage bridge for the split-view shell. A chrome-less pane
+// iframe reports its context usage up to the parent (which renders a chip in
+// the pane header) and honors panel-toggle requests coming back down.
+// Same-origin messages only, both directions.
+
+import { store } from './store.js';
+import { applyContextView, getContextView } from './app-panels.js';
+
+var panelOpen = false;
+
+export function reportPaneContext(data) {
+  if (!store.get('paneMode') || window.parent === window) return;
+  window.parent.postMessage({
+    type: "clay-pane-context",
+    sessionId: store.get('activeSessionId'),
+    pct: data.pct,
+    used: data.used,
+    win: data.win,
+    cls: data.cls,
+    model: data.model,
+    cost: data.cost,
+  }, window.location.origin);
+}
+
+// Toggle without setContextView: panes share localStorage with the main app,
+// so persisting here would silently rewrite the user's main-view preference.
+function togglePaneContextPanel() {
+  panelOpen = !panelOpen;
+  applyContextView(panelOpen ? "panel" : "off");
+}
+
+export function initPaneBridge() {
+  if (!store.get('paneMode')) return;
+  panelOpen = getContextView() === "panel";
+  window.addEventListener("message", function (event) {
+    if (event.origin !== window.location.origin) return;
+    var msg = event.data;
+    if (!msg || msg.type !== "clay-pane-toggle-context") return;
+    togglePaneContextPanel();
+  });
+}

package/lib/public/modules/pane-session.js

@@ -0,0 +1,18 @@
+// Pure resolution for the one-shot session pin used by pane-mode clients.
+
+export function resolvePaneSession(paneMode, pinPending, pendingSessionId, sessions) {
+  if (!paneMode || !pinPending || !pendingSessionId) return { consumed: false, sessionId: null };
+  var list = sessions || [];
+  for (var i = 0; i < list.length; i++) {
+    if (list[i].id === pendingSessionId) {
+      return { consumed: true, sessionId: pendingSessionId };
+    }
+  }
+  return { consumed: true, sessionId: null };
+}
+
+// session_switched is authoritative even when the previous session left the
+// vendor selector locked. The lock only applies to late model metadata.
+export function resolveSwitchedVendor(currentVendor, sessionVendor) {
+  return sessionVendor || currentVendor || "claude";
+}

package/lib/public/modules/sidebar-sessions.js

@@ -13,6 +13,9 @@ import { showConfirm } from './app-misc.js';
 import { getUpcomingSchedules } from './scheduler.js';
 import { refreshMobileChatSheet } from './sidebar-mobile.js';
 import { VENDOR_AVATARS, VENDOR_NAMES, VENDOR_ORDER, VENDOR_HOMEPAGES } from './app-rendering.js';
+import { openGroup, separateGroup } from './split-view.js';
+import { groupedSessionIds } from './split-group-helpers.js';
+import { openPairDialog } from './split-pair-ui.js';
 
 
 // --- Session state ---
@@ -230,6 +233,9 @@ function collectItemSessionIds(item) {
     }
     return ids;
   }
+  if (item.type === "split-group" && Array.isArray(item.members)) {
+    return item.members.map(function (session) { return session.id; });
+  }
   return [];
 }
 
@@ -407,6 +413,23 @@ function showNewSessionMenu(anchorBtn, defaultVendor) {
     })(VENDOR_ORDER[i]);
   }
 
+  if (installed.length > 0) {
+    var pairSep = document.createElement("div");
+    pairSep.className = "session-ctx-sep";
+    menu.appendChild(pairSep);
+    var pairItem = document.createElement("button");
+    pairItem.className = "session-ctx-item";
+    pairItem.type = "button";
+    pairItem.innerHTML = iconHtml("panel-left-close") + " <span>Pair session…</span>";
+    pairItem.title = "Create a Driver and Worker in a split view";
+    pairItem.addEventListener("click", function (e) {
+      e.stopPropagation();
+      closeSessionCtxMenu();
+      openPairDialog();
+    });
+    menu.appendChild(pairItem);
+  }
+
   // Claude-only launch mode: a bare TUI shell with permission prompts off.
   // Hidden in GUI mode (the default) because the item only ever produces a
   // terminal session, which contradicts what the rest of the menu creates.
@@ -418,7 +441,7 @@ function showNewSessionMenu(anchorBtn, defaultVendor) {
     var skipItem = document.createElement("button");
     skipItem.className = "session-ctx-item";
     skipItem.type = "button";
-    skipItem.innerHTML = iconHtml("shield-off") + " <span>Skip permissions (TUI)</span>";
+    skipItem.innerHTML = iconHtml("shield-off") + " <span>Skip Permissions (TUI)</span>";
     skipItem.title = "Start a terminal session with --dangerously-skip-permissions";
     skipItem.addEventListener("click", function (e) {
       e.stopPropagation();
@@ -590,6 +613,7 @@ export function initSidebarSessions() {
     if (state.lastVendor !== prev.lastVendor || state.installedVendors !== prev.installedVendors) {
       renderSessionList(null);
     }
+    if (state.splitPanes !== prev.splitPanes) renderSessionList(null);
   });
 
   // --- Resume session picker ---
@@ -656,6 +680,7 @@ function showSessionCtxMenu(anchorBtn, sessionId, title, cliSid, sessionData) {
   });
   menu.appendChild(renameItem);
 
+
   // Session visibility toggle (only the session owner can change)
   if (store.get('isMultiUserMode') && sessionData && sessionData.ownerId && sessionData.ownerId === store.get('myUserId')) {
     var currentVis = (sessionData && sessionData.sessionVisibility) || "shared";
@@ -705,6 +730,45 @@ function showSessionCtxMenu(anchorBtn, sessionId, title, cliSid, sessionData) {
   });
 }
 
+function showSplitGroupCtxMenu(anchor, group) {
+  closeSessionCtxMenu();
+  var menu = document.createElement("div");
+  menu.className = "session-ctx-menu";
+
+  var renameItem = document.createElement("button");
+  renameItem.className = "session-ctx-item";
+  renameItem.innerHTML = iconHtml("pencil") + " <span>Rename</span>";
+  renameItem.addEventListener("click", function (e) {
+    e.stopPropagation();
+    closeSessionCtxMenu();
+    startSplitGroupInlineRename(group);
+  });
+  menu.appendChild(renameItem);
+
+  var separateItem = document.createElement("button");
+  separateItem.className = "session-ctx-item";
+  separateItem.innerHTML = iconHtml("columns-2") + " <span>Separate</span>";
+  separateItem.addEventListener("click", function (e) {
+    e.stopPropagation();
+    closeSessionCtxMenu();
+    separateGroup(group);
+  });
+  menu.appendChild(separateItem);
+
+  document.body.appendChild(menu);
+  sessionCtxMenu = menu;
+  refreshIcons();
+  requestAnimationFrame(function () {
+    var rect = anchor.getBoundingClientRect();
+    menu.style.position = "fixed";
+    menu.style.top = (rect.bottom + 2) + "px";
+    menu.style.right = (window.innerWidth - rect.right) + "px";
+    menu.style.left = "auto";
+    var menuRect = menu.getBoundingClientRect();
+    if (menuRect.bottom > window.innerHeight - 8) menu.style.top = (rect.top - menuRect.height - 2) + "px";
+  });
+}
+
 function showLoopCtxMenu(anchorBtn, loopId, loopName, childCount) {
   closeSessionCtxMenu();
 
@@ -796,6 +860,40 @@ function startInlineRename(sessionId, currentTitle) {
   input.addEventListener("click", function (e) { e.stopPropagation(); });
 }
 
+function startSplitGroupInlineRename(group) {
+  var el = getSessionListEl().querySelector('.split-group-item[data-split-group-id="' + group.id + '"]');
+  if (!el) return;
+  var textSpan = el.querySelector(".split-group-name");
+  if (!textSpan) return;
+  var input = document.createElement("input");
+  input.type = "text";
+  input.className = "session-rename-input";
+  input.value = group.name || "Split";
+  var original = textSpan.textContent;
+  textSpan.innerHTML = "";
+  textSpan.appendChild(input);
+  input.focus();
+  input.select();
+  var finished = false;
+  function finish(commit) {
+    if (finished) return;
+    finished = true;
+    var name = input.value.trim();
+    if (commit && name && name !== group.name && getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "split_group_rename", id: group.id, name: name }));
+      textSpan.textContent = name;
+    } else {
+      textSpan.textContent = original;
+    }
+  }
+  input.addEventListener("keydown", function (e) {
+    if (e.key === "Enter") { e.preventDefault(); finish(true); }
+    if (e.key === "Escape") { e.preventDefault(); finish(false); }
+  });
+  input.addEventListener("blur", function () { finish(true); });
+  input.addEventListener("click", function (e) { e.stopPropagation(); });
+}
+
 function startLoopInlineRename(loopId, currentName) {
   var el = getSessionListEl().querySelector('.session-loop-group[data-loop-id="' + loopId + '"]');
   if (!el) return;
@@ -1207,6 +1305,48 @@ function renderSessionItem(s) {
   return el;
 }
 
+function renderSplitGroupItem(group, members) {
+  var el = document.createElement("div");
+  var split = store.get('splitPanes');
+  el.className = "session-item split-group-item" + (split && split.groupId === group.id ? " active" : "");
+  el.dataset.splitGroupId = group.id;
+
+  var text = document.createElement("span");
+  text.className = "session-item-text split-group-text";
+  var html = '<span class="split-group-glyph" aria-hidden="true">' + iconHtml("columns-2") + '</span><span class="split-group-vendors">';
+  for (var i = 0; i < members.length; i++) {
+    var vendor = members[i].vendor || "claude";
+    html += '<img class="session-vendor-icon split-group-vendor" src="' +
+      (VENDOR_AVATARS[vendor] || VENDOR_AVATARS.claude) + '" alt="" title="' +
+      escapeHtml(VENDOR_NAMES[vendor] || vendor) + '">';
+  }
+  html += "</span>";
+  if (members[0].isProcessing || members[1].isProcessing) html += '<span class="session-processing"></span>';
+  html += '<span class="split-group-name">' + highlightMatch(group.name || "Split", searchQuery) + "</span>";
+  text.innerHTML = html;
+  el.appendChild(text);
+
+  var unread = (members[0].unread || 0) + (members[1].unread || 0);
+  var badge = document.createElement("span");
+  badge.className = "session-unread-badge" + (unread > 0 ? " has-unread" : "");
+  badge.dataset.splitGroupId = group.id;
+  if (unread > 0) badge.textContent = unread > 99 ? "99+" : String(unread);
+  el.appendChild(badge);
+
+  el.addEventListener("click", function () {
+    if (openGroup(group)) {
+      dismissOverlayPanels();
+      closeSidebar();
+    }
+  });
+  el.addEventListener("contextmenu", function (e) {
+    e.preventDefault();
+    e.stopPropagation();
+    showSplitGroupCtxMenu(el, group);
+  });
+  return el;
+}
+
 // --- Main session list ---
 
 export function renderSessionList(sessions) {
@@ -1219,10 +1359,15 @@ export function renderSessionList(sessions) {
 
   // Partition: loop sessions vs normal sessions
   // Group by loopId + date so all runs of the same task on the same day are merged
+  var splitGroups = store.get('splitGroups') || [];
+  var groupedIds = groupedSessionIds(splitGroups);
+  var sessionsById = new Map();
+  for (var si = 0; si < cachedSessions.length; si++) sessionsById.set(cachedSessions[si].id, cachedSessions[si]);
   var loopGroups = {}; // groupKey -> [sessions]
   var normalSessions = [];
   for (var i = 0; i < cachedSessions.length; i++) {
     var s = cachedSessions[i];
+    if (groupedIds.has(s.id)) continue;
     if (s.loop && s.loop.loopId && s.loop.role === "crafting" && s.loop.source !== "ralph" && s.loop.source !== "debate") {
       // Task crafting sessions live in the scheduler calendar, not the main list (except debate)
       continue;
@@ -1242,6 +1387,18 @@ export function renderSessionList(sessions) {
   for (var j = 0; j < normalSessions.length; j++) {
     items.push({ type: "session", data: normalSessions[j], lastActivity: normalSessions[j].lastActivity || 0 });
   }
+  for (var sg = 0; sg < splitGroups.length; sg++) {
+    var splitGroup = splitGroups[sg];
+    var leftMember = sessionsById.get(splitGroup.members[0]);
+    var rightMember = sessionsById.get(splitGroup.members[1]);
+    if (!leftMember || !rightMember) continue;
+    items.push({
+      type: "split-group",
+      group: splitGroup,
+      members: [leftMember, rightMember],
+      lastActivity: Math.max(leftMember.lastActivity || 0, rightMember.lastActivity || 0),
+    });
+  }
   var groupKeys = Object.keys(loopGroups);
   for (var k = 0; k < groupKeys.length; k++) {
     var gk = groupKeys[k];
@@ -1265,6 +1422,8 @@ export function renderSessionList(sessions) {
     if (item.type === "session" && item.data && !isSessionVisibleBySearch(item.data.id)) {
       continue;
     }
+    if (item.type === "split-group" && searchMatchIds !== null &&
+        !searchMatchIds.has(item.members[0].id) && !searchMatchIds.has(item.members[1].id)) continue;
     if (item.type === "session" && item.data && item.data.bookmarked) {
       bookmarkedItems.push(item);
     } else {
@@ -1320,6 +1479,8 @@ export function renderSessionList(sessions) {
       if (loopEl) {
         regularContainer.appendChild(loopEl);
       }
+    } else if (item.type === "split-group") {
+      regularContainer.appendChild(renderSplitGroupItem(item.group, item.members));
     } else {
       regularContainer.appendChild(renderSessionItem(item.data));
     }
@@ -1400,7 +1561,20 @@ function renderPresenceAvatars(el, sessionId) {
 // --- Session badge ---
 
 export function updateSessionBadge(sessionId, count) {
+  for (var i = 0; i < cachedSessions.length; i++) {
+    if (cachedSessions[i].id === sessionId) cachedSessions[i].unread = count;
+  }
   var badge = document.querySelector('.session-unread-badge[data-session-id="' + sessionId + '"]');
+  var groups = store.get('splitGroups') || [];
+  for (var gi = 0; gi < groups.length; gi++) {
+    if (groups[gi].members.indexOf(sessionId) === -1) continue;
+    badge = document.querySelector('.session-unread-badge[data-split-group-id="' + groups[gi].id + '"]');
+    count = 0;
+    for (var mi = 0; mi < cachedSessions.length; mi++) {
+      if (groups[gi].members.indexOf(cachedSessions[mi].id) !== -1) count += cachedSessions[mi].unread || 0;
+    }
+    break;
+  }
   if (!badge) return;
   if (count > 0) {
     badge.textContent = count > 99 ? "99+" : String(count);

package/lib/public/modules/sidebar.js

@@ -12,6 +12,7 @@ import {
   getCurrentDmUserId
 } from './sidebar-mates.js';
 import { initSidebarMobile } from './sidebar-mobile.js';
+import { store } from './store.js';
 
 var ctx;
 var _syncResizeHandles = null;
@@ -26,6 +27,7 @@ export function dismissOverlayPanels() {
 }
 
 export function updatePageTitle() {
+  if (store.get('paneMode')) return;
   var sessionTitle = "";
   var activeItem = ctx.sessionListEl.querySelector(".session-item.active .session-item-text");
   if (activeItem) sessionTitle = activeItem.textContent;