clay-server 3.8.1 → 4.0.0-beta.2

package/lib/public/modules/home-mate-model-picker.js

@@ -0,0 +1,281 @@
+// Vendor-aware Mate model chooser hosted by the centered Mate settings dialog.
+
+import { getWs } from './ws-ref.js';
+
+var activeMateId = null;
+var activeMateName = "Mate";
+var state = null;
+var requestId = null;
+var selectionRequestId = null;
+var selectionModel = null;
+var activeSessionId = null;
+var requestSequence = 0;
+
+function nextRequestId(prefix) {
+  requestSequence++;
+  return prefix + "-" + Date.now() + "-" + requestSequence;
+}
+
+function send(message) {
+  var ws = getWs();
+  if (!ws || ws.readyState !== 1) return false;
+  ws.send(JSON.stringify(message));
+  return true;
+}
+
+function modelValue(entry) {
+  if (!entry) return "";
+  if (typeof entry === "string") return entry;
+  return entry.value || entry.id || "";
+}
+
+function modelLabel(entry) {
+  if (typeof entry === "string") return entry;
+  return entry.displayName || entry.label || entry.name || modelValue(entry) || "Model";
+}
+
+function vendorLabel(vendor) {
+  var vendors = state && state.vendors ? state.vendors : [];
+  for (var i = 0; i < vendors.length; i++) {
+    if (vendors[i] && vendors[i].id === vendor) return vendors[i].displayName || vendor;
+  }
+  return vendor || "Vendor";
+}
+
+function findFocusTarget(kind, value) {
+  if (kind === "retry") return document.querySelector(".home-mate-settings-dialog .home-mate-model-retry");
+  if (kind === "selection-status") return document.querySelector(".home-mate-settings-dialog .home-mate-model-selection-status");
+  var selector = kind === "vendor" ? ".home-mate-settings-dialog [data-home-mate-vendor]" : ".home-mate-settings-dialog [data-home-mate-model]";
+  var datasetKey = kind === "vendor" ? "homeMateVendor" : "homeMateModel";
+  var options = document.querySelectorAll(selector);
+  for (var i = 0; i < options.length; i++) {
+    if (options[i].dataset[datasetKey] === value) return options[i];
+  }
+  return null;
+}
+
+function rerenderAndFocus(rerender, kind, value) {
+  rerender();
+  if (!kind) return;
+  var target = findFocusTarget(kind, value);
+  if (target) target.focus({ preventScroll: true });
+}
+
+export function resetHomeMateModelPicker(mateId, mateName, mate, sessionId) {
+  activeMateId = mateId;
+  activeMateName = mateName || "Mate";
+  requestId = null;
+  selectionRequestId = null;
+  selectionModel = null;
+  activeSessionId = sessionId || null;
+  state = {
+    status: "loading",
+    vendor: mate && mate.vendor ? mate.vendor : "",
+    model: mate && mate.model ? mate.model : "",
+    mateVendor: mate && mate.vendor ? mate.vendor : "",
+    mateModel: mate && mate.model ? mate.model : "",
+    vendors: [],
+    models: [],
+    error: "",
+  };
+}
+
+export function clearHomeMateModelPicker() {
+  activeMateId = null;
+  activeMateName = "Mate";
+  state = null;
+  requestId = null;
+  selectionRequestId = null;
+  selectionModel = null;
+  activeSessionId = null;
+}
+
+export function requestHomeMateModels(vendor, rerender, focusAfter) {
+  if (!activeMateId || !state || selectionRequestId) return;
+  var requestedVendor = vendor || state.vendor || state.mateVendor;
+  requestId = nextRequestId("home-mate-models");
+  state.vendor = requestedVendor;
+  state.status = "loading";
+  state.models = [];
+  state.error = "";
+  rerenderAndFocus(rerender, focusAfter ? "vendor" : "", requestedVendor);
+  if (send({ type: "home_mate_models_get", mateId: activeMateId, vendor: requestedVendor, requestId: requestId })) return;
+  state.status = "error";
+  state.error = "Clay is offline. Reconnect and try again.";
+  rerenderAndFocus(rerender, "retry", "");
+}
+
+function selectMateModel(model, rerender) {
+  if (!state || selectionRequestId || !model || !state.vendor) return;
+  selectionRequestId = nextRequestId("home-mate-model-set");
+  selectionModel = model;
+  state.error = "";
+  rerenderAndFocus(rerender, "selection-status", "");
+  var message = { type: "home_mate_model_set", mateId: activeMateId, vendor: state.vendor, model: model, requestId: selectionRequestId };
+  if (activeSessionId) message.sessionId = activeSessionId;
+  if (send(message)) return;
+  selectionRequestId = null;
+  selectionModel = null;
+  state.error = "Clay is offline. Reconnect and try again.";
+  rerenderAndFocus(rerender, "model", model);
+}
+
+function appendHeading(body, text) {
+  var heading = document.createElement("h3");
+  heading.className = "home-mate-model-section-label";
+  heading.textContent = text;
+  body.appendChild(heading);
+}
+
+function renderVendors(body, rerender) {
+  appendHeading(body, "Vendor");
+  var list = document.createElement("div");
+  list.className = "home-mate-vendor-list";
+  list.setAttribute("role", "group");
+  list.setAttribute("aria-label", "Vendor for " + activeMateName);
+  var vendors = state.vendors || [];
+  for (var i = 0; i < vendors.length; i++) {
+    (function (vendor) {
+      if (!vendor || !vendor.id) return;
+      var button = document.createElement("button");
+      button.type = "button";
+      button.className = "home-mate-vendor-option";
+      button.dataset.homeMateVendor = vendor.id;
+      button.textContent = vendor.displayName || vendor.id;
+      button.setAttribute("aria-pressed", vendor.id === state.vendor ? "true" : "false");
+      button.disabled = !!selectionRequestId;
+      if (vendor.id === state.mateVendor) button.title = "Current Mate vendor";
+      button.addEventListener("click", function () {
+        if (vendor.id !== state.vendor) requestHomeMateModels(vendor.id, rerender, true);
+      });
+      list.appendChild(button);
+    })(vendors[i]);
+  }
+  if (!vendors.length) {
+    var waiting = document.createElement("span");
+    waiting.className = "home-mate-model-muted";
+    waiting.textContent = "Loading available vendors…";
+    list.appendChild(waiting);
+  }
+  body.appendChild(list);
+}
+
+function appendLoadState(body, rerender) {
+  var loadState = document.createElement("div");
+  loadState.className = "home-mate-model-state";
+  if (state.status === "loading") {
+    loadState.classList.add("home-mate-model-loading");
+    loadState.setAttribute("role", "status");
+    loadState.dataset.homeModelFocus = "catalog-status";
+    loadState.tabIndex = -1;
+    loadState.textContent = "Loading " + vendorLabel(state.vendor) + " models…";
+  } else {
+    if (state.status === "error") loadState.setAttribute("role", "alert");
+    loadState.textContent = state.error || "No models are available for this vendor.";
+    var retry = document.createElement("button");
+    retry.type = "button";
+    retry.className = "home-mate-model-retry";
+    retry.dataset.homeModelFocus = "catalog-status";
+    retry.textContent = "Try again";
+    retry.addEventListener("click", function () { requestHomeMateModels(state.vendor, rerender, false); });
+    loadState.appendChild(retry);
+  }
+  body.appendChild(loadState);
+}
+
+function renderModels(body, rerender) {
+  appendHeading(body, "Model");
+  if (state.status !== "ready") {
+    appendLoadState(body, rerender);
+    return;
+  }
+  var list = document.createElement("div");
+  list.className = "home-mate-model-list";
+  list.setAttribute("role", "group");
+  list.setAttribute("aria-label", "Models from " + vendorLabel(state.vendor) + " for " + activeMateName);
+  var models = state.models || [];
+  for (var i = 0; i < models.length; i++) {
+    (function (entry) {
+      var value = modelValue(entry);
+      if (!value) return;
+      var button = document.createElement("button");
+      button.type = "button";
+      button.className = "home-mate-model-option";
+      button.dataset.homeMateModel = value;
+      button.setAttribute("aria-pressed", state.vendor === state.mateVendor && value === state.mateModel ? "true" : "false");
+      button.disabled = !!selectionRequestId;
+      var label = document.createElement("span");
+      label.textContent = modelLabel(entry);
+      var id = document.createElement("small");
+      id.textContent = value;
+      button.appendChild(label);
+      button.appendChild(id);
+      button.addEventListener("click", function () { selectMateModel(value, rerender); });
+      list.appendChild(button);
+    })(models[i]);
+  }
+  body.appendChild(list);
+  var status = document.createElement("div");
+  status.className = "home-mate-model-selection-status";
+  status.setAttribute("aria-live", "polite");
+  if (selectionRequestId) {
+    status.dataset.homeMateModel = selectionModel;
+    status.tabIndex = -1;
+  }
+  status.textContent = selectionRequestId ? "Saving vendor and model…" : (state.error || "");
+  body.appendChild(status);
+}
+
+export function renderHomeMateModelPicker(body, rerender) {
+  var note = document.createElement("p");
+  note.className = "home-mate-model-note";
+  note.textContent = activeSessionId ? "Used for this draft and future new conversations. Conversations with activity keep their committed vendor and model." : "Used for new conversations. Existing conversations keep their current vendor and model.";
+  body.appendChild(note);
+  if (!state) return;
+  if (state.mateVendor && state.mateModel) {
+    var current = document.createElement("p");
+    current.className = "home-mate-model-current";
+    current.textContent = "Current · " + vendorLabel(state.mateVendor) + " · " + state.mateModel;
+    body.appendChild(current);
+  }
+  renderVendors(body, rerender);
+  renderModels(body, rerender);
+}
+
+export function applyHomeMateModelsState(msg) {
+  if (!state || msg.mateId !== activeMateId || msg.requestId !== requestId) return false;
+  state.status = msg.status || "empty";
+  state.vendor = msg.vendor || state.vendor;
+  state.model = msg.model || "";
+  state.mateVendor = msg.mateVendor || state.mateVendor;
+  state.mateModel = msg.mateModel || state.mateModel;
+  state.vendors = Array.isArray(msg.vendors) ? msg.vendors : state.vendors;
+  state.models = Array.isArray(msg.models) ? msg.models : [];
+  state.error = msg.error || "";
+  return true;
+}
+
+export function applyHomeMateModelResult(msg) {
+  if (!state || msg.mateId !== activeMateId || msg.requestId !== selectionRequestId) return false;
+  selectionRequestId = null;
+  selectionModel = null;
+  if (!msg.ok) {
+    state.error = msg.error || "Could not save this vendor and model.";
+    return true;
+  }
+  state.mateVendor = msg.vendor || state.vendor;
+  state.mateModel = msg.model || state.model;
+  state.model = state.mateModel;
+  state.error = msg.requestedSessionId && !msg.sessionApplied ? (msg.sessionReason || "Mate default updated. This conversation keeps its committed model.") : "";
+  window.dispatchEvent(new CustomEvent("clay:home-mate-model-confirmed", { detail: {
+    mateId: msg.mateId,
+    vendor: state.mateVendor,
+    model: state.mateModel,
+    requestedSessionId: msg.requestedSessionId || null,
+    sessionId: msg.sessionId || null,
+    sessionApplied: msg.sessionApplied === true,
+    sessionVendor: msg.sessionVendor || null,
+    sessionModel: msg.sessionModel || null,
+  } }));
+  return true;
+}

package/lib/public/modules/home-mate-selection.js

@@ -0,0 +1,38 @@
+// Pure Home Mate selection policy shared by rendering and focused tests.
+
+export function findHomeMate(mates, mateId) {
+  if (!mateId) return null;
+  for (var i = 0; i < mates.length; i++) {
+    if (mates[i] && mates[i].id === mateId) return mates[i];
+  }
+  return null;
+}
+
+export function resolveHomeMate(mates, currentMateId, preferredMateId) {
+  var visibleMates = Array.isArray(mates) ? mates : [];
+  var currentMate = findHomeMate(visibleMates, currentMateId);
+  if (currentMate) return currentMate;
+  var preferredMate = findHomeMate(visibleMates, preferredMateId);
+  if (preferredMate) return preferredMate;
+  for (var i = 0; i < visibleMates.length; i++) {
+    if (visibleMates[i] && visibleMates[i].builtinKey === "clay") return visibleMates[i];
+  }
+  return null;
+}
+
+export function getHomeMateName(mate) {
+  var profile = mate && mate.profile ? mate.profile : {};
+  return profile.displayName || (mate && (mate.displayName || mate.name)) || "Mate";
+}
+
+export function getHomeMateBio(mate) {
+  var profile = mate && mate.profile ? mate.profile : {};
+  return mate ? profile.bio || mate.bio || profile.description || mate.description || "" : "";
+}
+
+export function getHomeMateShortBio(mate) {
+  var bio = getHomeMateBio(mate).replace(/\s+/g, " ").trim();
+  if (!bio) return "Bring an idea, a task, or a question.";
+  if (bio.length > 120) return bio.slice(0, 117).trim() + "...";
+  return bio;
+}

package/lib/public/modules/home-mate-settings-menu.js

@@ -0,0 +1,131 @@
+// Accessible row-local menu that opens the centered Mate settings dialog.
+
+import { iconHtml, refreshIcons } from './icons.js';
+import { openHomeMateSettings } from './home-mate-settings.js';
+
+var menu = null;
+var menuTrigger = null;
+
+function getMateName(mate) {
+  var profile = mate && mate.profile ? mate.profile : {};
+  return profile.displayName || (mate && (mate.displayName || mate.name)) || "Mate";
+}
+
+function positionMenu() {
+  if (!menu || !menuTrigger || !menuTrigger.isConnected) return;
+  var rect = menuTrigger.getBoundingClientRect();
+  var menuRect = menu.getBoundingClientRect();
+  var left = Math.min(window.innerWidth - menuRect.width - 8, Math.max(8, rect.right - menuRect.width));
+  var top = rect.bottom + 5;
+  if (top + menuRect.height > window.innerHeight - 8) top = Math.max(8, rect.top - menuRect.height - 5);
+  menu.style.left = left + "px";
+  menu.style.top = top + "px";
+}
+
+function menuItems() {
+  return menu ? menu.querySelectorAll('[role="menuitem"]') : [];
+}
+
+function closeMenu(returnFocus) {
+  var trigger = menuTrigger;
+  if (menu) menu.remove();
+  if (trigger) trigger.setAttribute("aria-expanded", "false");
+  menu = null;
+  menuTrigger = null;
+  document.removeEventListener("pointerdown", handleMenuOutside, true);
+  document.removeEventListener("keydown", handleMenuKeydown, true);
+  window.removeEventListener("resize", closeMenuOnViewportChange);
+  if (returnFocus && trigger && trigger.isConnected) trigger.focus({ preventScroll: true });
+}
+
+function closeMenuOnViewportChange() {
+  closeMenu(false);
+}
+
+function handleMenuOutside(event) {
+  if (menu && !menu.contains(event.target) && event.target !== menuTrigger) closeMenu(false);
+}
+
+function handleMenuKeydown(event) {
+  if (!menu) return;
+  var items = menuItems();
+  if (event.key === "Escape") {
+    event.preventDefault();
+    event.stopPropagation();
+    closeMenu(true);
+    return;
+  }
+  if (event.key !== "ArrowDown" && event.key !== "ArrowUp" && event.key !== "Home" && event.key !== "End") return;
+  event.preventDefault();
+  var current = Array.prototype.indexOf.call(items, document.activeElement);
+  var next = 0;
+  if (event.key === "End") next = items.length - 1;
+  else if (event.key === "ArrowUp") next = current <= 0 ? items.length - 1 : current - 1;
+  else if (event.key === "ArrowDown") next = current < 0 || current === items.length - 1 ? 0 : current + 1;
+  if (items[next]) items[next].focus();
+}
+
+function openMenu(trigger, mate) {
+  closeMenu(false);
+  menuTrigger = trigger;
+  trigger.setAttribute("aria-expanded", "true");
+  menu = document.createElement("div");
+  menu.className = "home-mate-row-menu";
+  menu.setAttribute("role", "menu");
+  menu.setAttribute("aria-label", "Actions for " + getMateName(mate));
+  var settings = document.createElement("button");
+  settings.type = "button";
+  settings.className = "home-mate-row-menu-item";
+  settings.setAttribute("role", "menuitem");
+  settings.innerHTML = iconHtml("settings-2") + "<span>Mate settings</span>";
+  settings.addEventListener("click", function (event) {
+    event.stopPropagation();
+    var opener = trigger;
+    closeMenu(false);
+    openHomeMateSettings(mate.id, opener);
+  });
+  menu.appendChild(settings);
+  document.body.appendChild(menu);
+  refreshIcons();
+  requestAnimationFrame(function () {
+    positionMenu();
+    settings.focus({ preventScroll: true });
+  });
+  document.addEventListener("pointerdown", handleMenuOutside, true);
+  document.addEventListener("keydown", handleMenuKeydown, true);
+  window.addEventListener("resize", closeMenuOnViewportChange);
+}
+
+export function createHomeMateSettingsTrigger(mate) {
+  var trigger = document.createElement("button");
+  trigger.type = "button";
+  trigger.className = "home-mate-list-overflow";
+  trigger.dataset.homeMateId = mate.id;
+  trigger.setAttribute("aria-label", "Actions for " + getMateName(mate));
+  trigger.setAttribute("title", "Mate actions");
+  trigger.setAttribute("aria-haspopup", "menu");
+  trigger.setAttribute("aria-expanded", "false");
+  trigger.innerHTML = '<span class="home-mate-list-overflow-mark" aria-hidden="true">•••</span>';
+  trigger.addEventListener("click", function (event) {
+    event.preventDefault();
+    event.stopPropagation();
+    if (menu && menuTrigger === trigger) closeMenu(false);
+    else openMenu(trigger, mate);
+  });
+  trigger.addEventListener("keydown", function (event) {
+    if (event.key !== "ArrowDown" && event.key !== "ArrowUp" && event.key !== "Home" && event.key !== "End") return;
+    event.preventDefault();
+    event.stopPropagation();
+    openMenu(trigger, mate);
+    requestAnimationFrame(function () {
+      var items = menuItems();
+      if (!items.length) return;
+      items[event.key === "ArrowUp" || event.key === "End" ? items.length - 1 : 0].focus();
+    });
+  });
+  return trigger;
+}
+
+export function disposeHomeMateSettingsMenu() {
+  closeMenu(false);
+}