clay-server 4.1.0-beta.9 → 4.2.0-beta.1

package/lib/public/modules/app-rate-limit.js

@@ -13,6 +13,7 @@ var rateLimitResetTimer = null;
 var rateLimitUsageEl = null;
 var rateLimitResetState = {};
 var rateLimitTickTimer = null;
+var rateLimitPopoverTimers = [];
 var fastModeIndicatorEl = null;
 
 // --- Internal helpers ---
@@ -25,7 +26,7 @@ function getVendorUsageMeta(vendor) {
     codex: {
       icon: "/codex-avatar.png",
       alt: "Codex",
-      href: "https://chatgpt.com/admin/usage",
+      href: "https://chatgpt.com/codex/settings/usage",
       title: "Check usage on ChatGPT",
     },
     claude: {
@@ -35,7 +36,7 @@ function getVendorUsageMeta(vendor) {
       title: "Check usage on claude.ai",
     },
   };
-  return fallbacks[vendor] || fallbacks.claude;
+  return fallbacks[vendor] || null;
 }
 
 function vendorTracksRateLimits(vendor) {
@@ -51,6 +52,37 @@ function vendorSupportsScheduledMessages(vendor) {
   return scheduledMessageVendors.indexOf(vendor) !== -1;
 }
 
+function rateLimitEventAppliesToPane(msg, state) {
+  var activeSessionId = state.activeSessionId;
+  var activeVendor = state.currentVendor || "claude";
+  if (!msg) return false;
+  if (msg.sessionId != null && String(msg.sessionId) !== String(activeSessionId)) return false;
+  if (msg.vendor) return msg.vendor === activeVendor;
+  // Legacy Claude records predate vendor/session stamps. Never project them
+  // into a non-Claude pane, where they would look like Claude usage.
+  return activeVendor === "claude";
+}
+
+function rateLimitStateKey(sessionId, vendor) {
+  return String(store.get('currentSlug') || "") + "\u0000" +
+    String(store.get('myUserId') || "") + "\u0000" +
+    String(sessionId == null ? "" : sessionId) + "\u0000" + String(vendor || "claude");
+}
+
+function getActiveRateLimitState() {
+  var state = store.get('rateLimitState') || {};
+  var key = rateLimitStateKey(store.get('activeSessionId'), store.get('currentVendor'));
+  return state[key] || {};
+}
+
+function setActiveRateLimitState(next) {
+  var state = Object.assign({}, store.get('rateLimitState') || {});
+  var key = rateLimitStateKey(store.get('activeSessionId'), store.get('currentVendor'));
+  state[key] = next;
+  store.set({ rateLimitState: state });
+  rateLimitResetState = next;
+}
+
 function rateLimitTypeLabel(type) {
   if (!type) return "Usage";
   var labels = {
@@ -108,13 +140,15 @@ function updateRateLimitIndicator(msg) {
   var isRejected = msg.status === "rejected";
   var pillClass = "header-rate-limit" + (isRejected ? " rejected" : " warning");
   var label = isRejected ? "Rate limited" : "Rate warning";
+  var meta = getVendorUsageMeta(store.get('currentVendor') || "claude");
+  var link = meta
+    ? '<a href="' + meta.href + '" target="_blank" rel="noopener" class="rate-limit-link" title="' + meta.title + '">' + iconHtml("external-link") + "</a>"
+    : '<span class="rate-limit-link unavailable" title="Usage information is unavailable for this vendor">' + iconHtml("external-link") + "</span>";
   rateLimitIndicatorEl.innerHTML =
     '<span class="' + pillClass + '">' +
       iconHtml("alert-triangle") +
       '<span class="header-pill-text">' + label + "</span>" +
-      '<a href="https://claude.ai/settings/usage" target="_blank" rel="noopener" class="rate-limit-link">' +
-        iconHtml("external-link") +
-      "</a>" +
+      link +
     "</span>";
   refreshIcons();
 }
@@ -131,10 +165,12 @@ function showRateLimitPopover(text, isRejected) {
   rateLimitIndicatorEl.appendChild(pop);
 
   // Auto-dismiss after 5s
-  setTimeout(function () {
+  var fadeTimer = setTimeout(function () {
     pop.classList.add("fade-out");
-    setTimeout(function () { if (pop.parentNode) pop.remove(); }, 300);
+    var removeTimer = setTimeout(function () { if (pop.parentNode) pop.remove(); }, 300);
+    rateLimitPopoverTimers.push(removeTimer);
   }, 5000);
+  rateLimitPopoverTimers.push(fadeTimer);
 }
 
 function clearRateLimitIndicator() {
@@ -168,22 +204,81 @@ function tickRateLimitUsage() {
   if (!rateLimitUsageEl) return;
   var parts = [];
   var types = ["five_hour", "seven_day", "seven_day_opus", "seven_day_sonnet"];
+  var nextState = Object.assign({}, rateLimitResetState);
+  var changed = false;
   for (var i = 0; i < types.length; i++) {
     var entry = rateLimitResetState[types[i]];
     if (!entry || !entry.resetsAt) continue;
     var timeStr = formatResetTime(entry.resetsAt);
-    if (!timeStr) { delete rateLimitResetState[types[i]]; continue; }
+    if (!timeStr) { delete nextState[types[i]]; changed = true; continue; }
     parts.push(rateLimitTypeShortLabel(types[i]) + " resets " + timeStr);
   }
+  if (changed) setActiveRateLimitState(nextState);
   if (parts.length === 0) {
-    rateLimitUsageEl.innerHTML = iconHtml("activity") + '<span>Check usage</span>' + iconHtml("external-link");
-    refreshIcons();
+    renderRateLimitUsage();
+    return;
+  }
+  renderRateLimitUsage();
+}
+
+function renderRateLimitUsage() {
+  var activeVendor = store.get('currentVendor') || "claude";
+  if (!vendorTracksRateLimits(activeVendor)) {
+    if (rateLimitUsageEl) {
+      rateLimitUsageEl.remove();
+      rateLimitUsageEl = null;
+    }
     if (rateLimitTickTimer) { clearInterval(rateLimitTickTimer); rateLimitTickTimer = null; }
     return;
   }
-  var label = parts.join(" · ");
-  rateLimitUsageEl.innerHTML = iconHtml("activity") + '<span>' + label + '</span>' + iconHtml("external-link");
+
+  rateLimitResetState = getActiveRateLimitState();
+  var topBarActions = document.querySelector("#top-bar .top-bar-actions");
+  if (!topBarActions) return;
+  if (!rateLimitUsageEl) {
+    rateLimitUsageEl = document.createElement("a");
+    rateLimitUsageEl.id = "rate-limit-usage-link";
+    rateLimitUsageEl.className = "top-bar-pill pill-dim usage-check-link";
+    rateLimitUsageEl.target = "_blank";
+    rateLimitUsageEl.rel = "noopener";
+    var ref = document.getElementById("skip-perms-pill");
+    topBarActions.insertBefore(rateLimitUsageEl, ref);
+  }
+  rateLimitUsageEl.style.display = "";
+
+  var parts = [];
+  var types = ["five_hour", "seven_day", "seven_day_opus", "seven_day_sonnet"];
+  for (var i = 0; i < types.length; i++) {
+    var entry = rateLimitResetState[types[i]];
+    if (!entry || !entry.resetsAt) continue;
+    var timeStr = formatResetTime(entry.resetsAt);
+    if (!timeStr) continue;
+    parts.push(rateLimitTypeShortLabel(types[i]) + " resets " + timeStr);
+  }
+
+  var label = parts.length > 0 ? parts.join(" · ") : "Check usage";
+  var meta = getVendorUsageMeta(activeVendor);
+  if (meta) {
+    rateLimitUsageEl.href = meta.href;
+    rateLimitUsageEl.title = meta.title;
+    rateLimitUsageEl.removeAttribute("aria-disabled");
+    rateLimitUsageEl.innerHTML =
+      '<img src="' + meta.icon + '" class="usage-check-vendor-icon" alt="' + meta.alt + '">' +
+      '<span>' + label + '</span>' + iconHtml("external-link");
+  } else {
+    rateLimitUsageEl.removeAttribute("href");
+    rateLimitUsageEl.setAttribute("aria-disabled", "true");
+    rateLimitUsageEl.title = "Usage information is unavailable for this vendor";
+    rateLimitUsageEl.innerHTML = '<span>' + (parts.length > 0 ? label : "Usage unavailable") + '</span>';
+  }
   refreshIcons();
+
+  if (parts.length > 0 && !rateLimitTickTimer) {
+    rateLimitTickTimer = setInterval(tickRateLimitUsage, 30000);
+  } else if (parts.length === 0 && rateLimitTickTimer) {
+    clearInterval(rateLimitTickTimer);
+    rateLimitTickTimer = null;
+  }
 }
 
 // --- Exported functions ---
@@ -193,15 +288,32 @@ export function initRateLimit() {
     if (state.currentVendor !== prev.currentVendor && state.currentVendor) {
       if (!vendorSupportsScheduledMessages(state.currentVendor)) clearScheduleDelay();
     }
-    if (state.currentVendor !== prev.currentVendor || state.vendorInfo !== prev.vendorInfo) {
-      if (rateLimitUsageEl) {
-        rateLimitUsageEl.style.display = vendorTracksRateLimits(state.currentVendor || "claude") ? "" : "none";
-      }
+    if (state.currentVendor !== prev.currentVendor || state.activeSessionId !== prev.activeSessionId
+        || state.currentSlug !== prev.currentSlug || state.myUserId !== prev.myUserId) {
+      resetRateLimitState();
+    }
+    if (state.vendorInfo !== prev.vendorInfo && state.currentVendor === prev.currentVendor && state.activeSessionId === prev.activeSessionId
+        && state.currentSlug === prev.currentSlug && state.myUserId === prev.myUserId) {
+      renderRateLimitUsage();
     }
   });
 }
 
 export function handleRateLimitEvent(msg) {
+  if (!rateLimitEventAppliesToPane(msg, store.snap())) return;
+  if (msg.resetsAt && msg.resetsAt <= Date.now()) {
+    var expiredState = Object.assign({}, getActiveRateLimitState());
+    if (msg.rateLimitType) delete expiredState[msg.rateLimitType];
+    setActiveRateLimitState(expiredState);
+    clearRateLimitIndicator();
+    renderRateLimitUsage();
+    return;
+  }
+  if (msg.rateLimitType && msg.resetsAt) {
+    var eventState = Object.assign({}, getActiveRateLimitState());
+    eventState[msg.rateLimitType] = { resetsAt: msg.resetsAt, status: msg.status };
+    setActiveRateLimitState(eventState);
+  }
   var isRejected = msg.status === "rejected";
   var typeLabel = rateLimitTypeLabel(msg.rateLimitType);
   var popoverText = "";
@@ -226,8 +338,12 @@ export function handleRateLimitEvent(msg) {
     rateLimitResetTimer = setTimeout(function () {
       rateLimitResetsAt = null;
       rateLimitResetTimer = null;
+      var currentState = Object.assign({}, getActiveRateLimitState());
+      delete currentState[msg.rateLimitType];
+      setActiveRateLimitState(currentState);
       // Clear schedule mode when rate limit resets
       clearScheduleDelay();
+      renderRateLimitUsage();
     }, msg.resetsAt - Date.now() + 1000);
   } else {
     var pct = msg.utilization ? Math.round(msg.utilization * 100) : null;
@@ -239,58 +355,19 @@ export function handleRateLimitEvent(msg) {
 }
 
 export function updateRateLimitUsage(msg) {
+  if (!rateLimitEventAppliesToPane(msg, store.snap())) return;
   var activeVendor = store.get('currentVendor') || "claude";
   if (!vendorTracksRateLimits(activeVendor)) {
-    if (rateLimitUsageEl) rateLimitUsageEl.style.display = "none";
+    renderRateLimitUsage();
     return;
   }
   if (msg.rateLimitType && msg.resetsAt) {
-    rateLimitResetState[msg.rateLimitType] = { resetsAt: msg.resetsAt, status: msg.status };
-  }
-
-  var topBarActions = document.querySelector("#top-bar .top-bar-actions");
-  if (!topBarActions) return;
-
-  if (!rateLimitUsageEl) {
-    rateLimitUsageEl = document.createElement("a");
-    rateLimitUsageEl.id = "rate-limit-usage-link";
-    rateLimitUsageEl.className = "top-bar-pill pill-dim usage-check-link";
-    rateLimitUsageEl.target = "_blank";
-    rateLimitUsageEl.rel = "noopener";
-    var ref = document.getElementById("skip-perms-pill");
-    topBarActions.insertBefore(rateLimitUsageEl, ref);
-  }
-  rateLimitUsageEl.style.display = "";
-
-  // Build label from available reset times
-  var parts = [];
-  var types = ["five_hour", "seven_day", "seven_day_opus", "seven_day_sonnet"];
-  for (var i = 0; i < types.length; i++) {
-    var entry = rateLimitResetState[types[i]];
-    if (!entry || !entry.resetsAt) continue;
-    var timeStr = formatResetTime(entry.resetsAt);
-    if (!timeStr) continue;
-    parts.push(rateLimitTypeShortLabel(types[i]) + " resets " + timeStr);
+    var nextState = Object.assign({}, getActiveRateLimitState());
+    nextState[msg.rateLimitType] = { resetsAt: msg.resetsAt, status: msg.status };
+    setActiveRateLimitState(nextState);
   }
 
-  var label = parts.length > 0 ? parts.join(" · ") : "Check usage";
-  var vendor = activeVendor;
-  var meta = getVendorUsageMeta(vendor);
-  rateLimitUsageEl.href = meta.href;
-  rateLimitUsageEl.title = meta.title;
-  rateLimitUsageEl.innerHTML =
-    '<img src="' + meta.icon + '" class="usage-check-vendor-icon" alt="' + meta.alt + '">' +
-    '<span>' + label + '</span>' +
-    iconHtml("external-link");
-  refreshIcons();
-
-  // Start or stop live countdown tick
-  if (parts.length > 0 && !rateLimitTickTimer) {
-    rateLimitTickTimer = setInterval(tickRateLimitUsage, 30000);
-  } else if (parts.length === 0 && rateLimitTickTimer) {
-    clearInterval(rateLimitTickTimer);
-    rateLimitTickTimer = null;
-  }
+  renderRateLimitUsage();
 }
 
 export function handleFastModeState(state) {
@@ -322,6 +399,16 @@ export function handleFastModeState(state) {
 
 export function resetRateLimitState() {
   clearRateLimitIndicator();
+  rateLimitResetsAt = null;
+  if (rateLimitResetTimer) { clearTimeout(rateLimitResetTimer); rateLimitResetTimer = null; }
+  clearScheduleDelay();
+  for (var i = 0; i < rateLimitPopoverTimers.length; i++) clearTimeout(rateLimitPopoverTimers[i]);
+  rateLimitPopoverTimers = [];
+  if (rateLimitTickTimer) { clearInterval(rateLimitTickTimer); rateLimitTickTimer = null; }
   if (rateLimitCountdownTimer) { clearInterval(rateLimitCountdownTimer); rateLimitCountdownTimer = null; }
+  rateLimitResetState = getActiveRateLimitState();
+  renderRateLimitUsage();
   if (fastModeIndicatorEl) { fastModeIndicatorEl.remove(); fastModeIndicatorEl = null; }
 }
+
+export { rateLimitEventAppliesToPane, getVendorUsageMeta };

package/lib/public/modules/avatar-imprint.js

@@ -1,10 +1,9 @@
-// Clay Imprints: deterministic SVG identities derived from a stable seed.
+// Local pixel identities: deterministic SVG avatars derived from a stable seed.
 
 var PAPER = "#f1efe8";
 var INK = "#1b1b1a";
-var LIGHT_BASE = "#e7e5de";
-var LIGHT_FIELD = "#333330";
 var MUTED_INDIGO = "#72778f";
+var IDENTICON_PALETTE = ["#333330", MUTED_INDIGO, "#6f8382", "#887b91", "#8a806a"];
 var MATE_MARK_PALETTE = [
   { background: "#6f7489", foreground: PAPER },
   { background: "#78816c", foreground: PAPER },
@@ -24,25 +23,6 @@ function hashString(value) {
   return hash >>> 0;
 }
 
-function makeRandom(seed) {
-  var state = seed >>> 0;
-  return function nextRandom() {
-    state += 0x6d2b79f5;
-    var value = state;
-    value = Math.imul(value ^ (value >>> 15), value | 1);
-    value ^= value + Math.imul(value ^ (value >>> 7), value | 61);
-    return ((value ^ (value >>> 14)) >>> 0) / 4294967296;
-  };
-}
-
-function between(random, min, max) {
-  return min + random() * (max - min);
-}
-
-function number(value) {
-  return Math.round(value * 100) / 100;
-}
-
 function xmlText(value) {
   return String(value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
@@ -54,62 +34,37 @@ function legacyIdentity(style, seed) {
   return "legacy:" + sourceStyle + ":" + sourceSeed;
 }
 
-function curvePath(y, bow, endOffset) {
-  return "M -28 " + number(y) +
-    " C 17 " + number(y + bow) +
-    ", 71 " + number(y - bow) +
-    ", 124 " + number(y + endOffset);
-}
-
-function cutPath(random) {
-  var start = between(random, 37, 52);
-  var first = between(random, 14, 84);
-  var second = between(random, 12, 86);
-  var end = between(random, 40, 64);
-  return "M -22 " + number(start) + " C 21 " + number(first) + ", 73 " + number(second) + ", 118 " + number(end);
-}
-
 export function imprintSvg(options) {
   var settings = options || {};
   var size = Math.max(12, Math.min(256, Number(settings.size) || 64));
   var identity = legacyIdentity(settings.style, settings.seed);
   var hash = hashString(identity);
-  var random = makeRandom(hash);
-  var darkBase = random() > 0.52;
-  var base = darkBase ? INK : LIGHT_BASE;
-  var field = darkBase ? PAPER : LIGHT_FIELD;
-  var accent = MUTED_INDIGO;
-  var rotation = Math.floor(random() * 4) * 90;
-  var bandWidth = between(random, 37, 56);
-  var secondaryWidth = between(random, 14, 24);
-  var cutWidth = between(random, 15, 25);
-  var firstY = between(random, 24, 42);
-  var secondY = between(random, 58, 78);
-  var firstBow = between(random, -34, 34);
-  var secondBow = between(random, -32, 32);
-  var firstPath = curvePath(firstY, firstBow, 6);
-  var secondPath = curvePath(secondY, -secondBow, -5);
-  var contours = "";
+  var cells = identiconCells(hash);
+  var foreground = IDENTICON_PALETTE[hash % IDENTICON_PALETTE.length];
+  var pixels = "";
+  for (var i = 0; i < cells.length; i++) {
+    pixels += '<rect x="' + (cells[i][0] + 1) + '" y="' + (cells[i][1] + 1) + '" width="1" height="1"/>';
+  }
+  return '<svg xmlns="http://www.w3.org/2000/svg" width="' + size + '" height="' + size +
+    '" viewBox="0 0 7 7" shape-rendering="crispEdges"><rect width="7" height="7" fill="' + PAPER +
+    '"/><g fill="' + foreground + '">' + pixels + '</g><rect x="0.5" y="0.5" width="6" height="6" fill="none" stroke="' +
+    INK + '" stroke-opacity="0.14" stroke-width="0.08"/></svg>';
+}
 
-  if (size >= 40) {
-    for (var contour = -1; contour <= 1; contour++) {
-      var offset = contour * 5.2;
-      contours += '<path d="' + curvePath(firstY + offset, firstBow, 0) + '" fill="none" stroke="' +
-        (darkBase ? PAPER : INK) + '" stroke-opacity="0.2" stroke-width="0.8"/>';
+// Generate the left three columns and mirror them into a compact 5x5 grid.
+export function identiconCells(hash) {
+  var value = hash >>> 0;
+  var cells = [];
+  for (var row = 0; row < 5; row++) {
+    for (var column = 0; column < 3; column++) {
+      value = Math.imul(value ^ (value >>> 13), 16777619) >>> 0;
+      if ((value & 1) || (row === 2 && column === 1)) {
+        cells.push([column, row]);
+        if (column < 2) cells.push([4 - column, row]);
+      }
     }
   }
-
-  var clipId = "imprint-" + hash.toString(16);
-  return '<svg xmlns="http://www.w3.org/2000/svg" width="' + size + '" height="' + size +
-    '" viewBox="0 0 96 96"><defs><clipPath id="' + clipId +
-    '"><rect width="96" height="96" rx="24"/></clipPath></defs><g clip-path="url(#' + clipId +
-    ')"><rect width="96" height="96" fill="' + base + '"/><g transform="rotate(' + rotation +
-    ' 48 48)"><path d="' + firstPath + '" fill="none" stroke="' + field + '" stroke-width="' +
-    number(bandWidth) + '" stroke-linecap="square"/><path d="' + secondPath + '" fill="none" stroke="' +
-    accent + '" stroke-width="' + number(secondaryWidth) + '" stroke-linecap="square"/><path d="' +
-    cutPath(random) + '" fill="none" stroke="' + base + '" stroke-width="' + number(cutWidth) +
-    '" stroke-linecap="square"/>' + contours + '</g></g><rect x="0.5" y="0.5" width="95" height="95" rx="23.5" fill="none" stroke="' +
-    (darkBase ? "#000000" : INK) + '" stroke-opacity="0.16"/></svg>';
+  return cells;
 }
 
 export function imprintDataUrl(options) {

package/lib/public/modules/avatar.js

@@ -1,11 +1,11 @@
-// Centralized Clay Imprint URL builder for people and Mates.
+// Centralized local avatar URL builder for people and Mates.
 import { imprintDataUrl, mateMarkDataUrl } from './avatar-imprint.js';
 
 var imprintCache = new Map();
 var mateMarkCache = new Map();
 
 // Legacy style remains part of the identity hash so existing selections map
-// deterministically into the new Clay Imprint system.
+// deterministically into the local pixel identity system.
 export function avatarUrl(style, seed, size) {
   var cacheKey = [style || 'imprint', seed || 'anonymous', size || 64].join('|');
   if (imprintCache.has(cacheKey)) return imprintCache.get(cacheKey);
@@ -15,12 +15,20 @@ export function avatarUrl(style, seed, size) {
   return url;
 }
 
+// Use the same bounded account identity for fresh fallbacks across every surface.
+export function userAvatarSeed(user) {
+  var profile = user && user.profile ? user.profile : user;
+  var savedSeed = profile && profile.avatarSeed || user && user.avatarSeed;
+  if (savedSeed) return String(savedSeed);
+  var identity = profile && (profile.username || profile.id || profile.userId) || user && (user.username || user.id || user.userId) || 'anonymous';
+  return String(identity).substring(0, 30);
+}
+
 // Build avatar URL for a user object, preferring custom avatar if set.
 export function userAvatarUrl(user, size) {
   if (user && user.avatarCustom) return user.avatarCustom;
   var style = (user && user.avatarStyle) || 'imprint';
-  var seed = (user && (user.avatarSeed || user.username || user.id)) || 'anonymous';
-  return avatarUrl(style, seed, size);
+  return avatarUrl(style, userAvatarSeed(user), size);
 }
 
 export function mateMarkUrl(seed, size) {

package/lib/public/modules/chat-render-runtime.js

@@ -145,6 +145,26 @@ export function addToMessages(element) {
   var messagesEl = getMessagesEl();
   if (prependAnchor) messagesEl.insertBefore(element, prependAnchor);
   else messagesEl.appendChild(element);
+  keepActiveThinkingAtTail();
+}
+
+// Thinking is a single accumulating record for the active turn. Other live
+// transcript entries may arrive between reasoning segments, so keep only the
+// currently active record after the tail activity indicator.
+export function keepActiveThinkingAtTail() {
+  if (prependAnchor || store.get('replayingHistory')) return;
+  var thinkingState = store.get('thinkingState');
+  var thinkingEl = thinkingState && thinkingState.active && thinkingState.el;
+  var messagesEl = getMessagesEl();
+  if (!thinkingEl || !messagesEl || thinkingEl.parentNode !== messagesEl) return;
+  if (activityEl && activityEl.parentNode === messagesEl) {
+    if (activityEl.nextSibling !== thinkingEl || messagesEl.lastElementChild !== thinkingEl) {
+      messagesEl.appendChild(activityEl);
+      messagesEl.appendChild(thinkingEl);
+    }
+  } else if (messagesEl.lastElementChild !== thinkingEl) {
+    messagesEl.appendChild(thinkingEl);
+  }
 }
 
 export function scrollToBottom() {

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

@@ -1,5 +1,6 @@
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
+import { forwardPaneIssueReference } from './pane-bridge.js';
 function accountKey(state) { return state.isMultiUserMode ? 'user:' + String(state.myUserId || '') : 'single'; }
 function requestContext(state) { return { accountKey: accountKey(state), projectSlug: state.currentSlug || null, epoch: state.issuesEpoch || 0 }; }
 function sameContext(request, state) {
@@ -30,6 +31,7 @@ function createIssueLink(ref, labelText) {
   var button = document.createElement("button");
   button.type = "button";
   button.className = "clayos-issue-link";
+  button.classList.add("clayos-record-link");
   button.contentEditable = "false";
   button.dataset.issueRef = ref;
   button.setAttribute("aria-label", "Open Project Issue" + (labelText ? " " + labelText : ""));
@@ -42,12 +44,17 @@ function createIssueLink(ref, labelText) {
     button.appendChild(meta);
   }
   var cache = store.get('issuesCache') || {};
-  if (cache[ref]) { button.textContent = cache[ref].status.replace(/_/g, ' ') + ' · ' + cache[ref].title; button.dataset.status = cache[ref].status; }
+  if (cache[ref]) updateIssueLink(button, cache[ref]);
   setTimeout(function () { resolve(ref); }, 0);
   return button;
 }
 
 export function enhanceClayIssueLinks(root) {
+  root.querySelectorAll('a').forEach(function (anchor) {
+    var ref = anchor.getAttribute('data-clay-record-ref') || anchor.getAttribute('href');
+    if (anchor.closest('pre, code, button') || !isExactClayIssueReference(ref)) return;
+    anchor.replaceWith(createIssueLink(ref.trim(), anchor.textContent.trim()));
+  });
   var codeNodes = root.querySelectorAll("code");
   for (var codeIndex = 0; codeIndex < codeNodes.length; codeIndex++) {
     var code = codeNodes[codeIndex];
@@ -80,6 +87,20 @@ export function enhanceClayIssueLinks(root) {
   }
 }
 
+export function updateIssueLink(button, target) {
+  var status = target.status || 'open';
+  var title = target.title || 'Issue';
+  button.replaceChildren();
+  var label = document.createElement('span');
+  label.textContent = 'Issue';
+  var meta = document.createElement('small');
+  meta.textContent = title;
+  button.append(label, meta);
+  button.dataset.status = status;
+  button.title = title + ' · ' + status.replace(/_/g, ' ');
+  button.setAttribute('aria-label', 'Open Project Issue: ' + button.title);
+}
+
 function resolve(ref) {
   var ws = getWs();
   var requests = store.get('issueLinkRequests') || {};
@@ -101,7 +122,7 @@ export function handleIssueReference(msg) {
   }
   document.querySelectorAll('[data-issue-ref]').forEach(function (button) {
     if (button.dataset.issueRef !== msg.ref) return;
-    if (msg.target) { button.textContent = msg.target.status.replace(/_/g, ' ') + ' · ' + msg.target.title; button.dataset.status = msg.target.status; }
+    if (msg.target) updateIssueLink(button, msg.target);
     else button.title = msg.error || 'Issue unavailable';
   });
   if (store.get('issueLinkOpenRef') === msg.ref) {
@@ -111,6 +132,7 @@ export function handleIssueReference(msg) {
   return true;
 }
 function navigate(target) {
+  if (forwardPaneIssueReference(target.ref, target.projectSlug)) return;
   if (target.projectSlug !== store.get('currentSlug')) { window.location.assign('/p/' + encodeURIComponent(target.projectSlug) + '/?issue=' + encodeURIComponent(target.ref)); return; }
   import('./issues.js').then(function (module) { module.openIssues(target.ref); });
 }

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

@@ -1,4 +1,9 @@
-import { enhanceClayIssueLinks } from './clay-issue-links.js';
+import { enhanceClayIssueLinks, isExactClayIssueReference } from './clay-issue-links.js';
+
+export function renderClayRecordLink(href, text) {
+  if (!isExactClayLogReference(href) && !isExactClayIssueReference(href)) return null;
+  return '<a href="#" data-clay-record-ref="' + href.trim() + '">' + text + '</a>';
+}
 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 = [];
@@ -23,6 +28,7 @@ function createLogLink(ref, labelText) {
   var button = document.createElement("button");
   button.type = "button";
   button.className = "clayos-log-link";
+  button.classList.add("clayos-record-link");
   button.contentEditable = "false";
   button.dataset.logRef = ref;
   button.setAttribute("aria-label", "Open Project Log" + (labelText ? " " + labelText : ""));
@@ -39,6 +45,11 @@ function createLogLink(ref, labelText) {
 
 export function enhanceClayLogLinks(root) {
   enhanceClayIssueLinks(root);
+  root.querySelectorAll('a').forEach(function (anchor) {
+    var ref = anchor.getAttribute('data-clay-record-ref') || anchor.getAttribute('href');
+    if (anchor.closest('pre, code, button') || !isExactClayLogReference(ref)) return;
+    anchor.replaceWith(createLogLink(ref.trim(), anchor.textContent.trim()));
+  });
   var codeNodes = root.querySelectorAll("code");
   for (var codeIndex = 0; codeIndex < codeNodes.length; codeIndex++) {
     var code = codeNodes[codeIndex];