clay-server 2.17.0 → 2.18.0-beta.10

package/lib/public/app.js

@@ -28,6 +28,8 @@ import { initTooltips, registerTooltip } from './modules/tooltip.js';
 import { initMateWizard, openMateWizard, closeMateWizard, handleMateCreated } from './modules/mate-wizard.js';
 import { initCommandPalette, handlePaletteSessionSwitch, setPaletteVersion } from './modules/command-palette.js';
 import { initLongPress } from './modules/longpress.js';
+import { initMention, handleMentionStart, handleMentionStream, handleMentionDone, handleMentionError, handleMentionActivity, renderMentionUser, renderMentionResponse } from './modules/mention.js';
+import { initDebate, handleDebateStarted, handleDebateTurn, handleDebateActivity, handleDebateStream, handleDebateTurnDone, handleDebateCommentQueued, handleDebateCommentInjected, handleDebateEnded, handleDebateError, renderDebateStarted, renderDebateTurnDone, renderDebateEnded, renderDebateCommentInjected, openDebateModal, closeDebateModal } from './modules/debate.js';
 
 // --- Base path for multi-project routing ---
   var slugMatch = location.pathname.match(/^\/p\/([a-z0-9_-]+)/);
@@ -61,6 +63,7 @@ import { initLongPress } from './modules/longpress.js';
 
   // --- DM Mode ---
   var dmMode = false;
+  var pendingMateDmRestore = false; // suppress regular history while restoring mate DM
   var dmKey = null;
   var dmTargetUser = null;
   var dmUnread = {}; // { otherUserId: count }
@@ -693,9 +696,9 @@ import { initLongPress } from './modules/longpress.js';
       }
     }
 
-    // Hide user-island (my avatar behind it becomes visible)
+    // Hide user-island in human DM, keep visible in Mate DM
     var userIsland = document.getElementById("user-island");
-    if (userIsland) userIsland.classList.add("dm-hidden");
+    if (userIsland && !isMate) userIsland.classList.add("dm-hidden");
 
     // Render DM messages
     messagesEl.innerHTML = "";
@@ -740,6 +743,7 @@ import { initLongPress } from './modules/longpress.js';
   function exitDmMode() {
     if (!dmMode) return;
     dmMode = false;
+    pendingMateDmRestore = false;
     dmKey = null;
     dmTargetUser = null;
     setCurrentDmUser(null);
@@ -904,6 +908,13 @@ import { initLongPress } from './modules/longpress.js';
       var mateSessionDot = document.querySelector(".mate-session-item.active .session-processing");
       if (mateSessionDot) mateSessionDot.style.display = "none";
     }
+    // Handle skill_installed in mate DM context (for skill install modal)
+    if (msg.type === "skill_installed") {
+      handleSkillInstalled(msg);
+      if (msg.success) knownInstalledSkills[msg.skill] = true;
+      handleSkillInstallWs(msg);
+    }
+
     // Intercept session_list for mate sidebar
     if (msg.type === "init" && msg.sessions) {
       renderMateSessionList(msg.sessions);
@@ -2121,18 +2132,9 @@ import { initLongPress } from './modules/longpress.js';
       if (!activityEl) {
         activityEl = document.createElement("div");
         activityEl.className = "activity-inline";
-        var isMateDmActive = dmMode && dmTargetUser && dmTargetUser.isMate;
-        if (isMateDmActive) {
-          activityEl.classList.add("mate-activity");
-          var mateAvUrl = document.body.dataset.mateAvatarUrl || "";
-          activityEl.innerHTML =
-            '<img class="mate-activity-avatar" src="' + mateAvUrl + '" alt="">' +
-            '<span class="activity-text"></span>';
-        } else {
-          activityEl.innerHTML =
-            '<span class="activity-icon">' + iconHtml("sparkles") + '</span>' +
-            '<span class="activity-text"></span>';
-        }
+        activityEl.innerHTML =
+          '<span class="activity-icon">' + iconHtml("sparkles") + '</span>' +
+          '<span class="activity-text"></span>';
         addToMessages(activityEl);
         refreshIcons();
       }
@@ -3690,10 +3692,27 @@ import { initLongPress } from './modules/longpress.js';
         ws.send(JSON.stringify({ type: "mate_list" }));
       } catch(e) {}
 
-      // Restore mate DM after hard refresh
+      // Restore the last active session for this project (overrides server global)
+      try {
+        var savedSessionId = localStorage.getItem("clay_active_session_" + basePath);
+        if (savedSessionId) {
+          ws.send(JSON.stringify({ type: "switch_session", id: parseInt(savedSessionId, 10) }));
+        }
+      } catch(e) {}
+
+      // Restore mate DM after hard refresh or server restart
       try {
         var savedMateDm = localStorage.getItem("clay_active_mate_dm");
-        if (savedMateDm && !dmMode) {
+        if (savedMateDm) {
+          // If dmMode is stale (server restarted while in mate DM), clean up first
+          if (dmMode) {
+            dmMode = false;
+            savedMainWs = null;
+            mateWs = null;
+            document.body.classList.remove("mate-dm-active");
+          }
+          pendingMateDmRestore = true;
+          messagesEl.innerHTML = ""; // prevent regular history flash
           openDm(savedMateDm);
         }
       } catch(e) {}
@@ -3733,8 +3752,18 @@ import { initLongPress } from './modules/longpress.js';
     };
 
     ws.onmessage = function (event) {
-      // If this WS is stashed while in mate DM, ignore its messages
-      if (savedMainWs === this) return;
+      // If this WS is stashed while in mate DM, only allow skill_installed through
+      if (savedMainWs === this) {
+        try {
+          var stashedMsg = JSON.parse(event.data);
+          if (stashedMsg.type === "skill_installed") {
+            handleSkillInstalled(stashedMsg);
+            if (stashedMsg.success) knownInstalledSkills[stashedMsg.skill] = true;
+            handleSkillInstallWs(stashedMsg);
+          }
+        } catch (e) {}
+        return;
+      }
 
       // Backup: if we're receiving messages, we're connected
       if (!connected) {
@@ -3751,6 +3780,15 @@ import { initLongPress } from './modules/longpress.js';
   }
 
   function processMessage(msg) {
+      // Suppress regular project messages while restoring mate DM
+      if (pendingMateDmRestore) {
+        if (msg.type === "dm_history" || msg.type === "dm_list" || msg.type === "mate_list" || msg.type === "mate_created" || msg.type === "info") {
+          // Let these through
+        } else {
+          return; // skip regular session messages
+        }
+      }
+
       switch (msg.type) {
         case "history_meta":
           historyFrom = msg.from;
@@ -4043,6 +4081,8 @@ import { initLongPress } from './modules/longpress.js';
           }
           activeSessionId = msg.id;
           cliSessionId = msg.cliSessionId || null;
+          // Persist active session per project so reconnect restores it
+          try { localStorage.setItem("clay_active_session_" + basePath, String(msg.id)); } catch(e) {}
           clearRemoteCursors();
           resetClientState();
           updateRalphBars();
@@ -4515,6 +4555,7 @@ import { initLongPress } from './modules/longpress.js';
 
         // --- DM ---
         case "dm_history":
+          pendingMateDmRestore = false; // DM data arrived, resume normal processing
           // Attach projectSlug to targetUser for mate DMs
           if (msg.projectSlug && msg.targetUser) {
             msg.targetUser.projectSlug = msg.projectSlug;
@@ -4638,6 +4679,83 @@ import { initLongPress } from './modules/longpress.js';
           showToast(msg.error || "Mate operation failed", "error");
           break;
 
+        // --- @Mention ---
+        case "mention_start":
+          handleMentionStart(msg);
+          break;
+
+        case "mention_activity":
+          handleMentionActivity(msg);
+          break;
+
+        case "mention_stream":
+          handleMentionStream(msg);
+          break;
+
+        case "mention_done":
+          handleMentionDone(msg);
+          break;
+
+        case "mention_error":
+          handleMentionError(msg);
+          if (msg.error) showToast("@Mention: " + msg.error, "error");
+          break;
+
+        case "mention_user":
+          // History replay: render mention user message from another client
+          renderMentionUser(msg);
+          break;
+
+        case "mention_response":
+          // History replay: render mention response from another client
+          renderMentionResponse(msg);
+          break;
+
+        // --- Debate ---
+        case "debate_preparing":
+          showDebateSticky("preparing", msg);
+          break;
+
+        case "debate_started":
+          showDebateSticky("live", msg);
+          handleDebateStarted(msg);
+          break;
+
+        case "debate_turn":
+          handleDebateTurn(msg);
+          if (msg.round) updateDebateRound(msg.round);
+          break;
+
+        case "debate_activity":
+          handleDebateActivity(msg);
+          break;
+
+        case "debate_stream":
+          handleDebateStream(msg);
+          break;
+
+        case "debate_turn_done":
+          handleDebateTurnDone(msg);
+          break;
+
+        case "debate_comment_queued":
+          handleDebateCommentQueued(msg);
+          break;
+
+        case "debate_comment_injected":
+          handleDebateCommentInjected(msg);
+          break;
+
+        case "debate_ended":
+          showDebateSticky("ended", msg);
+          handleDebateEnded(msg);
+          break;
+
+        case "debate_error":
+          handleDebateError(msg);
+          if (msg.error) showToast("Debate: " + msg.error, "error");
+          break;
+
         case "daemon_config":
           updateDaemonConfig(msg.config);
           break;
@@ -4958,6 +5076,28 @@ import { initLongPress } from './modules/longpress.js';
     showMatePreThinking: function () { showMatePreThinking(); },
   });
 
+  // --- @Mention module ---
+  initMention({
+    get ws() { return ws; },
+    get connected() { return connected; },
+    inputEl: inputEl,
+    messagesEl: messagesEl,
+    matesList: function () { return cachedMatesList || []; },
+    scrollToBottom: scrollToBottom,
+    addUserMessage: addUserMessage,
+    addCopyHandler: addCopyHandler,
+  });
+
+  // --- Debate module ---
+  initDebate({
+    get ws() { return ws; },
+    messagesEl: messagesEl,
+    scrollToBottom: scrollToBottom,
+    addCopyHandler: addCopyHandler,
+    matesList: function () { return cachedMatesList || []; },
+    currentMateId: function () { return (dmTargetUser && dmTargetUser.isMate) ? dmTargetUser.id : null; },
+  });
+
   // --- STT module (voice input via Web Speech API) ---
   initSTT({
     inputEl: inputEl,
@@ -5449,6 +5589,13 @@ import { initLongPress } from './modules/longpress.js';
         updateLoopBanner(loopIteration, loopMaxIterations, "running");
       }
     }
+
+    // Restore debate sticky on session switch
+    if (debateStickyState && debateStickyState.phase) {
+      showDebateSticky(debateStickyState.phase, debateStickyState.msg);
+    } else {
+      showDebateSticky("hide", null);
+    }
   }
 
   // --- Skill install dialog (generic) ---
@@ -5677,6 +5824,24 @@ import { initLongPress } from './modules/longpress.js';
     }, cb);
   }
 
+  function requireClayDebateSetup(cb) {
+    requireSkills({
+      title: "Skill Installation Required",
+      reason: "The Debate Setup skill is required to start a debate.",
+      skills: [{ name: "clay-debate-setup", url: "https://github.com/chadbyte/clay-debate-setup", scope: "global" }]
+    }, cb);
+  }
+
+  // Debate button in mate sidebar
+  var debateBtn = document.getElementById("mate-debate-btn");
+  if (debateBtn) {
+    debateBtn.addEventListener("click", function () {
+      requireClayDebateSetup(function () {
+        openDebateModal();
+      });
+    });
+  }
+
   // --- Ralph Wizard ---
 
   var wizardMode = "draft"; // "draft" or "own"
@@ -6124,6 +6289,130 @@ import { initLongPress } from './modules/longpress.js';
     }
   }
 
+  // --- Debate Sticky Banner ---
+  var debateStickyState = null;
+  var debateHandRaiseOpen = false;
+
+  function showDebateSticky(phase, msg) {
+    if (phase === "ended" || phase === "hide") {
+      debateStickyState = null;
+    } else {
+      debateStickyState = { phase: phase, msg: msg };
+    }
+    var stickyEl = document.getElementById("debate-sticky");
+    if (!stickyEl) return;
+
+    if (phase === "ended" || phase === "hide") {
+      stickyEl.classList.add("hidden");
+      stickyEl.innerHTML = "";
+      debateHandRaiseOpen = false;
+      return;
+    }
+
+    var topic = (msg && msg.topic) || "Debate";
+    var truncTopic = topic.length > 30 ? topic.slice(0, 30) + "\u2026" : topic;
+
+    if (phase === "preparing") {
+      stickyEl.innerHTML =
+        '<div class="debate-sticky-inner">' +
+          '<div class="debate-sticky-header">' +
+            '<span class="debate-sticky-icon">' + iconHtml("mic") + '</span>' +
+            '<span class="debate-sticky-label">' + escapeHtml(truncTopic) + '</span>' +
+            '<span class="debate-sticky-status" id="debate-sticky-status">Setting up\u2026</span>' +
+            '<button class="debate-sticky-action debate-sticky-cancel" title="Cancel debate">' + iconHtml("x") + '</button>' +
+          '</div>' +
+        '</div>';
+      stickyEl.classList.remove("hidden");
+      stickyEl.className = "debate-sticky preparing";
+      refreshIcons();
+
+      stickyEl.querySelector(".debate-sticky-cancel").addEventListener("click", function (e) {
+        e.stopPropagation();
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "debate_stop" }));
+        }
+        stickyEl.classList.add("hidden");
+        stickyEl.innerHTML = "";
+      });
+    } else if (phase === "live") {
+      stickyEl.innerHTML =
+        '<div class="debate-sticky-inner">' +
+          '<div class="debate-sticky-header">' +
+            '<span class="debate-sticky-icon">' + iconHtml("mic") + '</span>' +
+            '<span class="debate-sticky-label">' + escapeHtml(truncTopic) + '</span>' +
+            '<span class="debate-sticky-status" id="debate-sticky-status">Live</span>' +
+            '<span class="debate-sticky-round" id="debate-sticky-round">R1</span>' +
+            '<button class="debate-sticky-action debate-sticky-hand" title="Raise hand">' + iconHtml("hand") + '</button>' +
+            '<button class="debate-sticky-action debate-sticky-stop" title="Stop debate">' + iconHtml("square") + '</button>' +
+          '</div>' +
+          '<div class="debate-sticky-hand-input hidden" id="debate-sticky-hand-input">' +
+            '<textarea id="debate-sticky-comment" rows="1" placeholder="Your comment\u2026"></textarea>' +
+            '<button class="debate-sticky-send" id="debate-sticky-send">Send</button>' +
+            '<button class="debate-sticky-send-cancel" id="debate-sticky-send-cancel">Cancel</button>' +
+          '</div>' +
+        '</div>';
+      stickyEl.classList.remove("hidden");
+      stickyEl.className = "debate-sticky live";
+      refreshIcons();
+      debateHandRaiseOpen = false;
+
+      stickyEl.querySelector(".debate-sticky-hand").addEventListener("click", function (e) {
+        e.stopPropagation();
+        toggleDebateHandRaise();
+      });
+
+      stickyEl.querySelector(".debate-sticky-stop").addEventListener("click", function (e) {
+        e.stopPropagation();
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "debate_stop" }));
+        }
+      });
+
+      var sendBtn = document.getElementById("debate-sticky-send");
+      var cancelBtn = document.getElementById("debate-sticky-send-cancel");
+      var commentInput = document.getElementById("debate-sticky-comment");
+
+      if (sendBtn) sendBtn.addEventListener("click", function () { sendDebateStickyComment(); });
+      if (cancelBtn) cancelBtn.addEventListener("click", function () { toggleDebateHandRaise(false); });
+      if (commentInput) {
+        commentInput.addEventListener("keydown", function (e) {
+          if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); sendDebateStickyComment(); }
+          if (e.key === "Escape") { toggleDebateHandRaise(false); }
+        });
+      }
+    }
+  }
+
+  function toggleDebateHandRaise(forceState) {
+    var inputWrap = document.getElementById("debate-sticky-hand-input");
+    var commentInput = document.getElementById("debate-sticky-comment");
+    if (!inputWrap) return;
+    var show = typeof forceState === "boolean" ? forceState : !debateHandRaiseOpen;
+    debateHandRaiseOpen = show;
+    if (show) {
+      inputWrap.classList.remove("hidden");
+      if (commentInput) { commentInput.value = ""; commentInput.focus(); }
+    } else {
+      inputWrap.classList.add("hidden");
+    }
+  }
+
+  function sendDebateStickyComment() {
+    var commentInput = document.getElementById("debate-sticky-comment");
+    if (!commentInput) return;
+    var text = commentInput.value.trim();
+    if (!text) return;
+    if (ws && ws.readyState === 1) {
+      ws.send(JSON.stringify({ type: "debate_comment", text: text }));
+    }
+    toggleDebateHandRaise(false);
+  }
+
+  function updateDebateRound(round) {
+    var roundEl = document.getElementById("debate-sticky-round");
+    if (roundEl) roundEl.textContent = "R" + round;
+  }
+
   // --- Ralph Preview Modal ---
   function openRalphPreviewModal() {
     var modal = document.getElementById("ralph-preview-modal");

package/lib/public/css/base.css

@@ -201,6 +201,7 @@ html, body {
   flex-direction: column;
   height: 100%;
   height: 100dvh;
+  position: relative;
 }
 
 #layout-body {

package/lib/public/css/input.css

@@ -629,6 +629,11 @@
   #input-area {
     padding-bottom: calc(var(--safe-bottom) + 56px + 8px);
   }
+
+  /* When keyboard is open, tab bar is hidden behind keyboard — remove the offset */
+  body.keyboard-open #input-area {
+    padding-bottom: 8px;
+  }
 }
 
 /* ==========================================================================

package/lib/public/css/mates.css

@@ -1958,10 +1958,7 @@ body.mate-dm-active .mate-permission.resolved .permission-decision-label {
   color: var(--text-dimmer);
 }
 
-/* --- Mate Activity: avatar + text (hidden, dots row is enough) --- */
-body.mate-dm-active .activity-inline {
-  display: none;
-}
+/* --- Mate Activity: avatar + text --- */
 
 /* --- Mate AskUserQuestion: avatar + content layout (matches msg-assistant) --- */
 body.mate-dm-active .mate-ask-user {
@@ -2005,8 +2002,10 @@ body.mate-dm-active .ask-user-container:not(.mate-ask-user),
 body.mate-dm-active .subagent-log,
 body.mate-dm-active .conflict-msg,
 body.mate-dm-active .context-overflow-msg,
-body.mate-dm-active .sys-msg,
-body.mate-dm-active .activity-inline {
+body.mate-dm-active .sys-msg {
+  display: none;
+}
+body.mate-dm-active .activity-inline:not(.mention-activity-bar) {
   padding-left: 60px;
   margin-left: 0;
   margin-right: 0;