clay-server 4.0.0-beta.2 → 4.0.0-beta.21

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

@@ -2,10 +2,10 @@
 // Extracted from app.js (PR-34)
 
 import { refreshIcons, iconHtml } from './icons.js';
-import { escapeHtml, copyToClipboard } from './utils.js';
 import { getWs } from './ws-ref.js';
 import { updateBrowserTabList } from './context-sources.js';
 import { setExtensionConnected } from './mcp-ui.js';
+import { initPasteModal } from './paste-modal.js';
 
 // --- Module-owned state ---
 var confirmCallback = null;
@@ -44,6 +44,7 @@ export function flushPendingExtMessages() {
 }
 
 export function initMisc() {
+  initPasteModal();
   // --- Confirm modal listeners ---
   var confirmModal = document.getElementById("confirm-modal");
   var confirmOk = document.getElementById("confirm-ok");
@@ -258,19 +259,6 @@ export function closeImageModal() {
   if (modal) modal.classList.add("hidden");
 }
 
-export function showPasteModal(text) {
-  var modal = document.getElementById("paste-modal");
-  var body = document.getElementById("paste-modal-body");
-  if (!modal || !body) return;
-  body.textContent = text;
-  modal.classList.remove("hidden");
-}
-
-export function closePasteModal() {
-  var modal = document.getElementById("paste-modal");
-  if (modal) modal.classList.add("hidden");
-}
-
 export function showConfirm(text, onConfirm, okLabel, destructive) {
   var confirmText = document.getElementById("confirm-text");
   var confirmOk = document.getElementById("confirm-ok");

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

@@ -14,6 +14,7 @@ import { openTuiModal } from './tui-attention.js';
 import { requestVendorLogin } from './vendor-login.js';
 import { startUrgentBlink, stopUrgentBlink } from './app-favicon.js';
 import { playDoneSound, isNotifSoundEnabled } from './notifications.js';
+import { attachSnoozeControl, setSnoozeBannerRemover } from './update-snooze.js';
 var notifications = [];
 var unreadCount = 0;
 var bannerContainer = null;
@@ -56,6 +57,10 @@ export function initAppNotifications() {
   bellBtn = document.getElementById("notif-center-btn");
   badgeEl = document.getElementById("notif-center-badge");
 
+  // Banner teardown lives here (exit animation, clear-all sync), so the
+  // snooze module borrows it rather than importing this module back.
+  setSnoozeBannerRemover(removeBanner);
+
   // Split panes are secondary clients inside the parent shell. They keep
   // notification state in sync, but the parent owns the single visible
   // banner surface for the whole split view.
@@ -708,13 +713,11 @@ export function showUpdateBanner(msg) {
   banner.setAttribute("data-notif-id", "_update");
   banner.setAttribute("data-update-version", msg.version);
 
-  var actionsHtml = '';
-  if (!isHeadless) {
-    actionsHtml =
-      '<div class="notif-banner-actions">' +
-        '<button class="notif-banner-update-now">Update now</button>' +
-      '</div>';
-  }
+  // Headless installs update from the shell, so they get no install button —
+  // but they still get the action row, because Snooze applies either way.
+  var actionsHtml = '<div class="notif-banner-actions">' +
+    (isHeadless ? '' : '<button class="notif-banner-update-now">Update now</button>') +
+    '</div>';
 
   banner.innerHTML =
     '<div class="notif-banner-icon"><img src="/clay-studio-symbol.png" width="32" height="32" alt="Clay Studio"></div>' +
@@ -729,6 +732,7 @@ export function showUpdateBanner(msg) {
     '<button class="notif-banner-close">' + iconHtml("x") + '</button>';
 
   bannerContainer.appendChild(banner);
+  attachSnoozeControl(banner.querySelector(".notif-banner-actions"));
   refreshIcons();
 
   requestAnimationFrame(function () {

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

@@ -10,7 +10,7 @@ import { setupModelPicker, renderModelPicker, requestVendorModels, prepareModelP
 
 // --- Module-owned state (not in store) ---
 var sessionUsage = { cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
-var contextData = { contextWindow: 0, maxOutputTokens: 0, model: "-", cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
+var contextData = { contextWindow: 0, maxOutputTokens: 0, model: "-", cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0, thinking: null, costBasis: null };
 var ctxPopoverEl = null;
 var ctxHoverTimer = null;
 var statusRefreshTimer = null;
@@ -72,6 +72,10 @@ var contextCacheReadEl = null;
 var contextCacheWriteEl = null;
 var contextModelEl = null;
 var contextCostEl = null;
+var contextThinkingEl = null;
+var contextThinkingRow = null;
+var contextCostBasisEl = null;
+var contextCostBasisRow = null;
 var contextTurnsEl = null;
 var contextMini = null;
 var contextMiniFill = null;
@@ -87,7 +91,7 @@ var MODE_FULL_AUTO = { value: "bypassPermissions", label: "Full auto" };
 var EFFORT_LEVELS = ["low", "medium", "high", "xhigh", "max"];
 var EFFORT_LEVELS_BY_VENDOR = {
   claude: ["low", "medium", "high", "xhigh", "max"],
-  codex: ["minimal", "low", "medium", "high", "xhigh"],
+  codex: ["low", "medium", "high", "xhigh", "max"],
   antigravity: [],
   opencode: [],
   kiro: ["low", "medium", "high", "xhigh", "max"],
@@ -111,7 +115,8 @@ var CODEX_WEBSEARCH_OPTIONS = [
 var KNOWN_CONTEXT_WINDOWS = {
   "opus-4-6": 1000000,
   "claude-sonnet-4": 1000000,
-  "gpt-5.6": 272000,
+  "gpt-6-astra": 1050000,
+  "gpt-5.6": 1050000,
   "gpt-5.5": 1048576,
   "gpt-5.4": 1048576,
   "gpt-5.3": 1048576,
@@ -449,6 +454,10 @@ export function initPanels() {
   contextCacheWriteEl = $("context-cache-write");
   contextModelEl = $("context-model");
   contextCostEl = $("context-cost");
+  contextThinkingEl = $("context-thinking");
+  contextThinkingRow = $("context-thinking-row");
+  contextCostBasisEl = $("context-cost-basis");
+  contextCostBasisRow = $("context-cost-basis-row");
   contextTurnsEl = $("context-turns");
   contextMini = $("context-mini");
   contextMiniFill = $("context-mini-fill");
@@ -776,6 +785,16 @@ export function updateContextPanel() {
   contextCacheWriteEl.textContent = formatTokens(contextData.cacheWrite);
   contextModelEl.textContent = contextData.model;
   contextCostEl.textContent = "$" + contextData.cost.toFixed(4);
+  // Optional SDK fields: shown only once the CLI has actually reported them.
+  if (contextThinkingRow && contextThinkingEl) {
+    var hasThinking = typeof contextData.thinking === "number";
+    contextThinkingRow.classList.toggle("hidden", !hasThinking);
+    if (hasThinking) contextThinkingEl.textContent = formatTokens(contextData.thinking);
+  }
+  if (contextCostBasisRow && contextCostBasisEl) {
+    contextCostBasisRow.classList.toggle("hidden", !contextData.costBasis);
+    if (contextData.costBasis) contextCostBasisEl.textContent = contextData.costBasis;
+  }
   contextTurnsEl.textContent = String(contextData.turns);
 }
 
@@ -811,6 +830,29 @@ export function accumulateContext(cost, usage, modelUsage, lastStreamInputTokens
       contextData.model = displayModel;
       contextData.contextWindow = resolveContextWindow(displayModel, mu.contextWindow);
       if (mu.maxOutputTokens) contextData.maxOutputTokens = mu.maxOutputTokens;
+
+      // thinkingTokens and costBasis are per-model and optional: absent on
+      // older CLI builds and, for a resumed session, on the turns that ran
+      // before the field existed. Leave them null in that case so the rows
+      // stay hidden rather than claiming a confident zero.
+      var thinkingTotal = null;
+      var basis = null;
+      var basisMixed = false;
+      for (var mi = 0; mi < models.length; mi++) {
+        var entry = modelUsage[models[mi]];
+        if (!entry) continue;
+        if (typeof entry.thinkingTokens === "number") {
+          thinkingTotal = (thinkingTotal || 0) + entry.thinkingTokens;
+        }
+        if (entry.costBasis) {
+          if (basis === null) basis = entry.costBasis;
+          else if (basis !== entry.costBasis) basisMixed = true;
+        }
+      }
+      contextData.thinking = thinkingTotal;
+      // Several models in one query can be priced differently; say so rather
+      // than reporting whichever happened to come first.
+      contextData.costBasis = basisMixed ? "mixed" : basis;
     }
   }
   if (!store.get('replayingHistory')) updateContextPanel();
@@ -832,7 +874,7 @@ export function applyContextView(view) {
 }
 
 export function resetContextData() {
-  contextData = { contextWindow: 0, maxOutputTokens: 0, model: "-", cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
+  contextData = { contextWindow: 0, maxOutputTokens: 0, model: "-", cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0, thinking: null, costBasis: null };
   store.set({ richContextUsage: null });
   // hideCtxPopover + updateContextPanel handled by store subscriber
 }

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

@@ -19,7 +19,7 @@ import { exitDmMode } from './app-dm.js';
 import { isHomeHubVisible, hideHomeHub, showHomeHub } from './app-home-hub.js';
 import { closeArticle as closeWhatsNewArticle } from './whats-new-article.js';
 import { resetFileBrowser } from './filebrowser.js';
-import { closeArchive } from './sticky-notes.js';
+import { closeNotesBrowser } from './sticky-notes-browser.js';
 import { hideMemory } from './mate-memory.js';
 import { isSchedulerOpen, closeScheduler, resetScheduler } from './scheduler.js';
 import { connect, cancelReconnect, setStatus } from './app-connection.js';
@@ -34,6 +34,8 @@ import { resetRateLimitState } from './app-rate-limit.js';
 import { closeSessionInfoPopover } from './app-header.js';
 import { resetDebateState } from './debate.js';
 import { removeDebateBottomBar } from './app-debate-ui.js';
+import { closeProjectSettings } from './project-settings.js';
+import { chooseProjectAfterRemoval } from './project-removal-target.js';
 
 // --- Module-owned state ---
 var cachedProjects = [];
@@ -415,13 +417,15 @@ export function switchProject(slug) {
   if (!slug) return;
   document.cookie = "clay_last_project=" + encodeURIComponent(slug) + "; Path=/; SameSite=Strict; Max-Age=31536000";
   var st = store.snap();
+  var targetWsPath = "/p/" + slug + "/ws";
+  var alreadyInProject = slug === st.currentSlug && st.wsPath === targetWsPath;
   var wasDm = st.dmMode;
   var wasMate = st.dmMode && st.dmTargetUser && st.dmTargetUser.isMate;
   if (st.dmMode) exitDmMode(wasMate);
   closeWhatsNewArticle();
   if (isHomeHubVisible()) {
     hideHomeHub();
-    if (slug === store.get('currentSlug')) {
+    if (alreadyInProject) {
       if (document.documentElement.classList.contains("pwa-standalone")) {
         history.replaceState(null, "", "/p/" + slug + "/");
       } else {
@@ -430,7 +434,7 @@ export function switchProject(slug) {
       return;
     }
   }
-  if (slug === store.get('currentSlug')) {
+  if (alreadyInProject) {
     var ws = getWs();
     if (wasDm && ws && ws.readyState === 1) {
       ws.send(JSON.stringify({ type: "switch_session", id: store.get('activeSessionId') }));
@@ -438,13 +442,13 @@ export function switchProject(slug) {
     return;
   }
   resetFileBrowser();
-  closeArchive();
+  closeNotesBrowser();
   hideMemory();
   if (isSchedulerOpen()) closeScheduler();
   resetScheduler(slug);
   store.set({ currentSlug: slug });
   store.set({ basePath: "/p/" + slug + "/" });
-  store.set({ wsPath: "/p/" + slug + "/ws" });
+  store.set({ wsPath: targetWsPath });
   if (document.documentElement.classList.contains("pwa-standalone")) {
     history.replaceState(null, "", "/p/" + slug + "/");
   } else {
@@ -572,9 +576,10 @@ export function handleRemoveProjectResult(msg) {
     var currentSlug = store.get('currentSlug');
     if (msg.slug === currentSlug) {
       var isWorktree = msg.slug.indexOf("--") !== -1;
-      var parentSlug = isWorktree ? msg.slug.split("--")[0] : null;
+      var targetSlug = chooseProjectAfterRemoval(cachedProjects, msg.slug);
 
       showToast(isWorktree ? "Worktree removed" : "Project removed", "success");
+      closeProjectSettings();
 
       // Suppress disconnect overlay and reconnect by detaching the WS
       var ws = getWs();
@@ -602,8 +607,8 @@ export function handleRemoveProjectResult(msg) {
       renderProjectList();
       resetClientState();
 
-      if (parentSlug) {
-        switchProject(parentSlug);
+      if (targetSlug) {
+        switchProject(targetSlug);
       } else {
         showHomeHub();
       }

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

@@ -111,6 +111,7 @@ export function finalizeAssistantBlock() {
 
 export function showClaudePreThinking() {
   if (getChatLayout() !== "channel") return;
+  removeMatePreThinking();
   var vendor = store.get('currentVendor') || "claude";
   var vendorAvatar = VENDOR_AVATARS[vendor] || VENDOR_AVATARS.claude;
   var vendorName = VENDOR_NAMES[vendor] || VENDOR_NAMES.claude;

package/lib/public/modules/background-tasks-ui.js

@@ -1,55 +1,178 @@
+// background-tasks-ui.js - Background task status line above the composer.
+//
+// Collapsed it reads as a quiet status line, not a button demanding attention:
+// a muted activity indicator, a count, and a chevron. Expanding lists each task
+// with its elapsed time and a Stop control.
+//
+// Elapsed time comes from `started_at` (epoch ms) which the server stamps in
+// lib/background-task-timing.js. The ticker only runs while the list is
+// expanded, so a collapsed bar costs nothing.
+
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
 import { escapeHtml } from './utils.js';
+import { iconHtml, refreshIcons } from './icons.js';
 
 var expanded = false;
+var elapsedTimer = null;
+
+// Lucide icon per vendor-neutral task type (see normalizeBackgroundTasks in
+// yoke/adapters/claude.js for where these types are assigned).
+var TASK_TYPE_ICONS = { shell: "terminal", agent: "sparkles", other: "circle-dot" };
 
 export function initBackgroundTasksUi() {
-  store.subscribe(function(state, prev) {
+  store.subscribe(function (state, prev) {
     if (state.activeBackgroundTasks !== prev.activeBackgroundTasks) renderBackgroundTasks();
   });
   renderBackgroundTasks();
 }
 
+// "45s", "2m 14s", "1h 03m" - short enough to sit in a row without wrapping.
+export function formatElapsed(startedAt, now) {
+  if (typeof startedAt !== "number" || !isFinite(startedAt) || startedAt <= 0) return "";
+  var current = typeof now === "number" ? now : Date.now();
+  var totalSeconds = Math.floor((current - startedAt) / 1000);
+  if (totalSeconds < 0) totalSeconds = 0;
+  if (totalSeconds < 60) return totalSeconds + "s";
+  var minutes = Math.floor(totalSeconds / 60);
+  var seconds = totalSeconds % 60;
+  if (minutes < 60) return minutes + "m " + pad(seconds) + "s";
+  var hours = Math.floor(minutes / 60);
+  return hours + "h " + pad(minutes % 60) + "m";
+}
+
+function pad(value) {
+  return value < 10 ? "0" + value : String(value);
+}
+
+function stopElapsedTimer() {
+  if (!elapsedTimer) return;
+  clearInterval(elapsedTimer);
+  elapsedTimer = null;
+}
+
+// Ticks at most once a second and only touches the time cells, so expanding
+// the list never re-renders (and never steals focus from) the rows.
+function startElapsedTimer() {
+  stopElapsedTimer();
+  elapsedTimer = setInterval(updateElapsedCells, 1000);
+}
+
+function updateElapsedCells() {
+  var bar = document.getElementById('background-tasks-bar');
+  if (!bar || !expanded) {
+    stopElapsedTimer();
+    return;
+  }
+  var now = Date.now();
+  var cells = bar.querySelectorAll('.background-task-elapsed');
+  for (var i = 0; i < cells.length; i++) {
+    var startedAt = Number(cells[i].dataset.startedAt);
+    cells[i].textContent = formatElapsed(startedAt, now);
+  }
+}
+
+function activityDotsHtml() {
+  return '<span class="background-tasks-activity" aria-hidden="true"><i></i><i></i><i></i></span>';
+}
+
+// Ambient tasks are the CLI's own housekeeping. The SDK asks hosts to keep
+// them out of activity indicators; Clay still lists them so the user can see
+// what runs on their behalf. Absent means false (Codex has no ambient concept,
+// and older CLI builds report only user work).
+export function isAmbientTask(task) {
+  return !!(task && task.ambient === true);
+}
+
+export function splitTasks(tasks) {
+  var user = [];
+  var ambient = [];
+  var list = Array.isArray(tasks) ? tasks : [];
+  for (var i = 0; i < list.length; i++) {
+    if (!list[i]) continue;
+    if (isAmbientTask(list[i])) ambient.push(list[i]);
+    else user.push(list[i]);
+  }
+  return { user: user, ambient: ambient };
+}
+
+function taskRowHtml(task, now) {
+  var taskType = task.task_type || 'other';
+  var icon = TASK_TYPE_ICONS[taskType] || TASK_TYPE_ICONS.other;
+  var description = task.description || 'Background task';
+  var startedAt = typeof task.started_at === 'number' ? task.started_at : 0;
+  var elapsed = formatElapsed(startedAt, now);
+  return '<div class="background-task-row' + (isAmbientTask(task) ? ' ambient' : '') + '">' +
+    '<span class="background-task-icon" title="' + escapeHtml(taskType) + '">' + iconHtml(icon) + '</span>' +
+    '<span class="background-task-description" title="' + escapeHtml(description) + '">' +
+      escapeHtml(description) + '</span>' +
+    '<span class="background-task-meta">' +
+      '<span class="background-task-type">' + escapeHtml(taskType) + '</span>' +
+      '<span class="background-task-elapsed" data-started-at="' + startedAt + '">' + escapeHtml(elapsed) + '</span>' +
+    '</span>' +
+    '<button type="button" class="background-task-stop" data-task-id="' + escapeHtml(task.task_id || '') + '" ' +
+      'aria-label="Stop ' + escapeHtml(description) + '">Stop</button>' +
+    '</div>';
+}
+
 function renderBackgroundTasks() {
   var tasks = store.get('activeBackgroundTasks') || [];
+  var split = splitTasks(tasks);
   var existing = document.getElementById('background-tasks-bar');
-  if (tasks.length === 0) {
+  // Ambient-only means nothing the user asked for is running, so the composer
+  // stays quiet: no bar, no dots, no count.
+  if (split.user.length === 0) {
     if (existing) existing.remove();
     expanded = false;
+    stopElapsedTimer();
     return;
   }
   var inputArea = document.getElementById('input-area');
   if (!inputArea || !inputArea.parentNode) return;
+
   var bar = existing || document.createElement('div');
   bar.id = 'background-tasks-bar';
-  bar.className = 'background-tasks-bar';
-  var taskLabel = tasks.length === 1 ? 'background task' : 'background tasks';
-  var html = '<button type="button" class="background-tasks-toggle" aria-expanded="' + expanded + '">' +
-    '<span aria-hidden="true">⏳</span><span class="background-tasks-chip">' + tasks.length + '</span>' +
-    '<span>' + tasks.length + ' ' + taskLabel + '</span></button>';
+  bar.className = 'background-tasks-bar' + (expanded ? ' expanded' : '');
+
+  var taskLabel = split.user.length === 1 ? 'background task' : 'background tasks';
+  var summary = split.user.length + ' ' + taskLabel;
+  var html = '<button type="button" class="background-tasks-toggle" aria-expanded="' + expanded + '"' +
+    ' aria-controls="background-tasks-list" aria-label="' + summary + ', ' +
+    (expanded ? 'collapse' : 'expand') + ' details">' +
+    activityDotsHtml() +
+    '<span class="background-tasks-summary">' + summary + '</span>' +
+    '<span class="background-tasks-chevron" aria-hidden="true">' + iconHtml('chevron-right') + '</span>' +
+    '</button>';
+
   if (expanded) {
-    html += '<div class="background-tasks-list">';
-    for (var i = 0; i < tasks.length; i++) {
-      var task = tasks[i];
-      html += '<div class="background-task-row"><span class="background-task-description" title="' + escapeHtml(task.description || '') + '">' +
-        escapeHtml(task.description || 'Background task') + '</span><span class="background-task-type">' +
-        escapeHtml(task.task_type || 'other') + '</span><button type="button" class="background-task-stop" data-task-id="' +
-        escapeHtml(task.task_id || '') + '">Stop</button></div>';
+    var now = Date.now();
+    html += '<div class="background-tasks-list" id="background-tasks-list">';
+    for (var i = 0; i < split.user.length; i++) html += taskRowHtml(split.user[i], now);
+    // Housekeeping is shown, not hidden: the user can see what Clay runs on
+    // its own and stop a runaway one. Kept visually subordinate to real work.
+    if (split.ambient.length > 0) {
+      html += '<div class="background-tasks-section-label">Housekeeping</div>';
+      for (var a = 0; a < split.ambient.length; a++) html += taskRowHtml(split.ambient[a], now);
     }
     html += '</div>';
   }
   bar.innerHTML = html;
   if (!existing) inputArea.parentNode.insertBefore(bar, inputArea);
-  bar.querySelector('.background-tasks-toggle').addEventListener('click', function() {
+  refreshIcons();
+
+  bar.querySelector('.background-tasks-toggle').addEventListener('click', function () {
     expanded = !expanded;
     renderBackgroundTasks();
   });
+
   var stopButtons = bar.querySelectorAll('.background-task-stop');
   for (var j = 0; j < stopButtons.length; j++) {
-    stopButtons[j].addEventListener('click', function() {
+    stopButtons[j].addEventListener('click', function () {
       var ws = getWs();
       if (ws && ws.readyState === 1) ws.send(JSON.stringify({ type: 'stop_task', taskId: this.dataset.taskId }));
     });
   }
+
+  if (expanded) startElapsedTimer();
+  else stopElapsedTimer();
 }

package/lib/public/modules/capsule-preference.js

@@ -0,0 +1,44 @@
+import { store } from './store.js';
+import { requestTools } from './home-tools.js';
+import { closeHomeDock } from './home-dock.js';
+import { showToast } from './utils.js';
+
+function applyCapsulesEnabled(enabled, refreshTools) {
+  var want = enabled === true;
+  store.set({ capsulesEnabled: want, capsulesPreferenceLoaded: true });
+  if (document.body) document.body.classList.toggle('capsules-disabled', !want);
+  if (!want && store.get('dockOpen') === true) closeHomeDock();
+  if (refreshTools !== false) requestTools();
+}
+
+export function initCapsulePreference() {
+  var toggle = document.getElementById('us-capsules-enabled');
+  if (!toggle) return;
+  toggle.addEventListener('change', function () {
+    var previous = store.get('capsulesEnabled') === true;
+    var want = this.checked === true;
+    applyCapsulesEnabled(want, false);
+    fetch('/api/user/capsules-enabled', {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ enabled: want }),
+    }).then(function (response) {
+      if (!response.ok) throw new Error('Could not save the Capsules preference.');
+      return response.json();
+    }).then(function (data) {
+      applyCapsulesEnabled(data.capsulesEnabled === true, true);
+      showToast(data.capsulesEnabled ? 'Experimental Capsules enabled' : 'Experimental Capsules disabled');
+    }).catch(function () {
+      toggle.checked = previous;
+      applyCapsulesEnabled(previous, true);
+      showToast('Could not save the Capsules preference.', 'error');
+    });
+  });
+}
+
+export function syncCapsulePreference(enabled) {
+  var want = enabled === true;
+  var toggle = document.getElementById('us-capsules-enabled');
+  if (toggle) toggle.checked = want;
+  applyCapsulesEnabled(want, true);
+}

package/lib/public/modules/chat-bubble-renderer.js

@@ -105,7 +105,7 @@ export function addAssistantCopyHandler(row, rawText) {
   }
 
   row.addEventListener("click", function (event) {
-    if (event.target.closest("a, pre, code")) return;
+    if (event.target.closest("a, button, pre, code")) return;
     var selection = window.getSelection();
     if (selection && selection.toString().length > 0) return;
     if (!primed) {

package/lib/public/modules/clay-log-links.js

@@ -0,0 +1,70 @@
+export function parseClayLogReferences(text) {
+  var pattern = /\[clayos\/(log:[A-Za-z0-9_-]{24})(?:\s+[\u2014-]\s+([^\]\n]{1,80}))?\]|(^|[^A-Za-z0-9_/:])(log:[A-Za-z0-9_-]{24})(?![A-Za-z0-9_-])/g;
+  var results = [];
+  var match;
+  while ((match = pattern.exec(text || ""))) {
+    results.push({
+      start: match.index,
+      end: pattern.lastIndex,
+      prefix: match[3] || "",
+      ref: match[1] || match[4],
+      label: match[2] ? match[2].trim() : "",
+    });
+  }
+  return results;
+}
+
+export function isExactClayLogReference(text) {
+  return /^log:[A-Za-z0-9_-]{24}$/.test((text || "").trim());
+}
+
+function createLogLink(ref, labelText) {
+  var button = document.createElement("button");
+  button.type = "button";
+  button.className = "clayos-log-link";
+  button.contentEditable = "false";
+  button.dataset.logRef = ref;
+  button.setAttribute("aria-label", "Open Project Log" + (labelText ? " " + labelText : ""));
+  var label = document.createElement("span");
+  label.textContent = "Log";
+  button.appendChild(label);
+  if (labelText) {
+    var meta = document.createElement("small");
+    meta.textContent = labelText;
+    button.appendChild(meta);
+  }
+  return button;
+}
+
+export function enhanceClayLogLinks(root) {
+  var codeNodes = root.querySelectorAll("code");
+  for (var codeIndex = 0; codeIndex < codeNodes.length; codeIndex++) {
+    var code = codeNodes[codeIndex];
+    var codeText = (code.textContent || "").trim();
+    if (code.closest("pre") || !isExactClayLogReference(codeText)) continue;
+    code.parentNode.replaceChild(createLogLink(codeText, ""), code);
+  }
+
+  var walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
+  var nodes = [];
+  var node;
+  while ((node = walker.nextNode())) {
+    if (!node.parentElement || node.parentElement.closest("code, pre, a, button")) continue;
+    if (parseClayLogReferences(node.nodeValue).length) nodes.push(node);
+  }
+  for (var i = 0; i < nodes.length; i++) {
+    var text = nodes[i].nodeValue || "";
+    var matches = parseClayLogReferences(text);
+    var fragment = document.createDocumentFragment();
+    var offset = 0;
+    for (var j = 0; j < matches.length; j++) {
+      var match = matches[j];
+      fragment.appendChild(document.createTextNode(text.slice(offset, match.start)));
+      if (match.prefix) fragment.appendChild(document.createTextNode(match.prefix));
+      fragment.appendChild(createLogLink(match.ref, match.label));
+      offset = match.end;
+    }
+    fragment.appendChild(document.createTextNode(text.slice(offset)));
+    nodes[i].parentNode.replaceChild(fragment, nodes[i]);
+  }
+}