clay-server 2.10.0 → 2.11.0-beta.10

package/lib/public/modules/sidebar.js

@@ -1651,7 +1651,7 @@ function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
   settingsItem.addEventListener("click", function (e) {
     e.stopPropagation();
     closeProjectCtxMenu();
-    openProjectSettings(slug, { slug: slug, name: name, icon: icon });
+    openProjectSettings(slug, { slug: slug, name: name, icon: icon, projectOwnerId: ctx.projectOwnerId });
   });
   menu.appendChild(settingsItem);
 
@@ -2087,7 +2087,8 @@ export function renderIconStrip(projects, currentSlug) {
   for (var i = 0; i < projects.length; i++) {
     var p = projects[i];
     var el = document.createElement("a");
-    el.className = "icon-strip-item" + (p.slug === currentSlug ? " active" : "");
+    var isActive = p.slug === currentSlug && !currentDmUserId;
+    el.className = "icon-strip-item" + (isActive ? " active" : "");
     el.href = "/p/" + p.slug + "/";
     el.dataset.slug = p.slug;
 
@@ -2144,7 +2145,7 @@ export function renderIconStrip(projects, currentSlug) {
   // Update home icon active state
   var homeIcon = document.querySelector(".icon-strip-home");
   if (homeIcon) {
-    if (!currentSlug || projects.length === 0) {
+    if ((!currentSlug || projects.length === 0) && !currentDmUserId) {
       homeIcon.classList.add("active");
     } else {
       homeIcon.classList.remove("active");
@@ -2193,13 +2194,118 @@ function renderProjectList(projects, currentSlug) {
 
 export function getEmojiCategories() { return EMOJI_CATEGORIES; }
 
+// --- User strip (DM targets) ---
+var cachedAllUsers = [];
+var cachedOnlineUserIds = [];
+var currentDmUserId = null;
+
+export function renderUserStrip(allUsers, onlineUserIds, myUserId) {
+  cachedAllUsers = allUsers || [];
+  cachedOnlineUserIds = onlineUserIds || [];
+  var container = document.getElementById("icon-strip-users");
+  if (!container) return;
+
+  // Filter out self, only show other users
+  var others = cachedAllUsers.filter(function (u) { return u.id !== myUserId; });
+
+  // Hide section if no other users (single-user mode or alone)
+  if (others.length === 0) {
+    container.innerHTML = "";
+    container.classList.add("hidden");
+    return;
+  }
+
+  container.classList.remove("hidden");
+  container.innerHTML = "";
+
+  for (var i = 0; i < others.length; i++) {
+    (function (u) {
+      var el = document.createElement("div");
+      el.className = "icon-strip-user";
+      el.dataset.userId = u.id;
+      if (u.id === currentDmUserId) el.classList.add("active");
+      if (onlineUserIds.indexOf(u.id) !== -1) el.classList.add("online");
+
+      var pill = document.createElement("span");
+      pill.className = "icon-strip-pill";
+      el.appendChild(pill);
+
+      var avatar = document.createElement("img");
+      avatar.className = "icon-strip-user-avatar";
+      avatar.src = "https://api.dicebear.com/9.x/" + (u.avatarStyle || "thumbs") + "/svg?seed=" + encodeURIComponent(u.avatarSeed || u.username) + "&size=34";
+      avatar.alt = u.displayName;
+      el.appendChild(avatar);
+
+      var onlineDot = document.createElement("span");
+      onlineDot.className = "icon-strip-user-online";
+      el.appendChild(onlineDot);
+
+      var badge = document.createElement("span");
+      badge.className = "icon-strip-user-badge";
+      badge.dataset.userId = u.id;
+      el.appendChild(badge);
+
+      // Tooltip
+      el.addEventListener("mouseenter", function () { showIconTooltip(el, u.displayName); });
+      el.addEventListener("mouseleave", hideIconTooltip);
+
+      // Click: open DM
+      el.addEventListener("click", function () {
+        if (ctx.openDm) ctx.openDm(u.id);
+      });
+
+      container.appendChild(el);
+    })(others[i]);
+  }
+
+  // Invite button at bottom of user strip (hidden for now)
+  // var inviteBtn = document.createElement("button");
+  // inviteBtn.className = "icon-strip-invite";
+  // inviteBtn.innerHTML = iconHtml("user-plus");
+  // inviteBtn.addEventListener("click", function () { triggerShare(); });
+  // inviteBtn.addEventListener("mouseenter", function () { showIconTooltip(inviteBtn, "Invite"); });
+  // inviteBtn.addEventListener("mouseleave", hideIconTooltip);
+  // container.appendChild(inviteBtn);
+  refreshIcons();
+}
+
+export function setCurrentDmUser(userId) {
+  currentDmUserId = userId;
+  // Update active state on user icons immediately
+  var container = document.getElementById("icon-strip-users");
+  if (!container) return;
+  var items = container.querySelectorAll(".icon-strip-user");
+  for (var i = 0; i < items.length; i++) {
+    if (items[i].dataset.userId === userId) {
+      items[i].classList.add("active");
+    } else {
+      items[i].classList.remove("active");
+    }
+  }
+}
+
+export function updateDmBadge(userId, count) {
+  var badge = document.querySelector('.icon-strip-user-badge[data-user-id="' + userId + '"]');
+  if (!badge) return;
+  if (count > 0) {
+    badge.textContent = count > 99 ? "99+" : String(count);
+    badge.classList.add("has-unread");
+  } else {
+    badge.textContent = "";
+    badge.classList.remove("has-unread");
+  }
+}
+
 export function initIconStrip(_ctx) {
   var addBtn = document.getElementById("icon-strip-add");
   if (addBtn) {
     addBtn.addEventListener("click", function () {
-      // Reuse existing add-project modal
-      var modal = _ctx.$("add-project-modal");
-      if (modal) modal.classList.remove("hidden");
+      if (_ctx.openAddProjectModal) {
+        _ctx.openAddProjectModal();
+      } else {
+        var modal = _ctx.$("add-project-modal");
+        if (modal) modal.classList.remove("hidden");
+      }
     });
     addBtn.addEventListener("mouseenter", function () { showIconTooltip(addBtn, "Add project"); });
     addBtn.addEventListener("mouseleave", hideIconTooltip);

package/lib/public/modules/terminal.js

@@ -225,6 +225,11 @@ function createXtermForTab(tab) {
     xterm.loadAddon(fitAddon);
   }
 
+  // Web links addon: make URLs clickable
+  if (typeof WebLinksAddon !== "undefined") {
+    xterm.loadAddon(new WebLinksAddon.WebLinksAddon());
+  }
+
   // Create a container div for this tab's terminal
   var bodyEl = document.createElement("div");
   bodyEl.className = "terminal-tab-body";
@@ -239,16 +244,35 @@ function createXtermForTab(tab) {
     }
   });
 
-  // Ctrl+V paste for Firefox (Firefox blocks xterm.js clipboard access)
-  bodyEl.addEventListener("keydown", function (e) {
+  // Cmd/Ctrl+C copy and Cmd/Ctrl+V paste: intercept before xterm swallows the event
+  xterm.attachCustomKeyEventHandler(function (e) {
+    if (e.type !== "keydown") return true;
+    // Cmd/Ctrl+C: copy selection if any, otherwise send SIGINT
+    if ((e.ctrlKey || e.metaKey) && e.key === "c") {
+      var sel = xterm.getSelection();
+      if (sel) {
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          navigator.clipboard.writeText(sel).catch(function () {});
+        }
+        return false; // prevent xterm from handling
+      }
+      // No selection on macOS Cmd+C: do nothing (not SIGINT)
+      if (e.metaKey) return false;
+    }
+    // Cmd/Ctrl+V: let browser handle paste event
     if ((e.ctrlKey || e.metaKey) && e.key === "v") {
+      return false; // let browser fire paste event
+    }
+    return true;
+  });
+
+  // Handle paste via browser paste event (works for Cmd+V, Ctrl+V, right-click paste)
+  bodyEl.addEventListener("paste", function (e) {
+    var text = (e.clipboardData || window.clipboardData).getData("text");
+    if (text) {
       e.preventDefault();
-      if (navigator.clipboard && navigator.clipboard.readText) {
-        navigator.clipboard.readText().then(function (text) {
-          if (text && ctx.ws && ctx.connected) {
-            ctx.ws.send(JSON.stringify({ type: "term_input", id: tab.id, data: text }));
-          }
-        }).catch(function () { /* permission denied or not available */ });
+      if (ctx.ws && ctx.connected) {
+        ctx.ws.send(JSON.stringify({ type: "term_input", id: tab.id, data: text }));
       }
     }
   });
@@ -598,10 +622,24 @@ function showTermCtxMenu(e, tab) {
   var menu = document.createElement("div");
   menu.className = "term-ctx-menu";
 
-  // Copy
+  // Copy selection
+  var sel = tab.xterm ? tab.xterm.getSelection() : "";
+  if (sel) {
+    var copySelItem = document.createElement("button");
+    copySelItem.className = "term-ctx-item";
+    copySelItem.innerHTML = iconHtml("copy") + " <span>Copy</span>";
+    copySelItem.addEventListener("click", function (ev) {
+      ev.stopPropagation();
+      closeTermCtxMenu();
+      if (sel) copyToClipboard(sel);
+    });
+    menu.appendChild(copySelItem);
+  }
+
+  // Copy entire console
   var copyItem = document.createElement("button");
   copyItem.className = "term-ctx-item";
-  copyItem.innerHTML = iconHtml("clipboard-copy") + " <span>Copy Terminal</span>";
+  copyItem.innerHTML = iconHtml("clipboard-copy") + " <span>Copy Console</span>";
   copyItem.addEventListener("click", function (ev) {
     ev.stopPropagation();
     closeTermCtxMenu();

package/lib/public/modules/tools.js

@@ -693,6 +693,207 @@ export function markPermissionCancelled(requestId) {
   delete pendingPermissions[requestId];
 }
 
+// --- MCP elicitation rendering ---
+
+var pendingElicitations = {};
+
+export function renderElicitationRequest(msg) {
+  if (pendingElicitations[msg.requestId]) return;
+  ctx.finalizeAssistantBlock();
+  stopThinking();
+  closeToolGroup();
+
+  var container = document.createElement("div");
+  container.className = "permission-container elicitation-container";
+  container.dataset.requestId = msg.requestId;
+
+  // Header
+  var header = document.createElement("div");
+  header.className = "permission-header";
+  header.innerHTML =
+    '<span class="permission-icon">' + iconHtml("key") + '</span>' +
+    '<span class="permission-title">' + escapeHtml(msg.serverName || "MCP Server") + ' requests input</span>';
+
+  // Body
+  var body = document.createElement("div");
+  body.className = "permission-body";
+
+  if (msg.message) {
+    var messageEl = document.createElement("div");
+    messageEl.className = "permission-reason";
+    messageEl.textContent = msg.message;
+    body.appendChild(messageEl);
+  }
+
+  // Form fields (form mode) or URL button (url mode)
+  var formData = {};
+
+  if (msg.mode === "url" && msg.url) {
+    var urlInfo = document.createElement("div");
+    urlInfo.className = "elicitation-url-info";
+    urlInfo.style.cssText = "margin-top: 8px; font-size: 12px; color: var(--text-muted);";
+    urlInfo.textContent = "Opens: " + msg.url;
+    body.appendChild(urlInfo);
+  } else if (msg.requestedSchema && msg.requestedSchema.properties) {
+    var formEl = document.createElement("div");
+    formEl.className = "elicitation-form";
+    formEl.style.cssText = "margin-top: 8px; display: flex; flex-direction: column; gap: 8px;";
+
+    var props = msg.requestedSchema.properties;
+    var required = msg.requestedSchema.required || [];
+    var propNames = Object.keys(props);
+    for (var i = 0; i < propNames.length; i++) {
+      var propName = propNames[i];
+      var prop = props[propName];
+      var isRequired = required.indexOf(propName) !== -1;
+
+      var fieldWrapper = document.createElement("div");
+      fieldWrapper.style.cssText = "display: flex; flex-direction: column; gap: 2px;";
+
+      var label = document.createElement("label");
+      label.style.cssText = "font-size: 12px; font-weight: 500; color: var(--text-secondary);";
+      label.textContent = propName + (isRequired ? " *" : "");
+      if (prop.description) {
+        label.title = prop.description;
+      }
+
+      var input;
+      if (prop.type === "boolean") {
+        input = document.createElement("input");
+        input.type = "checkbox";
+        input.dataset.propName = propName;
+        input.dataset.propType = "boolean";
+      } else if (prop.enum) {
+        input = document.createElement("select");
+        input.dataset.propName = propName;
+        input.dataset.propType = "enum";
+        input.style.cssText = "padding: 4px 8px; border-radius: 4px; border: 1px solid var(--border); background: var(--input-bg); color: var(--text-primary); font-size: 13px;";
+        for (var ei = 0; ei < prop.enum.length; ei++) {
+          var opt = document.createElement("option");
+          opt.value = prop.enum[ei];
+          opt.textContent = prop.enum[ei];
+          input.appendChild(opt);
+        }
+      } else {
+        input = document.createElement("input");
+        input.type = prop.type === "number" || prop.type === "integer" ? "number" : "text";
+        input.dataset.propName = propName;
+        input.dataset.propType = prop.type || "string";
+        input.placeholder = prop.description || propName;
+        input.style.cssText = "padding: 4px 8px; border-radius: 4px; border: 1px solid var(--border); background: var(--input-bg); color: var(--text-primary); font-size: 13px;";
+      }
+
+      fieldWrapper.appendChild(label);
+      fieldWrapper.appendChild(input);
+      formEl.appendChild(fieldWrapper);
+    }
+    body.appendChild(formEl);
+  }
+
+  // Actions
+  var actions = document.createElement("div");
+  actions.className = "permission-actions";
+
+  var acceptBtn = document.createElement("button");
+  acceptBtn.className = "permission-btn permission-allow";
+
+  if (msg.mode === "url" && msg.url) {
+    acceptBtn.textContent = "Open & Approve";
+    acceptBtn.addEventListener("click", function () {
+      window.open(msg.url, "_blank");
+      sendElicitationResponse(container, msg.requestId, "accept", {});
+    });
+  } else {
+    acceptBtn.textContent = "Submit";
+    acceptBtn.addEventListener("click", function () {
+      // Collect form values
+      var content = {};
+      var inputs = container.querySelectorAll("[data-prop-name]");
+      for (var j = 0; j < inputs.length; j++) {
+        var inp = inputs[j];
+        var name = inp.dataset.propName;
+        var pType = inp.dataset.propType;
+        if (pType === "boolean") {
+          content[name] = inp.checked;
+        } else if (pType === "number" || pType === "integer") {
+          content[name] = Number(inp.value);
+        } else {
+          content[name] = inp.value;
+        }
+      }
+      sendElicitationResponse(container, msg.requestId, "accept", content);
+    });
+  }
+
+  var denyBtn = document.createElement("button");
+  denyBtn.className = "permission-btn permission-deny";
+  denyBtn.textContent = "Deny";
+  denyBtn.addEventListener("click", function () {
+    sendElicitationResponse(container, msg.requestId, "reject", null);
+  });
+
+  actions.appendChild(acceptBtn);
+  actions.appendChild(denyBtn);
+
+  container.appendChild(header);
+  container.appendChild(body);
+  container.appendChild(actions);
+  ctx.addToMessages(container);
+
+  pendingElicitations[msg.requestId] = container;
+  refreshIcons();
+  ctx.setActivity(null);
+  ctx.scrollToBottom();
+}
+
+function sendElicitationResponse(container, requestId, action, content) {
+  if (container.classList.contains("resolved")) return;
+  container.classList.add("resolved");
+  if (ctx.stopUrgentBlink) ctx.stopUrgentBlink();
+
+  var label = action === "reject" ? "Denied" : "Submitted";
+  var resolvedClass = action === "reject" ? "resolved-denied" : "resolved-allowed";
+  container.classList.add(resolvedClass);
+
+  var actions = container.querySelector(".permission-actions");
+  if (actions) {
+    actions.innerHTML = '<span class="permission-decision-label">' + label + '</span>';
+  }
+
+  if (ctx.ws && ctx.connected) {
+    var msg = {
+      type: "elicitation_response",
+      requestId: requestId,
+      action: action,
+    };
+    if (action === "accept" && content) {
+      msg.content = content;
+    }
+    ctx.ws.send(JSON.stringify(msg));
+  }
+
+  delete pendingElicitations[requestId];
+}
+
+export function markElicitationResolved(requestId, action) {
+  var container = pendingElicitations[requestId];
+  if (!container) {
+    container = ctx.messagesEl.querySelector('.elicitation-container[data-request-id="' + requestId + '"]');
+  }
+  if (!container || container.classList.contains("resolved")) return;
+
+  container.classList.add("resolved");
+  var isDeny = action === "reject";
+  container.classList.add(isDeny ? "resolved-denied" : "resolved-allowed");
+
+  var label = isDeny ? "Denied" : "Submitted";
+  var actionsEl = container.querySelector(".permission-actions");
+  if (actionsEl) {
+    actionsEl.innerHTML = '<span class="permission-decision-label">' + label + '</span>';
+  }
+  delete pendingElicitations[requestId];
+}
+
 // --- Plan mode rendering ---
 export function renderPlanBanner(type) {
   ctx.finalizeAssistantBlock();
@@ -1504,7 +1705,7 @@ function fmtDuration(ms) {
   return secs + "s";
 }
 
-export function updateSubagentProgress(parentToolId, usage, lastToolName) {
+export function updateSubagentProgress(parentToolId, usage, lastToolName, summary) {
   var tool = tools[parentToolId];
   if (!tool || !tool.el) return;
   var progressEl = tool.el.querySelector(".subagent-progress");
@@ -1523,6 +1724,17 @@ export function updateSubagentProgress(parentToolId, usage, lastToolName) {
   }
   if (lastToolName) parts.push(lastToolName);
   progressEl.textContent = parts.join(" · ");
+
+  // AI-generated progress summary (agentProgressSummaries)
+  if (summary) {
+    var summaryEl = tool.el.querySelector(".subagent-summary");
+    if (!summaryEl) {
+      summaryEl = document.createElement("div");
+      summaryEl.className = "subagent-summary";
+      progressEl.parentNode.insertBefore(summaryEl, progressEl.nextSibling);
+    }
+    summaryEl.textContent = summary;
+  }
 }
 
 export function initSubagentStop(parentToolId, taskId) {
@@ -1640,6 +1852,7 @@ export function resetToolState() {
   todoWidgetVisible = true;
   if (todoObserver) { todoObserver.disconnect(); todoObserver = null; }
   pendingPermissions = {};
+  pendingElicitations = {};
   currentToolGroup = null;
   toolGroupCounter = 0;
   toolGroups = {};