clay-server 2.5.1 → 2.6.0

package/lib/public/app.js

@@ -1,17 +1,19 @@
 import { showToast, copyToClipboard, escapeHtml } from './modules/utils.js';
 import { refreshIcons, iconHtml, randomThinkingVerb } from './modules/icons.js';
 import { renderMarkdown, highlightCodeBlocks, renderMermaidBlocks, closeMermaidModal } from './modules/markdown.js';
-import { initSidebar, renderSessionList, handleSearchResults, updatePageTitle, getActiveSearchQuery, buildSearchTimeline, removeSearchTimeline, populateCliSessionList, renderIconStrip, initIconStrip } from './modules/sidebar.js';
+import { initSidebar, renderSessionList, handleSearchResults, updatePageTitle, getActiveSearchQuery, buildSearchTimeline, removeSearchTimeline, populateCliSessionList, renderIconStrip, initIconStrip, getEmojiCategories } from './modules/sidebar.js';
 import { initRewind, setRewindMode, showRewindModal, clearPendingRewindUuid, addRewindButton } from './modules/rewind.js';
 import { initNotifications, showDoneNotification, playDoneSound, isNotifAlertEnabled, isNotifSoundEnabled } from './modules/notifications.js';
-import { initInput, clearPendingImages, handleInputSync, autoResize, builtinCommands } from './modules/input.js';
+import { initInput, clearPendingImages, handleInputSync, autoResize, builtinCommands, sendMessage } from './modules/input.js';
 import { initQrCode } from './modules/qrcode.js';
 import { initFileBrowser, loadRootDirectory, refreshTree, handleFsList, handleFsRead, handleDirChanged, refreshIfOpen, handleFileChanged, handleFileHistory, handleGitDiff, handleFileAt, getPendingNavigate, closeFileViewer } from './modules/filebrowser.js';
-import { initTerminal, openTerminal, closeTerminal, resetTerminals, handleTermList, handleTermCreated, handleTermOutput, handleTermExited, handleTermClosed } from './modules/terminal.js';
+import { initTerminal, openTerminal, closeTerminal, resetTerminals, handleTermList, handleTermCreated, handleTermOutput, handleTermExited, handleTermClosed, sendTerminalCommand } from './modules/terminal.js';
 import { initStickyNotes, handleNotesList, handleNoteCreated, handleNoteUpdated, handleNoteDeleted } from './modules/sticky-notes.js';
 import { initTheme, getThemeColor, getComputedVar, onThemeChange, getCurrentTheme } from './modules/theme.js';
 import { initTools, resetToolState, saveToolState, restoreToolState, renderAskUserQuestion, markAskUserAnswered, renderPermissionRequest, markPermissionResolved, markPermissionCancelled, renderPlanBanner, renderPlanCard, handleTodoWrite, handleTaskCreate, handleTaskUpdate, startThinking, appendThinking, stopThinking, resetThinkingGroup, createToolItem, updateToolExecuting, updateToolResult, markAllToolsDone, addTurnMeta, enableMainInput, getTools, getPlanContent, setPlanContent, isPlanFilePath, getTodoTools, updateSubagentActivity, addSubagentToolEntry, markSubagentDone, updateSubagentProgress, initSubagentStop, closeToolGroup, removeToolFromGroup } from './modules/tools.js';
-import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDaemonConfig, handleSetPinResult, handleKeepAwakeChanged, handleShutdownResult } from './modules/server-settings.js';
+import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDaemonConfig, handleSetPinResult, handleKeepAwakeChanged, handleShutdownResult, handleSharedEnv, handleSharedEnvSaved, handleGlobalClaudeMdRead, handleGlobalClaudeMdWrite } from './modules/server-settings.js';
+import { initProjectSettings, handleInstructionsRead, handleInstructionsWrite, handleProjectEnv, handleProjectEnvSaved, isProjectSettingsOpen, handleProjectSharedEnv, handleProjectSharedEnvSaved } from './modules/project-settings.js';
+import { initSkills, handleSkillInstalled, handleSkillUninstalled } from './modules/skills.js';
 
 // --- Base path for multi-project routing ---
   var slugMatch = location.pathname.match(/^\/p\/([a-z0-9_-]+)/);
@@ -24,10 +26,7 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
   var inputEl = $("input");
   var sendBtn = $("send-btn");
   function getStatusDot() {
-    var active = document.querySelector("#icon-strip-projects .icon-strip-item.active .icon-strip-status");
-    if (active) return active;
-    // Fallback: home icon status dot
-    return document.querySelector(".icon-strip-home .icon-strip-status");
+    return document.querySelector("#icon-strip-projects .icon-strip-item.active .icon-strip-status");
   }
   var headerTitleEl = $("header-title");
   var headerRenameBtn = $("header-rename-btn");
@@ -73,15 +72,42 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
   function renderProjectList() {
     // Render icon strip projects
     var iconStripProjects = cachedProjects.map(function (p) {
-      return { slug: p.slug, name: p.title || p.project, isProcessing: p.isProcessing };
+      return { slug: p.slug, name: p.title || p.project, icon: p.icon || null, isProcessing: p.isProcessing };
     });
     renderIconStrip(iconStripProjects, currentSlug);
+    // Update title bar project name and icon if it changed
+    for (var pi = 0; pi < cachedProjects.length; pi++) {
+      if (cachedProjects[pi].slug === currentSlug) {
+        var updatedName = cachedProjects[pi].title || cachedProjects[pi].project;
+        var tbName = document.getElementById("title-bar-project-name");
+        if (tbName && updatedName) tbName.textContent = updatedName;
+        var tbIcon = document.getElementById("title-bar-project-icon");
+        if (tbIcon) {
+          var pIcon = cachedProjects[pi].icon || null;
+          if (pIcon) {
+            tbIcon.textContent = pIcon;
+            if (typeof twemoji !== "undefined") {
+              twemoji.parse(tbIcon, { folder: "svg", ext: ".svg" });
+            }
+            tbIcon.classList.add("has-icon");
+            try { localStorage.setItem("clay-project-icon-" + (currentSlug || "default"), pIcon); } catch (e) {}
+          } else {
+            tbIcon.textContent = "";
+            tbIcon.classList.remove("has-icon");
+            try { localStorage.removeItem("clay-project-icon-" + (currentSlug || "default")); } catch (e) {}
+          }
+        }
+        break;
+      }
+    }
     // Re-apply current socket status to the active icon's dot
     var dot = getStatusDot();
     if (dot) {
       if (connected && processing) { dot.classList.add("connected"); dot.classList.add("processing"); }
       else if (connected) { dot.classList.add("connected"); }
     }
+    // Start/stop cross-project IO blink for non-active processing projects
+    updateCrossProjectBlink();
   }
 
   if (projectListAddBtn) {
@@ -153,7 +179,7 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
   var projectName = "";
   var turnCounter = 0;
 
-  // Restore cached project name for instant display (before WS connects)
+  // Restore cached project name and icon for instant display (before WS connects)
   try {
     var _cachedProjectName = localStorage.getItem("clay-project-name-" + (currentSlug || "default"));
     if (_cachedProjectName) {
@@ -162,6 +188,17 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
       var _tbp = $("title-bar-project-name");
       if (_tbp) _tbp.textContent = _cachedProjectName;
     }
+    var _cachedProjectIcon = localStorage.getItem("clay-project-icon-" + (currentSlug || "default"));
+    if (_cachedProjectIcon) {
+      var _tbi = $("title-bar-project-icon");
+      if (_tbi) {
+        _tbi.textContent = _cachedProjectIcon;
+        if (typeof twemoji !== "undefined") {
+          twemoji.parse(_tbi, { folder: "svg", ext: ".svg" });
+        }
+        _tbi.classList.add("has-icon");
+      }
+    }
   } catch (e) {}
   var messageUuidMap = [];
   // pendingRewindUuid is now in modules/rewind.js
@@ -435,8 +472,45 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     if (!connected) return;
     var dot = getStatusDot();
     if (dot) dot.classList.add("io");
+    // Also blink the active session's processing dot in sidebar
+    var sessionDot = document.querySelector(".session-item.active .session-processing");
+    if (sessionDot) sessionDot.classList.add("io");
     clearTimeout(ioTimer);
-    ioTimer = setTimeout(function () { var d = getStatusDot(); if (d) d.classList.remove("io"); }, 80);
+    ioTimer = setTimeout(function () {
+      var d = getStatusDot();
+      if (d) d.classList.remove("io");
+      var sd = document.querySelector(".session-item.active .session-processing.io");
+      if (sd) sd.classList.remove("io");
+    }, 80);
+  }
+
+  // --- Per-session IO blink for non-active sessions ---
+  var sessionIoTimers = {};
+  function blinkSessionDot(sessionId) {
+    var el = document.querySelector('.session-item[data-session-id="' + sessionId + '"] .session-processing');
+    if (!el) return;
+    el.classList.add("io");
+    clearTimeout(sessionIoTimers[sessionId]);
+    sessionIoTimers[sessionId] = setTimeout(function () {
+      el.classList.remove("io");
+      delete sessionIoTimers[sessionId];
+    }, 80);
+  }
+
+  // --- Cross-project IO blink for non-active processing projects ---
+  var crossProjectBlinkTimer = null;
+  function updateCrossProjectBlink() {
+    if (crossProjectBlinkTimer) { clearTimeout(crossProjectBlinkTimer); crossProjectBlinkTimer = null; }
+    function doBlink() {
+      var dots = document.querySelectorAll("#icon-strip-projects .icon-strip-item:not(.active) .icon-strip-status.processing");
+      if (dots.length === 0) { crossProjectBlinkTimer = null; return; }
+      for (var i = 0; i < dots.length; i++) { dots[i].classList.add("io"); }
+      setTimeout(function () {
+        for (var j = 0; j < dots.length; j++) { dots[j].classList.remove("io"); }
+        crossProjectBlinkTimer = setTimeout(doBlink, 150 + Math.random() * 350);
+      }, 80);
+    }
+    crossProjectBlinkTimer = setTimeout(doBlink, 50);
   }
 
   // --- Urgent favicon blink (permission / ask user) ---
@@ -521,7 +595,7 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
   var currentModels = [];
   var currentModel = "";
   var currentMode = "default";
-  var currentEffort = "high";
+  var currentEffort = "medium";
   var currentBetas = [];
   var skipPermsEnabled = false;
 
@@ -1586,8 +1660,17 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     suggestionChipsEl.innerHTML = "";
     var chip = document.createElement("button");
     chip.className = "suggestion-chip";
-    chip.innerHTML = iconHtml("sparkles") + " " + escapeHtml(suggestion);
+    chip.innerHTML =
+      '<span class="suggestion-chip-send">' + iconHtml("sparkles") +
+      '<span class="suggestion-chip-text">' + escapeHtml(suggestion) + '</span></span>' +
+      '<span class="suggestion-chip-edit">' + iconHtml("pencil") + '</span>';
     chip.addEventListener("click", function () {
+      inputEl.value = suggestion;
+      hideSuggestionChips();
+      sendMessage();
+    });
+    chip.querySelector(".suggestion-chip-edit").addEventListener("click", function (e) {
+      e.stopPropagation();
       inputEl.value = suggestion;
       inputEl.focus();
       inputEl.select();
@@ -1604,14 +1687,6 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     suggestionChipsEl.classList.add("hidden");
   }
 
-  function acceptSuggestionChip() {
-    if (suggestionChipsEl.classList.contains("hidden")) return false;
-    var chip = suggestionChipsEl.querySelector(".suggestion-chip");
-    if (!chip) return false;
-    chip.click();
-    return true;
-  }
-
   function resetClientState() {
     messagesEl.innerHTML = "";
     currentMsgEl = null;
@@ -1921,7 +1996,7 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
             for (var ei = 0; ei < levels.length; ei++) {
               if (levels[ei] === currentEffort) { effortValid = true; break; }
             }
-            if (!effortValid) currentEffort = "high";
+            if (!effortValid) currentEffort = "medium";
           }
           updateConfigChip();
           break;
@@ -1943,6 +2018,14 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
           showToast(msg.message, msg.level, msg.detail);
           break;
 
+        case "skill_installed":
+          handleSkillInstalled(msg);
+          break;
+
+        case "skill_uninstalled":
+          handleSkillUninstalled(msg);
+          break;
+
         case "input_sync":
           handleInputSync(msg.text);
           break;
@@ -1951,6 +2034,10 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
           renderSessionList(msg.sessions || []);
           break;
 
+        case "session_io":
+          blinkSessionDot(msg.id);
+          break;
+
         case "search_results":
           handleSearchResults(msg);
           break;
@@ -2265,7 +2352,41 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
           break;
 
         case "fs_read_result":
-          handleFsRead(msg);
+          if (msg.path === "CLAUDE.md" && isProjectSettingsOpen()) {
+            handleInstructionsRead(msg);
+          } else {
+            handleFsRead(msg);
+          }
+          break;
+
+        case "fs_write_result":
+          handleInstructionsWrite(msg);
+          break;
+
+        case "project_env_result":
+          handleProjectEnv(msg);
+          break;
+
+        case "set_project_env_result":
+          handleProjectEnvSaved(msg);
+          break;
+
+        case "global_claude_md_result":
+          handleGlobalClaudeMdRead(msg);
+          break;
+
+        case "write_global_claude_md_result":
+          handleGlobalClaudeMdWrite(msg);
+          break;
+
+        case "shared_env_result":
+          handleSharedEnv(msg);
+          handleProjectSharedEnv(msg);
+          break;
+
+        case "set_shared_env_result":
+          handleSharedEnvSaved(msg);
+          handleProjectSharedEnvSaved(msg);
           break;
 
         case "fs_file_changed":
@@ -2341,6 +2462,24 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
           handleRemoveProjectResult(msg);
           break;
 
+        case "reorder_projects_result":
+          if (!msg.ok) {
+            showToast(msg.error || "Failed to reorder projects", "error");
+          }
+          break;
+
+        case "set_project_title_result":
+          if (!msg.ok) {
+            showToast(msg.error || "Failed to rename project", "error");
+          }
+          break;
+
+        case "set_project_icon_result":
+          if (!msg.ok) {
+            showToast(msg.error || "Failed to set icon", "error");
+          }
+          break;
+
         case "projects_updated":
           updateProjectList(msg);
           break;
@@ -2493,6 +2632,7 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     get ws() { return ws; },
     get connected() { return connected; },
     get processing() { return processing; },
+    get basePath() { return basePath; },
     inputEl: inputEl,
     sendBtn: sendBtn,
     slashMenu: slashMenu,
@@ -2508,7 +2648,6 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     resetContextData: resetContextData,
     showImageModal: showImageModal,
     hideSuggestionChips: hideSuggestionChips,
-    acceptSuggestionChip: acceptSuggestionChip,
   });
 
   // --- Notifications module (viewport, banners, notifications, debug, service worker) ---
@@ -2532,10 +2671,25 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     wsPath: wsPath,
     get currentModels() { return currentModels; },
     set currentModels(v) { currentModels = v; updateConfigChip(); },
+    get currentModel() { return currentModel; },
+    get currentMode() { return currentMode; },
+    get currentEffort() { return currentEffort; },
+    get currentBetas() { return currentBetas; },
     setContextView: setContextView,
     applyContextView: applyContextView,
   });
 
+  // --- Project Settings ---
+  initProjectSettings({
+    get ws() { return ws; },
+    get connected() { return connected; },
+    get currentModels() { return currentModels; },
+    get currentModel() { return currentModel; },
+    get currentMode() { return currentMode; },
+    get currentEffort() { return currentEffort; },
+    get currentBetas() { return currentBetas; },
+  }, getEmojiCategories());
+
   // --- QR code ---
   initQrCode();
 
@@ -2564,6 +2718,15 @@ import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDa
     get connected() { return connected; },
   });
 
+  // --- Skills ---
+  initSkills({
+    get ws() { return ws; },
+    get connected() { return connected; },
+    basePath: basePath,
+    openTerminal: function () { openTerminal(); },
+    sendTerminalCommand: function (cmd) { sendTerminalCommand(cmd); },
+  });
+
   // --- Remove project ---
   function confirmRemoveProject(slug, name) {
     showConfirm("Remove project \"" + name + "\"?", function () {

package/lib/public/css/diff.css

@@ -12,8 +12,8 @@
 
 .diff-table {
   border-collapse: collapse;
-  width: 100%;
-  table-layout: fixed;
+  min-width: 100%;
+  table-layout: auto;
 }
 
 /* --- Line numbers --- */
@@ -80,8 +80,7 @@
 /* --- Split diff specifics --- */
 .diff-table-split .diff-code-old,
 .diff-table-split .diff-code-new {
-  max-width: 0;
-  overflow: hidden;
+  width: 50%;
 }
 
 /* Split: divider between left and right */