clay-server 3.0.0 → 3.1.0-beta.2

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

@@ -10,10 +10,9 @@ import { store } from './store.js';
 import { getWs } from './ws-ref.js';
 import { closeSidebar } from './sidebar.js';
 import { showIconTooltip, hideIconTooltip, closeUserCtxMenu, getCurrentDmUserId } from './sidebar-mates.js';
-import { switchProject, openAddProjectModal } from './app-projects.js';
+import { switchProject, openAddProjectModal, getCachedProjects } from './app-projects.js';
 import { showHomeHub } from './app-home-hub.js';
 import { getPendingTuiAttention } from './app-notifications.js';
-import { aggregateFamily } from './worktree-family.js';
 
 // --- Project state ---
 var cachedProjectList = [];
@@ -32,6 +31,9 @@ var emojiPickerEl = null;
 var draggedSlug = null;
 var draggedEl = null;
 
+// --- Worktree folder collapse state (session-local) ---
+var wtCollapsed = {};
+
 var EMOJI_CATEGORIES = [
   { id: "frequent", icon: "🕐", label: "Frequent", emojis: [
     "😀","😎","🤓","🧠","💡","🔥","⚡","🚀",
@@ -519,8 +521,17 @@ function showIconCtxMenu(anchorEl, slug, name) {
       }
     });
     menu.appendChild(removeWtItem);
+  } else {
+    var wtItem = document.createElement("button");
+    wtItem.className = "project-ctx-item";
+    wtItem.innerHTML = iconHtml("git-branch") + " <span>Add Worktree</span>";
+    wtItem.addEventListener("click", function (e) {
+      e.stopPropagation();
+      closeProjectCtxMenu();
+      showWorktreeModal(slug, name || slug);
+    });
+    menu.appendChild(wtItem);
   }
-  // Worktree creation lives in the title-bar branch chip, not here.
 
   document.body.appendChild(menu);
   projectCtxMenu = menu;
@@ -605,7 +616,20 @@ function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
     }
   }
 
-  // Worktree creation lives in the title-bar branch chip, not here.
+  var sep2 = document.createElement("div");
+  sep2.className = "project-ctx-separator";
+  menu.appendChild(sep2);
+
+  // --- Add Worktree ---
+  var wtItem = document.createElement("button");
+  wtItem.className = "project-ctx-item";
+  wtItem.innerHTML = iconHtml("git-branch") + " <span>Add Worktree</span>";
+  wtItem.addEventListener("click", function (e) {
+    e.stopPropagation();
+    closeProjectCtxMenu();
+    showWorktreeModal(slug, name || slug);
+  });
+  menu.appendChild(wtItem);
 
   if (!store.get('permissions') || store.get('permissions').deleteProject !== false) {
     var sep3 = document.createElement("div");
@@ -926,6 +950,12 @@ function setupDragHandlers(el, slug) {
   });
 }
 
+// --- Worktree folder collapse ---
+
+function setWtCollapsed(slug, collapsed) {
+  wtCollapsed[slug] = collapsed;
+}
+
 function groupProjects(projects) {
   var parents = [];
   var wtByParent = {};
@@ -941,21 +971,6 @@ function groupProjects(projects) {
   return { parents: parents, wtByParent: wtByParent };
 }
 
-function aggregateProjectFamily(parent, worktrees) {
-  var aggregate = aggregateFamily(parent, worktrees);
-  aggregate.hasFamilyPendingAttention = getPendingTuiAttention(parent.slug) > 0;
-  aggregate.hasWorktreeUnread = false;
-  aggregate.hasWorktreePending = false;
-  for (var i = 0; i < worktrees.length; i++) {
-    if (getPendingTuiAttention(worktrees[i].slug) > 0) aggregate.hasFamilyPendingAttention = true;
-    if (worktrees[i].unread > 0) aggregate.hasWorktreeUnread = true;
-    if (worktrees[i].pendingPermissions > 0 || getPendingTuiAttention(worktrees[i].slug) > 0) {
-      aggregate.hasWorktreePending = true;
-    }
-  }
-  return aggregate;
-}
-
 // --- Icon item creation ---
 
 function createIconItem(p, currentSlug) {
@@ -987,7 +1002,7 @@ function createIconItem(p, currentSlug) {
 
   var projectBadge = document.createElement("span");
   projectBadge.className = "icon-strip-project-badge";
-  if (p.unread > 0 && (!isActive || p.hasWorktreeUnread)) {
+  if (p.unread > 0 && !isActive) {
     projectBadge.textContent = p.unread > 99 ? "99+" : String(p.unread);
     projectBadge.classList.add("has-unread");
   }
@@ -997,8 +1012,7 @@ function createIconItem(p, currentSlug) {
   // broadcast — they surface via tui_attention notifications. We shake the
   // same icon for either, so the user notices regardless of which engine
   // is asking.
-  if ((!isActive && (p.pendingPermissions > 0 || p.hasFamilyPendingAttention || getPendingTuiAttention(p.slug) > 0)) ||
-      p.hasWorktreePending) {
+  if (!isActive && (p.pendingPermissions > 0 || getPendingTuiAttention(p.slug) > 0)) {
     el.classList.add("has-pending-perm");
   }
 
@@ -1019,7 +1033,7 @@ function createIconItem(p, currentSlug) {
 
 // --- Worktree creation modal ---
 
-export function showWorktreeModal(parentSlug, parentName) {
+function showWorktreeModal(parentSlug, parentName) {
   var existing = document.getElementById("wt-modal-container");
   if (existing) existing.remove();
 
@@ -1174,17 +1188,164 @@ export function renderIconStrip(projects, currentSlug) {
   for (var i = 0; i < grouped.parents.length; i++) {
     var p = grouped.parents[i];
     var worktrees = grouped.wtByParent[p.slug] || [];
-    var familyProject = aggregateProjectFamily(p, worktrees);
-    var el = createIconItem(familyProject, currentSlug);
+    var hasWorktrees = worktrees.length > 0;
+
+    if (!hasWorktrees) {
+      var el = createIconItem(p, currentSlug);
+      (function (slug, name, elem) {
+        elem.addEventListener("contextmenu", function (e) {
+          e.preventDefault();
+          e.stopPropagation();
+          showIconCtxMenu(elem, slug, name);
+        });
+      })(p.slug, p.name || p.slug, el);
+      setupDragHandlers(el, p.slug);
+      container.appendChild(el);
+      continue;
+    }
+
+    // Folder group for parent + worktrees
+    var folder = document.createElement("div");
+    folder.className = "icon-strip-group";
+    folder.dataset.parentSlug = p.slug;
+    if (wtCollapsed[p.slug]) folder.classList.add("collapsed");
+
+    if (!p.isProcessing) {
+      for (var wpi = 0; wpi < worktrees.length; wpi++) {
+        if (worktrees[wpi].isProcessing) { p.isProcessing = true; break; }
+      }
+    }
+
+    var header = createIconItem(p, currentSlug);
+    header.classList.add("folder-header");
     (function (slug, name, elem) {
       elem.addEventListener("contextmenu", function (e) {
         e.preventDefault();
         e.stopPropagation();
         showIconCtxMenu(elem, slug, name);
       });
-    })(p.slug, p.name || p.slug, el);
-    setupDragHandlers(el, p.slug);
-    container.appendChild(el);
+    })(p.slug, p.name || p.slug, header);
+    setupDragHandlers(header, p.slug);
+
+    var chevron = document.createElement("span");
+    chevron.className = "icon-strip-group-chevron";
+    chevron.innerHTML = '<i data-lucide="git-branch"></i>';
+    (function (parentSlug, folderEl) {
+      chevron.addEventListener("click", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        var nowCollapsed = folderEl.classList.toggle("collapsed");
+        setWtCollapsed(parentSlug, nowCollapsed);
+      });
+      chevron.addEventListener("contextmenu", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+      });
+    })(p.slug, folder);
+    chevron.setAttribute("data-tip", "Toggle worktrees");
+    header.appendChild(chevron);
+    folder.appendChild(header);
+
+    var itemsContainer = document.createElement("div");
+    itemsContainer.className = "icon-strip-group-items";
+
+    for (var wi = 0; wi < worktrees.length; wi++) {
+      (function (wt) {
+        var wtEl = document.createElement("a");
+        var isWtActive = wt.slug === currentSlug && !currentDmUserId;
+        var isAccessible = wt.worktreeAccessible !== false;
+        wtEl.className = "icon-strip-wt-item" + (isWtActive ? " active" : "") + (!isAccessible ? " wt-disabled" : "");
+        wtEl.href = "/p/" + wt.slug + "/";
+        wtEl.dataset.slug = wt.slug;
+
+        if (wt.icon) {
+          var wtEmoji = document.createElement("span");
+          wtEmoji.className = "wt-branch-abbrev project-emoji";
+          wtEmoji.textContent = wt.icon;
+          parseEmojis(wtEmoji);
+          wtEl.appendChild(wtEmoji);
+        } else {
+          var abbrev = document.createElement("span");
+          abbrev.className = "wt-branch-abbrev";
+          abbrev.textContent = getProjectAbbrev(wt.name);
+          wtEl.appendChild(abbrev);
+        }
+
+        var wtStatus = document.createElement("span");
+        wtStatus.className = "icon-strip-status";
+        if (wt.isProcessing) wtStatus.classList.add("processing");
+        wtEl.appendChild(wtStatus);
+
+        var tooltipText = wt.name;
+        if (!isAccessible) {
+          tooltipText += " (outside project path, cannot be accessed)";
+        }
+        (function (text, elem) {
+          elem.addEventListener("mouseenter", function () { showIconTooltip(elem, text); });
+          elem.addEventListener("mouseleave", hideIconTooltip);
+        })(tooltipText, wtEl);
+
+        if (isAccessible) {
+          (function (slug) {
+            wtEl.addEventListener("click", function (e) {
+              e.preventDefault();
+              if (switchProject) switchProject(slug);
+            });
+          })(wt.slug);
+        } else {
+          wtEl.addEventListener("click", function (e) {
+            e.preventDefault();
+          });
+        }
+
+        if (isAccessible) {
+          (function (slug, name, elem) {
+            elem.addEventListener("contextmenu", function (e) {
+              e.preventDefault();
+              e.stopPropagation();
+              showIconCtxMenu(elem, slug, name);
+            });
+          })(wt.slug, wt.name, wtEl);
+        } else {
+          wtEl.addEventListener("contextmenu", function (e) {
+            e.preventDefault();
+            e.stopPropagation();
+          });
+        }
+
+        if (!isWtActive && (wt.pendingPermissions > 0 || getPendingTuiAttention(wt.slug) > 0)) {
+          wtEl.classList.add("has-pending-perm");
+        }
+
+        itemsContainer.appendChild(wtEl);
+      })(worktrees[wi]);
+    }
+
+    var hasWtPendingPerm = false;
+    for (var wpi2 = 0; wpi2 < worktrees.length; wpi2++) {
+      if (worktrees[wpi2].pendingPermissions > 0 || getPendingTuiAttention(worktrees[wpi2].slug) > 0) {
+        hasWtPendingPerm = true;
+        break;
+      }
+    }
+    if (hasWtPendingPerm) folder.classList.remove("collapsed");
+
+    var addBtn = document.createElement("button");
+    addBtn.className = "icon-strip-group-add";
+    addBtn.textContent = "+";
+    (function (parentSlug, parentName, btn) {
+      btn.addEventListener("click", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        showWorktreeModal(parentSlug, parentName);
+      });
+      btn.addEventListener("mouseenter", function () { showIconTooltip(btn, "New worktree"); });
+      btn.addEventListener("mouseleave", hideIconTooltip);
+    })(p.slug, p.name, addBtn);
+    itemsContainer.appendChild(addBtn);
+
+    folder.appendChild(itemsContainer);
+    container.appendChild(folder);
   }
 
   // Update home icon active state
@@ -1212,17 +1373,50 @@ function renderProjectList(projects, currentSlug) {
   for (var i = 0; i < grouped.parents.length; i++) {
     var p = grouped.parents[i];
     var worktrees = grouped.wtByParent[p.slug] || [];
-    list.appendChild(createMobileProjectItem(aggregateProjectFamily(p, worktrees), currentSlug));
+
+    if (worktrees.length === 0) {
+      list.appendChild(createMobileProjectItem(p, currentSlug, false));
+      continue;
+    }
+
+    var folderDiv = document.createElement("div");
+    folderDiv.className = "mobile-project-folder";
+    if (wtCollapsed[p.slug]) folderDiv.classList.add("collapsed");
+
+    var headerEl = createMobileProjectItem(p, currentSlug, false);
+    var chevron = document.createElement("span");
+    chevron.className = "mobile-folder-chevron";
+    chevron.innerHTML = "&#9660;";
+    (function (parentSlug, fDiv) {
+      chevron.addEventListener("click", function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        var nowCollapsed = fDiv.classList.toggle("collapsed");
+        setWtCollapsed(parentSlug, nowCollapsed);
+      });
+    })(p.slug, folderDiv);
+    headerEl.appendChild(chevron);
+    folderDiv.appendChild(headerEl);
+
+    var wtList = document.createElement("div");
+    wtList.className = "mobile-folder-items";
+    for (var wi = 0; wi < worktrees.length; wi++) {
+      var isAccessible = worktrees[wi].worktreeAccessible !== false;
+      var wtItem = createMobileProjectItem(worktrees[wi], currentSlug, true);
+      if (!isAccessible) wtItem.classList.add("wt-disabled");
+      if (!isAccessible) {
+        wtItem.addEventListener("click", function (e) { e.preventDefault(); e.stopPropagation(); });
+      }
+      wtList.appendChild(wtItem);
+    }
+    folderDiv.appendChild(wtList);
+    list.appendChild(folderDiv);
   }
 }
 
-function createMobileProjectItem(p, currentSlug) {
+function createMobileProjectItem(p, currentSlug, isWorktree) {
   var el = document.createElement("button");
-  var isActive = p.slug === currentSlug;
-  el.className = "mobile-project-item" + (isActive ? " active" : "");
-  if ((!isActive && (p.pendingPermissions > 0 || p.hasFamilyPendingAttention)) || p.hasWorktreePending) {
-    el.classList.add("has-pending-perm");
-  }
+  el.className = "mobile-project-item" + (p.slug === currentSlug ? " active" : "") + (isWorktree ? " wt-item" : "");
 
   var abbrev = document.createElement("span");
   abbrev.className = "mobile-project-abbrev";
@@ -1245,13 +1439,6 @@ function createMobileProjectItem(p, currentSlug) {
     el.appendChild(dot);
   }
 
-  if (p.unread > 0 && (!isActive || p.hasWorktreeUnread)) {
-    var badge = document.createElement("span");
-    badge.className = "mobile-project-unread";
-    badge.textContent = p.unread > 99 ? "99+" : String(p.unread);
-    el.appendChild(badge);
-  }
-
   el.addEventListener("click", function () {
     if (switchProject) switchProject(p.slug);
     if (closeSidebar) closeSidebar();
@@ -1263,30 +1450,12 @@ function createMobileProjectItem(p, currentSlug) {
 export function getEmojiCategories() { return EMOJI_CATEGORIES; }
 
 export function updateProjectBadge(slug, count) {
-  var targetSlug = slug;
-  for (var i = 0; i < cachedProjectList.length; i++) {
-    if (cachedProjectList[i].slug !== slug) continue;
-    cachedProjectList[i].unread = count;
-    if (cachedProjectList[i].isWorktree && cachedProjectList[i].parentSlug) {
-      targetSlug = cachedProjectList[i].parentSlug;
-    }
-    break;
-  }
-
-  var displayCount = count;
-  var grouped = groupProjects(cachedProjectList);
-  for (var pi = 0; pi < grouped.parents.length; pi++) {
-    if (grouped.parents[pi].slug !== targetSlug) continue;
-    displayCount = aggregateFamily(grouped.parents[pi], grouped.wtByParent[targetSlug] || []).unread;
-    break;
-  }
-
-  var icon = document.querySelector('.icon-strip-item[data-slug="' + targetSlug + '"]');
+  var icon = document.querySelector('.icon-strip-item[data-slug="' + slug + '"]');
   if (!icon) return;
   var badge = icon.querySelector(".icon-strip-project-badge");
   if (!badge) return;
-  if (displayCount > 0) {
-    badge.textContent = displayCount > 99 ? "99+" : String(displayCount);
+  if (count > 0) {
+    badge.textContent = count > 99 ? "99+" : String(count);
     badge.classList.add("has-unread");
   } else {
     badge.textContent = "";

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

@@ -251,11 +251,41 @@ export function handlePairCreated(msg) {
   return msg.group || null;
 }
 
+// --- Worker-pane composer notice -------------------------------------
+// Shown inside a pane iframe while ITS session is processing a delegated
+// turn: typing is allowed (queueing is correct behavior), the bar just
+// makes it visible that a new message joins the Driver's turn.
+var workerNoticeEl = null;
+
+export function showWorkerDelegationNotice(driverTitle) {
+  if (!store.get('paneMode')) return;
+  var inputArea = document.getElementById("input-area");
+  if (!inputArea || !inputArea.parentNode) return;
+  if (!workerNoticeEl) {
+    workerNoticeEl = document.createElement("div");
+    workerNoticeEl.className = "pane-delegation-notice";
+    inputArea.parentNode.insertBefore(workerNoticeEl, inputArea);
+  }
+  var who = driverTitle ? "“" + driverTitle + "”" : "the Driver";
+  workerNoticeEl.textContent = "Following an instruction from " + who + " — messages you send now join the same turn.";
+  workerNoticeEl.classList.add("visible");
+}
+
+export function hideWorkerDelegationNotice() {
+  if (workerNoticeEl) workerNoticeEl.classList.remove("visible");
+}
+
 export function handleSplitDelegation(msg) {
   var states = Object.assign({}, store.get('splitDelegations') || {});
   if (msg.active) states[msg.groupId] = msg;
   else delete states[msg.groupId];
   store.set({ splitDelegations: states });
+  // Inside the worker's own pane, mirror the delegation into the composer
+  // notice (the delegated user_message shows it too; this covers the end).
+  if (store.get('paneMode') && msg.to === store.get('activeSessionId')) {
+    if (msg.active) showWorkerDelegationNotice(null);
+    else hideWorkerDelegationNotice();
+  }
 }
 
 function sendSetPair(groupId, driverId) {

package/lib/public/modules/sticky-note-markdown.js

@@ -0,0 +1,89 @@
+// Markdown helpers for sticky-note titles, handoff bodies, and checklists.
+
+export function getTitle(text) {
+  if (!text) return "";
+  var idx = text.indexOf("\n");
+  return idx === -1 ? text : text.substring(0, idx);
+}
+
+function formatInline(text) {
+  var escaped = text
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;");
+  return escaped
+    .replace(/(https?:\/\/[^\s<]+)/g, '<a href="$1" target="_blank" rel="noopener">$1</a>')
+    .replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>")
+    .replace(/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, "<em>$1</em>")
+    .replace(/`([^`]+)`/g, "<code>$1</code>")
+    .replace(/~~(.+?)~~/g, "<del>$1</del>")
+    .replace(/^(?:-\s*)?\[[xX]\]/gm, '<span class="sn-check checked" role="checkbox" aria-checked="true" tabindex="0" contenteditable="false">✓</span>')
+    .replace(/^(?:-\s*)?\[ \]/gm, '<span class="sn-check" role="checkbox" aria-checked="false" tabindex="0" contenteditable="false">☐</span>')
+    .replace(/\n/g, "<br>");
+}
+
+export function renderMiniMarkdown(text) {
+  if (!text) return "";
+  var lines = text.split("\n");
+  var title = lines[0];
+  var body = lines.slice(1).join("\n");
+  var html = '<div class="sn-title">' + formatInline(title) + "</div>";
+  if (body.trim()) html += formatInline(body);
+  return html;
+}
+
+function childrenToMarkdown(element) {
+  var result = "";
+  for (var i = 0; i < element.childNodes.length; i++) {
+    result += nodeToMarkdown(element.childNodes[i]);
+  }
+  return result;
+}
+
+function nodeToMarkdown(node) {
+  if (node.nodeType === 3) return node.textContent;
+  if (node.nodeType !== 1) return "";
+
+  var tag = node.tagName;
+  var inner = childrenToMarkdown(node);
+  switch (tag) {
+    case "STRONG": case "B": return "**" + inner + "**";
+    case "EM": case "I": return "*" + inner + "*";
+    case "DEL": case "S": case "STRIKE": return "~~" + inner + "~~";
+    case "CODE": return "`" + inner + "`";
+    case "BR": return "\n";
+    case "DIV":
+      if (node.classList.contains("sn-title")) return inner;
+      if (node.classList.contains("sn-placeholder")) return "";
+      return "\n" + inner;
+    case "P": return "\n" + inner;
+    case "A": return node.getAttribute("href") || inner;
+    case "SPAN":
+      if (node.classList.contains("sn-check")) {
+        return node.classList.contains("checked") ? "- [x]" : "- [ ]";
+      }
+      if (node.classList.contains("sn-placeholder")) return "";
+      return inner;
+    default: return inner;
+  }
+}
+
+export function extractMarkdown(rendered) {
+  var titleEl = rendered.querySelector(".sn-title");
+  if (titleEl) {
+    var titleMarkdown = childrenToMarkdown(titleEl);
+    var rest = "";
+    var afterTitle = false;
+    for (var i = 0; i < rendered.childNodes.length; i++) {
+      var child = rendered.childNodes[i];
+      if (child === titleEl) {
+        afterTitle = true;
+        continue;
+      }
+      if (afterTitle) rest += nodeToMarkdown(child);
+    }
+    if (rest && rest.charAt(0) === "\n") rest = rest.substring(1);
+    return titleMarkdown + (rest ? "\n" + rest : "");
+  }
+  return childrenToMarkdown(rendered).replace(/^\n+/, "");
+}