clay-server 4.3.0-beta.5 → 4.3.0-beta.6

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

@@ -737,6 +737,10 @@ export function processMessage(msg) {
         if (!msg.ok && msg.error) showToast(msg.error, "error");
         break;
 
+      case "split_worker_close_result":
+        if (!msg.ok && msg.error) showToast(msg.error, "error");
+        break;
+
       case "pair_session_options":
         showPairDialog(msg);
         break;

package/lib/public/modules/project-activation.js

@@ -59,19 +59,22 @@ export function isProjectSessionReady(state, socket) {
 }
 
 export function splitPanesMatchProject(split, slug) {
-  if (!split || !Array.isArray(split.panes) || split.panes.length !== 2 || !slug) return false;
-  return split.panes[0].slug === slug && split.panes[1].slug === slug;
+  if (!split || !Array.isArray(split.panes) || split.panes.length < 2 || split.panes.length > 3 || !slug) return false;
+  for (var i = 0; i < split.panes.length; i++) if (split.panes[i].slug !== slug) return false;
+  return true;
 }
 
 export function hasCurrentSplitGroup(split, groups) {
   if (!split || !split.groupId) return true;
   var members = split.panes && split.panes.map(function (pane) { return pane.sessionId; });
-  if (!members || members.length !== 2) return false;
+  if (!members || members.length < 2 || members.length > 3) return false;
   var available = Array.isArray(groups) ? groups : [];
   for (var i = 0; i < available.length; i++) {
     var group = available[i];
-    if (group.id !== split.groupId || !Array.isArray(group.members) || group.members.length !== 2) continue;
-    if (group.members.indexOf(members[0]) !== -1 && group.members.indexOf(members[1]) !== -1) return true;
+    if (group.id !== split.groupId || !Array.isArray(group.members) || group.members.length !== members.length) continue;
+    var matches = true;
+    for (var mi = 0; mi < members.length; mi++) if (group.members.indexOf(members[mi]) === -1) matches = false;
+    if (matches) return true;
   }
   return false;
 }
@@ -84,8 +87,8 @@ export function reconcileRestoredSplit(split, groups) {
     if (group.id !== split.groupId) continue;
     var oldMembers = split.panes && split.panes.map(function (pane) { return pane.sessionId; });
     var members = Array.isArray(group.members) ? group.members : [];
-    if (oldMembers && oldMembers.length === 2 && members.length === 2
-        && members.indexOf(oldMembers[0]) !== -1 && members.indexOf(oldMembers[1]) !== -1) {
+    if (oldMembers && oldMembers.length === members.length
+        && oldMembers.every(function (id) { return members.indexOf(id) !== -1; })) {
       return { action: "keep", group: group };
     }
     return { action: "rebuild", group: group };

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

@@ -1429,14 +1429,20 @@ function renderSplitGroupItem(group, members) {
       escapeHtml(VENDOR_NAMES[vendor] || vendor) + '">';
   }
   html += "</span>";
-  if (members[0].isProcessing || members[1].isProcessing) html += '<span class="session-processing"></span>';
-  var splitBackgroundTaskCount = (members[0].backgroundTaskCount || 0) + (members[1].backgroundTaskCount || 0);
+  var splitProcessing = false;
+  var splitBackgroundTaskCount = 0;
+  for (var si = 0; si < members.length; si++) {
+    if (members[si].isProcessing) splitProcessing = true;
+    splitBackgroundTaskCount += members[si].backgroundTaskCount || 0;
+  }
+  if (splitProcessing) html += '<span class="session-processing"></span>';
   if (splitBackgroundTaskCount) html += '<span class="session-background-task-count">' + splitBackgroundTaskCount + '</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 unread = 0;
+  for (var ui = 0; ui < members.length; ui++) unread += members[ui].unread || 0;
   var badge = document.createElement("span");
   badge.className = "session-unread-badge" + (unread > 0 ? " has-unread" : "");
   badge.dataset.splitGroupId = group.id;
@@ -1532,15 +1538,24 @@ export function renderSessionList(sessions) {
   }
   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;
-    if (hierarchySessionIds.has(leftMember.id) || hierarchySessionIds.has(rightMember.id)) continue;
+    var splitMembers = [];
+    for (var smi = 0; smi < splitGroup.members.length; smi++) {
+      var splitMember = sessionsById.get(splitGroup.members[smi]);
+      if (splitMember) splitMembers.push(splitMember);
+    }
+    if (splitMembers.length !== splitGroup.members.length) continue;
+    var hasHierarchyMember = false;
+    for (var hmi = 0; hmi < splitMembers.length; hmi++) {
+      if (hierarchySessionIds.has(splitMembers[hmi].id)) hasHierarchyMember = true;
+    }
+    if (hasHierarchyMember) continue;
+    var splitLastActivity = 0;
+    for (var lai = 0; lai < splitMembers.length; lai++) splitLastActivity = Math.max(splitLastActivity, splitMembers[lai].lastActivity || 0);
     items.push({
       type: "split-group",
       group: splitGroup,
-      members: [leftMember, rightMember],
-      lastActivity: Math.max(leftMember.lastActivity || 0, rightMember.lastActivity || 0),
+      members: splitMembers,
+      lastActivity: splitLastActivity,
     });
   }
   var groupKeys = Object.keys(loopGroups);
@@ -1567,8 +1582,13 @@ export function renderSessionList(sessions) {
       continue;
     }
     if ((item.type === "driver-hierarchy" || item.type === "orphan-workers") && !hierarchyItemMatches(item, searchMatchIds)) continue;
-    if (item.type === "split-group" && searchMatchIds !== null &&
-        !searchMatchIds.has(item.members[0].id) && !searchMatchIds.has(item.members[1].id)) continue;
+    if (item.type === "split-group" && searchMatchIds !== null) {
+      var splitSearchMatch = false;
+      for (var splitSearchIndex = 0; splitSearchIndex < item.members.length; splitSearchIndex++) {
+        if (searchMatchIds.has(item.members[splitSearchIndex].id)) splitSearchMatch = true;
+      }
+      if (!splitSearchMatch) continue;
+    }
     if ((item.type === "session" || item.type === "driver-hierarchy") && item.data && item.data.bookmarked) {
       bookmarkedItems.push(item);
     } else {

package/lib/public/modules/split-group-helpers.js

@@ -12,15 +12,87 @@ export function findSplitGroup(groups, memberIds) {
   var list = groups || [];
   for (var i = 0; i < list.length; i++) {
     var members = list[i].members || [];
-    if (members.length === 2 && members[0] === memberIds[0] && members[1] === memberIds[1]) return list[i];
+    if (members.length !== memberIds.length) continue;
+    var matches = true;
+    for (var j = 0; j < memberIds.length; j++) {
+      if (members.indexOf(memberIds[j]) === -1) { matches = false; break; }
+    }
+    if (matches) return list[i];
   }
   return null;
 }
 
+// Resolve the visible order from the explicit role contract. Member array
+// order is persistence detail and must never decide who is the Driver.
+export function splitGroupRoles(group) {
+  if (!group || !Array.isArray(group.members)) return null;
+  var pair = group.pair;
+  if (!pair || typeof pair !== "object" || Array.isArray(pair)) return null;
+  var hasVersion = Object.prototype.hasOwnProperty.call(pair, "version");
+  var hasLegacyWorker = Object.prototype.hasOwnProperty.call(pair, "workerId");
+  var hasWorkerIds = Object.prototype.hasOwnProperty.call(pair, "workerIds");
+  if (hasVersion && pair.version !== 2) return null;
+  if (hasVersion && hasLegacyWorker) return null;
+  if (hasVersion && !hasWorkerIds) return null;
+  if (!hasVersion && hasWorkerIds) return null;
+  if (!hasVersion && !hasLegacyWorker) return null;
+  var driverId = pair.driverId;
+  var workerIds = hasWorkerIds ? (Array.isArray(pair.workerIds) ? pair.workerIds.slice() : []) :
+    (pair.workerId !== undefined ? [pair.workerId] : []);
+  if (!Number.isInteger(driverId) || workerIds.length < 1 || workerIds.length > 2) return null;
+  if (group.members.indexOf(driverId) === -1) return null;
+  var ordered = [driverId];
+  for (var i = 0; i < workerIds.length; i++) {
+    if (!Number.isInteger(workerIds[i]) || workerIds[i] === driverId || group.members.indexOf(workerIds[i]) === -1 || ordered.indexOf(workerIds[i]) !== -1) return null;
+    ordered.push(workerIds[i]);
+  }
+  if (group.members.length !== ordered.length) return null;
+  for (var mi = 0; mi < group.members.length; mi++) if (ordered.indexOf(group.members[mi]) === -1) return null;
+  return { driverId: driverId, workerIds: workerIds, orderedIds: ordered, version: pair.version || null };
+}
+
+export function splitGroupMemberIds(group) {
+  var roles = splitGroupRoles(group);
+  return roles ? roles.orderedIds : (group && Array.isArray(group.members) ? group.members.slice() : []);
+}
+
+export function splitGroupActiveAnchor(group, activeId) {
+  var roles = splitGroupRoles(group);
+  if (roles) return roles.driverId;
+  var members = group && Array.isArray(group.members) ? group.members : [];
+  return members.indexOf(activeId) !== -1 ? activeId : (members[0] || null);
+}
+
 export function isConfiguredWorker(groups, sessionId) {
   var list = groups || [];
   for (var i = 0; i < list.length; i++) {
-    if (list[i].pair && list[i].pair.workerId === sessionId) return true;
+    var roles = splitGroupRoles(list[i]);
+    if (roles && roles.workerIds.indexOf(sessionId) !== -1) return true;
   }
   return false;
 }
+
+export function splitWorkerCloseRequest(group, sessions, projectSlug, workerId, requestId) {
+  var roles = splitGroupRoles(group);
+  if (!roles || roles.version !== 2 || roles.workerIds.indexOf(workerId) === -1) return null;
+  var anchors = group && group.pairAnchors;
+  if (!anchors || anchors.version !== 2 || !anchors.driver || !Array.isArray(anchors.workers)) return null;
+  var workerIndex = roles.workerIds.indexOf(workerId);
+  var workerAnchor = anchors.workers[workerIndex];
+  var worker = null;
+  var list = sessions || [];
+  for (var i = 0; i < list.length; i++) if (list[i].id === workerId) worker = list[i];
+  if (!workerAnchor || !anchors.driver.origin || !workerAnchor.origin || !worker || !Number.isInteger(worker.workerGeneration)) return null;
+  return {
+    type: "split_worker_close",
+    requestId: requestId,
+    projectSlug: projectSlug,
+    groupId: group.id,
+    driverId: roles.driverId,
+    driverOriginId: anchors.driver.origin,
+    workerId: workerId,
+    workerOriginId: workerAnchor.origin,
+    generation: worker.workerGeneration,
+    expectedWorkerIds: roles.workerIds.slice(),
+  };
+}

package/lib/public/modules/split-pair-ui.js

@@ -5,6 +5,7 @@ import { buildAgentVendorSelect, fillAgentModels, buildAgentEffortSelect, fillAg
 import { showToast } from './utils.js';
 import { getCachedSessions } from './sidebar-sessions.js';
 import { appendWorkerRuntime } from './split-worker-runtime.js';
+import { splitGroupRoles } from './split-group-helpers.js';
 
 var pairDialog = null;
 // Set when the dialog was opened via "Add Split Worker" on an existing session:
@@ -245,6 +246,8 @@ export function syncPairChrome(host, split) {
   var paneEls = host.querySelectorAll(".split-pane");
   for (var paneIndex = 0; paneIndex < paneEls.length; paneIndex++) {
     paneEls[paneIndex].classList.remove("split-pane-role-driver", "split-pane-role-worker");
+    paneEls[paneIndex].style.removeProperty("--split-pane-order");
+    paneEls[paneIndex].style.removeProperty("--split-worker-row");
   }
   var runtimeHeaders = host.querySelectorAll(".has-worker-runtime");
   for (var ri = 0; ri < runtimeHeaders.length; ri++) runtimeHeaders[ri].classList.remove("has-worker-runtime");
@@ -268,10 +271,23 @@ export function syncPairChrome(host, split) {
     }
     return;
   }
+  var roles = splitGroupRoles(group);
+  if (!roles) return;
+  var workerIndex = 0;
   for (var pi = 0; pi < split.panes.length && pi < headers.length; pi++) {
-    (function (sessionId, header) {
-      var isDriver = sessionId === group.pair.driverId;
-      if (paneEls[pi]) paneEls[pi].classList.add(isDriver ? "split-pane-role-driver" : "split-pane-role-worker");
+    var desiredPane = split.panes[pi];
+    var desiredPaneEl = null;
+    for (var pei = 0; pei < paneEls.length; pei++) {
+      if (paneEls[pei].dataset.sessionId === String(desiredPane.sessionId)) desiredPaneEl = paneEls[pei];
+    }
+    if (!desiredPaneEl) continue;
+    (function (sessionId, header, paneEl) {
+      var isDriver = sessionId === roles.driverId;
+      if (paneEl) {
+        paneEl.classList.add(isDriver ? "split-pane-role-driver" : "split-pane-role-worker");
+        paneEl.style.setProperty("--split-pane-order", isDriver ? "2" : String(workerIndex));
+        if (!isDriver) paneEl.style.setProperty("--split-worker-row", String(workerIndex + 1));
+      }
       var role = isDriver ? "Driver" : "Split Worker";
       var badge = document.createElement("span");
       badge.className = "split-pair-role split-pair-role-" + role.toLowerCase().replace(/ /g, "-");
@@ -287,18 +303,24 @@ export function syncPairChrome(host, split) {
           if (sessions[wi].id === sessionId) { workerSession = sessions[wi]; break; }
         }
         appendWorkerRuntime(header, workerSession);
+        workerIndex++;
       }
-    })(split.panes[pi].sessionId, headers[pi]);
+    })(desiredPane.sessionId, desiredPaneEl.querySelector(".split-pane-header"), desiredPaneEl);
   }
   var active = (store.get('splitDelegations') || {})[group.id];
   if (!active || !active.active) return;
   host.classList.add("split-delegating");
   var fromIndex = split.panes[0].sessionId === active.from ? 0 : 1;
   host.classList.add(fromIndex === 0 ? "split-direction-right" : "split-direction-left");
-  for (var si = 0; si < split.panes.length && si < headers.length; si++) {
+  for (var si = 0; si < split.panes.length; si++) {
+    var livePane = null;
+    for (var lpi = 0; lpi < paneEls.length; lpi++) {
+      if (paneEls[lpi].dataset.sessionId === String(split.panes[si].sessionId)) livePane = paneEls[lpi];
+    }
+    if (!livePane) continue;
     var live = document.createElement("span");
     live.className = "split-pair-live";
     live.textContent = split.panes[si].sessionId === active.to ? "Following direction" : "Waiting";
-    headers[si].appendChild(live);
+    livePane.querySelector(".split-pane-header").appendChild(live);
   }
 }

package/lib/public/modules/split-pane-reconciler.js

@@ -0,0 +1,28 @@
+// Keyed DOM reconciliation for the parent split shell. Existing pane nodes
+// (and their iframe browsing contexts) are reused by stable project/session
+// identity while metadata and visual order are refreshed.
+
+export function splitPaneIdentity(pane) {
+  return String(pane && pane.slug || "") + "#" + String(pane && pane.sessionId || "");
+}
+
+export function reconcileSplitPanes(host, panes, createPane, updatePane) {
+  var desired = Array.isArray(panes) ? panes : [];
+  var existing = host.querySelectorAll(".split-pane");
+  var byKey = new Map();
+  for (var i = 0; i < existing.length; i++) byKey.set(existing[i].dataset.splitPaneKey, existing[i]);
+  var used = new Set();
+  for (var pi = 0; pi < desired.length; pi++) {
+    var pane = desired[pi];
+    var key = splitPaneIdentity(pane);
+    var paneEl = byKey.get(key);
+    if (!paneEl) paneEl = createPane(pane, pi);
+    paneEl.dataset.splitPaneKey = key;
+    updatePane(paneEl, pane, pi);
+    used.add(paneEl);
+    if (!paneEl.parentNode) host.appendChild(paneEl);
+  }
+  for (var ei = existing.length - 1; ei >= 0; ei--) {
+    if (!used.has(existing[ei])) existing[ei].remove();
+  }
+}

package/lib/public/modules/split-pane-renderer.js

@@ -0,0 +1,107 @@
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { getCachedSessions } from './sidebar-sessions.js';
+import { iconHtml } from './icons.js';
+import { formatTokens } from './app-panels.js';
+import { VENDOR_AVATARS, VENDOR_NAMES } from './app-rendering.js';
+import { createPermissionControl, bindPermissionControl, renderPermissionControl } from './permission-control.js';
+import { splitGroupRoles } from './split-group-helpers.js';
+
+function sessionById(sessionId) {
+  var sessions = getCachedSessions() || [];
+  for (var i = 0; i < sessions.length; i++) if (sessions[i].id === sessionId) return sessions[i];
+  return null;
+}
+
+function paneUrl(pane) {
+  return "/p/" + encodeURIComponent(pane.slug) + "/?pane=1&session=" + encodeURIComponent(pane.sessionId);
+}
+
+function startPaneRename(header, titleEl, pane) {
+  if (header.querySelector(".split-pane-rename-input")) return;
+  var input = document.createElement("input");
+  input.type = "text"; input.className = "split-pane-rename-input"; input.value = pane.title;
+  titleEl.style.display = "none"; header.insertBefore(input, titleEl); input.focus(); input.select();
+  var done = false;
+  function finish(commit) {
+    if (done) return;
+    done = true;
+    var newTitle = input.value.trim(); input.remove(); titleEl.style.display = "";
+    if (!commit || !newTitle || newTitle === pane.title) return;
+    pane.title = newTitle; titleEl.textContent = newTitle;
+    var ws = getWs();
+    if (ws && ws.readyState === 1) ws.send(JSON.stringify({ type: "rename_session", id: pane.sessionId, title: newTitle }));
+  }
+  input.addEventListener("keydown", function (event) {
+    if (event.key === "Enter") { event.preventDefault(); finish(true); }
+    if (event.key === "Escape") { event.preventDefault(); finish(false); }
+  });
+  input.addEventListener("blur", function () { finish(true); });
+  input.addEventListener("click", function (event) { event.stopPropagation(); });
+}
+
+function permissionState(session) {
+  var mode = session && (session.runtimeMode || session.mode || "gui");
+  var worker = !!session && isConfiguredWorker(store.get('splitGroups'), session.id);
+  return {
+    projectSlug: store.get('currentSlug'), sessionId: session && session.id,
+    vendor: session && session.vendor || store.get('currentVendor') || "claude",
+    permissionMode: session && session.permissionMode || "default",
+    effectivePermissionMode: session && session.effectivePermissionMode || null,
+    permissionCapabilities: session && session.permissionCapabilities || { auto: false, mcpOverride: false },
+    connected: store.get('connected'), globalPermissionModeForced: store.get('skipPermsEnabled') === true,
+    visible: !!session && !worker && mode === "gui", locked: worker,
+  };
+}
+
+function isConfiguredWorker(groups, sessionId) {
+  for (var i = 0; i < (groups || []).length; i++) {
+    var roles = splitGroupRoles(groups[i]);
+    if (roles && roles.workerIds.indexOf(sessionId) !== -1) return true;
+  }
+  return false;
+}
+
+export function updatePaneFullAccessButton(button, session) {
+  if (button) renderPermissionControl(button, permissionState(session));
+}
+
+export function createSplitPane(pane, closePane) {
+  var paneEl = document.createElement("section"); paneEl.className = "split-pane";
+  var header = document.createElement("header"); header.className = "split-pane-header"; header.title = pane.title;
+  var session = sessionById(pane.sessionId); var vendor = session && session.vendor || "claude";
+  var vendorIcon = document.createElement("img"); vendorIcon.className = "split-pane-vendor";
+  vendorIcon.src = VENDOR_AVATARS[vendor] || VENDOR_AVATARS.claude; vendorIcon.alt = ""; vendorIcon.title = VENDOR_NAMES[vendor] || vendor; header.appendChild(vendorIcon);
+  var title = document.createElement("span"); title.className = "split-pane-title"; title.textContent = pane.title; title.title = "Rename session";
+  title.addEventListener("click", function () { startPaneRename(header, title, pane); }); header.appendChild(title);
+  var frame = document.createElement("iframe"); frame.className = "split-pane-frame"; frame.dataset.projectSlug = pane.slug;
+  frame.dataset.sessionId = String(pane.sessionId); frame.src = paneUrl(pane); frame.title = pane.title;
+  var ctxChip = document.createElement("button"); ctxChip.type = "button"; ctxChip.className = "split-pane-context"; ctxChip.title = "Context usage";
+  ctxChip.innerHTML = '<span class="split-pane-context-bar"><span class="split-pane-context-fill"></span></span><span class="split-pane-context-label"></span>';
+  ctxChip.addEventListener("click", function () { if (frame.contentWindow) frame.contentWindow.postMessage({ type: "clay-pane-toggle-context" }, window.location.origin); }); header.appendChild(ctxChip);
+  var fullAccess = createPermissionControl("split-pane-full-access hidden", "Driver session permission mode");
+  updatePaneFullAccessButton(fullAccess, session); bindPermissionControl(fullAccess, function () { return permissionState(sessionById(pane.sessionId)); }); header.appendChild(fullAccess); header.insertBefore(fullAccess, ctxChip);
+  var close = document.createElement("button"); close.type = "button"; close.className = "split-pane-close"; close.title = "Close pane"; close.setAttribute("aria-label", "Close pane"); close.innerHTML = iconHtml("x");
+  close.dataset.sessionId = String(pane.sessionId); close.addEventListener("click", function () { closePane(Number(this.dataset.sessionId)); }); header.appendChild(close);
+  paneEl.appendChild(header); paneEl.appendChild(frame); return paneEl;
+}
+
+export function updateSplitPaneMetadata(paneEl, pane) {
+  var session = sessionById(pane.sessionId); var header = paneEl.querySelector(".split-pane-header");
+  var title = paneEl.querySelector(".split-pane-title"); var frame = paneEl.querySelector(".split-pane-frame"); var vendor = paneEl.querySelector(".split-pane-vendor");
+  paneEl.dataset.sessionId = String(pane.sessionId); paneEl.dataset.projectSlug = pane.slug;
+  if (header) header.title = pane.title; if (title && title.style.display !== "none") title.textContent = pane.title; if (frame) frame.title = pane.title;
+  if (vendor) { var vendorName = session && session.vendor || "claude"; vendor.src = VENDOR_AVATARS[vendorName] || VENDOR_AVATARS.claude; vendor.title = VENDOR_NAMES[vendorName] || vendorName; }
+  var close = paneEl.querySelector(".split-pane-close");
+  if (close) {
+    close.dataset.sessionId = String(pane.sessionId); close.disabled = false; close.title = "Close pane"; close.setAttribute("aria-label", close.title);
+  }
+}
+
+export function updatePaneContextChip(paneEl, msg) {
+  if (!paneEl) return; var chip = paneEl.querySelector(".split-pane-context"); if (!chip) return; var pct = msg.pct || 0; if (pct <= 0) return;
+  chip.classList.add("has-data"); var fill = chip.querySelector(".split-pane-context-fill"); var label = chip.querySelector(".split-pane-context-label");
+  fill.style.width = Math.min(100, pct).toFixed(1) + "%"; fill.className = "split-pane-context-fill" + (msg.cls || ""); label.textContent = pct.toFixed(0) + "%";
+  var tip = "Context " + pct.toFixed(0) + "% (" + formatTokens(msg.used || 0) + " / " + formatTokens(msg.win || 0) + " tokens)";
+  if (msg.cost) tip += " · $" + msg.cost.toFixed(4); if (msg.model && msg.model !== "-") tip += " · " + msg.model; chip.title = tip;
+}