clay-server 2.31.0 → 2.32.0-beta.10

package/lib/public/modules/mate-sidebar.js

@@ -1,6 +1,7 @@
 import { avatarUrl, mateAvatarUrl } from './avatar.js';
 import { escapeHtml } from './utils.js';
 import { iconHtml, refreshIcons } from './icons.js';
+import { store } from './store.js';
 import { hideKnowledge } from './mate-knowledge.js';
 import { isSchedulerOpen, closeScheduler } from './scheduler.js';
 import { hideNotes } from './sticky-notes.js';
@@ -150,6 +151,43 @@ export function showMateSidebar(mateId, mateData) {
   if (avatarEl) avatarEl.src = mateAvUrl;
   if (nameEl) nameEl.textContent = displayName;
 
+  // Vendor toggle in header
+  var mateVendorWrap = document.getElementById("mate-vendor-toggle");
+  if (mateVendorWrap) {
+    var available = store.get('availableVendors') || [];
+    var mateVendor = mateData.vendor || "claude";
+    var vendorIcons = { claude: "/claude-code-avatar.png", codex: "/codex-avatar.png" };
+    var vendorNames = { claude: "Claude Code", codex: "Codex" };
+    var vendorKeys = ["claude", "codex"];
+    mateVendorWrap.innerHTML = "";
+    for (var vi = 0; vi < vendorKeys.length; vi++) {
+      var vk = vendorKeys[vi];
+      var vBtn = document.createElement("button");
+      vBtn.className = "mate-vendor-btn" + (vk === mateVendor ? " active" : "");
+      if (available.indexOf(vk) === -1) vBtn.classList.add("disabled");
+      vBtn.dataset.vendor = vk;
+      vBtn.innerHTML = '<img src="' + vendorIcons[vk] + '" class="mate-vendor-icon" alt="' + vendorNames[vk] + '"><span class="mate-vendor-label">' + vendorNames[vk] + '</span>';
+      vBtn.addEventListener("click", function() {
+        var v = this.dataset.vendor;
+        var avail = store.get('availableVendors') || [];
+        if (avail.indexOf(v) === -1) return;
+        if (v === (currentMate && currentMate.vendor || "claude")) return;
+        if (!currentMateId) return;
+        var ws = getWs();
+        if (ws) ws.send(JSON.stringify({ type: "mate_update", mateId: currentMateId, updates: { vendor: v } }));
+        // Update UI immediately
+        mateVendorWrap.querySelectorAll(".mate-vendor-btn").forEach(function(b) {
+          b.classList.toggle("active", b.dataset.vendor === v);
+        });
+        if (currentMate) currentMate.vendor = v;
+        // If current session is new (no history), sync vendor to input toggle
+        var _hTotal = store.get('historyTotal') || 0;
+        if (_hTotal === 0) store.set({ currentVendor: v });
+      });
+      mateVendorWrap.appendChild(vBtn);
+    }
+  }
+
   // Also populate collapsed header info
   var collapsedAvatar = document.getElementById("mate-collapsed-avatar");
   var collapsedName = document.getElementById("mate-collapsed-name");

package/lib/public/modules/mention.js

@@ -2,6 +2,7 @@ import { mateAvatarUrl, userAvatarUrl } from './avatar.js';
 import { renderMarkdown, highlightCodeBlocks } from './markdown.js';
 import { escapeHtml, copyToClipboard } from './utils.js';
 import { iconHtml, refreshIcons } from './icons.js';
+import { store } from './store.js';
 
 var ctx;
 
@@ -77,13 +78,17 @@ export function showMentionMenu(query) {
   var menuEl = document.getElementById("mention-menu");
   if (!menuEl) return;
 
-  menuEl.innerHTML = mentionFiltered.map(function (m, i) {
+  menuEl.innerHTML = '<div class="mention-hint">Mention a Mate to get advice on your current session<button class="mention-close-btn" aria-label="Close">&times;</button></div>' +
+  mentionFiltered.map(function (m, i) {
     var name = (m.profile && m.profile.displayName) || m.name || "Mate";
     var color = (m.profile && m.profile.avatarColor) || "#6c5ce7";
     var bio = m.bio || (m.profile && m.profile.bio) || "";
     var avatarSrc = mateAvatarUrl(m, 24);
+    var mVendor = m.vendor || "claude";
+    var vendorIcons = { claude: "/claude-code-avatar.png", codex: "/codex-avatar.png" };
+    var vendorBadge = vendorIcons[mVendor] ? '<img class="mention-item-vendor-badge" src="' + vendorIcons[mVendor] + '" alt="' + mVendor + '">' : '';
     return '<div class="mention-item' + (i === 0 ? ' active' : '') + '" data-idx="' + i + '">' +
-      '<img class="mention-item-avatar" src="' + escapeHtml(avatarSrc) + '" width="24" height="24" />' +
+      '<div class="mention-item-avatar-wrap"><img class="mention-item-avatar" src="' + escapeHtml(avatarSrc) + '" width="24" height="24" />' + vendorBadge + '</div>' +
       '<div class="mention-item-info">' +
         '<span class="mention-item-name">' + escapeHtml(name) +
           (m.primary ? ' <span class="mention-item-badge">SYSTEM</span>' : '') +
@@ -95,6 +100,18 @@ export function showMentionMenu(query) {
   }).join("");
   menuEl.classList.add("visible");
 
+  var closeBtn = menuEl.querySelector(".mention-close-btn");
+  if (closeBtn) closeBtn.addEventListener("click", function (e) {
+    e.preventDefault();
+    e.stopPropagation();
+    hideMentionMenu();
+    clearMentionState();
+    if (ctx && ctx.inputEl) {
+      ctx.inputEl.value = ctx.inputEl.value.replace(/@\S*$/, "");
+      ctx.inputEl.focus();
+    }
+  });
+
   menuEl.querySelectorAll(".mention-item").forEach(function (el) {
     el.addEventListener("click", function (e) {
       e.preventDefault();
@@ -215,10 +232,11 @@ function showInputMentionChip(name, color, avatarSrc) {
     '<button class="input-mention-chip-remove" type="button" aria-label="Remove mention">&times;</button>';
   chip.style.setProperty("--chip-color", color);
 
-  // Insert before the textarea inside input-row
+  // Insert before the textarea wrapper inside input-row
   var inputRow = document.getElementById("input-row");
-  if (inputRow && ctx.inputEl) {
-    inputRow.insertBefore(chip, ctx.inputEl);
+  var textareaWrap = document.getElementById("input-textarea-wrap");
+  if (inputRow && textareaWrap) {
+    inputRow.insertBefore(chip, textareaWrap);
   }
 
   chip.querySelector(".input-mention-chip-remove").addEventListener("click", function (e) {
@@ -713,7 +731,7 @@ export function renderMentionUser(entry) {
     '<span class="msg-action-time">' + ts2 + '</span>' +
     '<button class="msg-action-btn msg-action-copy" type="button" title="Copy">' + iconHtml("copy") + '</button>' +
     '<button class="msg-action-btn msg-action-fork" type="button" title="Fork">' + iconHtml("git-branch") + '</button>' +
-    '<button class="msg-action-btn msg-action-rewind msg-user-rewind-btn" type="button" title="Rewind">' + iconHtml("rotate-ccw") + '</button>' +
+    (((store.get('vendorCapabilities') || {}).rewind !== false) ? '<button class="msg-action-btn msg-action-rewind msg-user-rewind-btn" type="button" title="Rewind">' + iconHtml("rotate-ccw") + '</button>' : '') +
     '<button class="msg-action-btn msg-action-hidden msg-action-edit" type="button" title="Edit">' + iconHtml("pencil") + '</button>';
   div.appendChild(actions);
 

package/lib/public/modules/scheduler.js

@@ -790,7 +790,7 @@ function renderModelTab(bodyEl, rec) {
   }
 
   var opts = {
-    models: store.getState().currentModels || [],
+    models: store.get('currentModels') || [],
     currentModel: settings.model || "",
     currentMode: settings.permissionMode || "default",
     currentEffort: settings.effort || "medium",

package/lib/public/modules/sidebar-mates.js

@@ -5,8 +5,18 @@ import { userAvatarUrl, mateAvatarUrl } from './avatar.js';
 import { escapeHtml } from './utils.js';
 import { iconHtml, refreshIcons } from './icons.js';
 import { showMateProfilePopover } from './profile.js';
-
-var _ctx = null;
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { closeProjectCtxMenu } from './sidebar-projects.js';
+import { spawnDustParticles } from './sidebar.js';
+import { openDm } from './app-dm.js';
+import { openMateWizard } from './mate-wizard.js';
+import { getCachedProjects } from './app-projects.js';
+
+function sendWs(msg) {
+  var ws = getWs();
+  if (ws && ws.readyState === 1) ws.send(JSON.stringify(msg));
+}
 
 // --- User strip state ---
 var cachedAllUsers = [];
@@ -19,6 +29,16 @@ var currentDmUserId = null;
 var dmPickerOpen = false;
 var cachedDmRemovedUsers = {};
 var cachedMates = [];
+var activeMentionMateIds = {};
+
+export function setMentionActive(mateId, active) {
+  if (active) { activeMentionMateIds[mateId] = true; }
+  else { delete activeMentionMateIds[mateId]; }
+}
+
+export function clearAllMentionActive() {
+  activeMentionMateIds = {};
+}
 var _lastUserStripJson = "";
 
 // --- Icon strip tooltip ---
@@ -27,8 +47,20 @@ var iconStripTooltip = null;
 // --- DM user context menu ---
 var userCtxMenu = null;
 
-export function initSidebarMates(ctx) {
-  _ctx = ctx;
+export function initSidebarMates() {
+  // --- Reactive UI sync for user strip ---
+  store.subscribe(function (state, prev) {
+    if (state.cachedAllUsers !== prev.cachedAllUsers ||
+        state.cachedOnlineIds !== prev.cachedOnlineIds ||
+        state.cachedDmFavorites !== prev.cachedDmFavorites ||
+        state.cachedDmConversations !== prev.cachedDmConversations ||
+        state.dmUnread !== prev.dmUnread ||
+        state.dmRemovedUsers !== prev.dmRemovedUsers ||
+        state.cachedMatesList !== prev.cachedMatesList ||
+        state.myUserId !== prev.myUserId) {
+      renderUserStrip();
+    }
+  });
 }
 
 export function showIconTooltip(el, text) {
@@ -80,7 +112,7 @@ export function closeUserCtxMenu() {
 
 function showUserCtxMenu(anchorEl, user) {
   closeUserCtxMenu();
-  if (_ctx.closeProjectCtxMenu) _ctx.closeProjectCtxMenu();
+  if (closeProjectCtxMenu) closeProjectCtxMenu();
 
   var menu = document.createElement("div");
   menu.className = "project-ctx-menu";
@@ -92,16 +124,14 @@ function showUserCtxMenu(anchorEl, user) {
     e.stopPropagation();
     // Spawn dust particles at the user icon position
     var iconRect = anchorEl.getBoundingClientRect();
-    if (_ctx.spawnDustParticles) _ctx.spawnDustParticles(iconRect.left + iconRect.width / 2, iconRect.top + iconRect.height / 2);
+    if (spawnDustParticles) spawnDustParticles(iconRect.left + iconRect.width / 2, iconRect.top + iconRect.height / 2);
     closeUserCtxMenu();
     // Immediately mark as removed so strip re-render hides the icon,
     // even if the user was only visible via cachedDmConversations (not favorites)
     cachedDmRemovedUsers[user.id] = true;
-    if (_ctx.onDmRemoveUser) _ctx.onDmRemoveUser(user.id);
-    renderUserStrip(cachedAllUsers, cachedOnlineUserIds, cachedMyUserId, cachedDmFavorites, cachedDmConversations, cachedDmUnread, cachedDmRemovedUsers, cachedMates);
-    if (_ctx.sendWs) {
-      _ctx.sendWs({ type: "dm_remove_favorite", targetUserId: user.id });
-    }
+    var dr = Object.assign({}, store.get('dmRemovedUsers')); dr[user.id] = true; store.set({ dmRemovedUsers: dr });
+    // renderUserStrip is handled by the store subscriber
+    sendWs({ type: "dm_remove_favorite", targetUserId: user.id });
   });
   menu.appendChild(removeItem);
 
@@ -140,7 +170,7 @@ function showMateCtxMenu(anchorEl, mate) {
   if (mate.primary) return;
 
   closeUserCtxMenu();
-  if (_ctx.closeProjectCtxMenu) _ctx.closeProjectCtxMenu();
+  if (closeProjectCtxMenu) closeProjectCtxMenu();
 
   var menu = document.createElement("div");
   menu.className = "project-ctx-menu";
@@ -153,9 +183,7 @@ function showMateCtxMenu(anchorEl, mate) {
     e.stopPropagation();
     closeUserCtxMenu();
     showMateProfilePopover(anchorEl, mate, function (updates) {
-      if (_ctx.sendWs) {
-        _ctx.sendWs({ type: "mate_update", mateId: mate.id, updates: updates });
-      }
+      sendWs({ type: "mate_update", mateId: mate.id, updates: updates });
     });
   });
   menu.appendChild(editItem);
@@ -168,10 +196,8 @@ function showMateCtxMenu(anchorEl, mate) {
     closeUserCtxMenu();
     // Spawn dust particles at the mate icon position
     var iconRect = anchorEl.getBoundingClientRect();
-    if (_ctx.spawnDustParticles) _ctx.spawnDustParticles(iconRect.left + iconRect.width / 2, iconRect.top + iconRect.height / 2);
-    if (_ctx.sendWs) {
-      _ctx.sendWs({ type: "dm_remove_favorite", targetUserId: mate.id });
-    }
+    if (spawnDustParticles) spawnDustParticles(iconRect.left + iconRect.width / 2, iconRect.top + iconRect.height / 2);
+    sendWs({ type: "dm_remove_favorite", targetUserId: mate.id });
   });
   menu.appendChild(removeItem);
 
@@ -238,7 +264,20 @@ function presenceAvatarUrl(userOrStyle) {
   return userAvatarUrl({ avatarStyle: userOrStyle || "thumbs" }, 24);
 }
 
+// renderUserStrip: call with no args to read from store (subscriber pattern),
+// or with all 8 args for legacy compatibility.
 export function renderUserStrip(allUsers, onlineUserIds, myUserId, dmFavorites, dmConversations, dmUnread, dmRemovedUsers, matesList) {
+  if (arguments.length === 0) {
+    var s = store.snap();
+    allUsers = s.cachedAllUsers;
+    onlineUserIds = s.cachedOnlineIds;
+    myUserId = s.myUserId;
+    dmFavorites = s.cachedDmFavorites;
+    dmConversations = s.cachedDmConversations;
+    dmUnread = s.dmUnread;
+    dmRemovedUsers = s.dmRemovedUsers;
+    matesList = s.cachedMatesList;
+  }
   // Skip full DOM rebuild if input data hasn't changed
   var fingerprint = JSON.stringify([allUsers, onlineUserIds, dmFavorites, dmConversations, dmUnread, dmRemovedUsers, matesList]);
   if (fingerprint === _lastUserStripJson) return;
@@ -311,7 +350,7 @@ export function renderUserStrip(allUsers, onlineUserIds, myUserId, dmFavorites,
 
       // Click: open DM
       el.addEventListener("click", function () {
-        if (_ctx.openDm) _ctx.openDm(u.id);
+        if (openDm) openDm(u.id);
       });
 
       // Right-click: show context menu
@@ -327,8 +366,9 @@ export function renderUserStrip(allUsers, onlineUserIds, myUserId, dmFavorites,
 
   // Build mate project status lookup from project list
   var mateProjectStatus = {};
-  if (_ctx && _ctx.projectList) {
-    var allProjects = _ctx.projectList;
+  var _projList = getCachedProjects() || [];
+  if (_projList.length) {
+    var allProjects = _projList;
     for (var pi = 0; pi < allProjects.length; pi++) {
       if (allProjects[pi].isMate) {
         mateProjectStatus[allProjects[pi].slug] = allProjects[pi];
@@ -380,10 +420,12 @@ export function renderUserStrip(allUsers, onlineUserIds, myUserId, dmFavorites,
       avatar.style.background = mateColor + "30";
       el.appendChild(avatar);
 
-      // Processing status dot (IO blink)
+      // Processing status dot (IO blink) - top-left
       var statusDot = document.createElement("span");
       statusDot.className = "icon-strip-status";
-      if (mateProj.isProcessing) statusDot.classList.add("processing");
+      var isMentionActive = !!activeMentionMateIds[mate.id];
+      if (mateProj.isProcessing || isMentionActive) statusDot.classList.add("processing");
+      if (isMentionActive) el.classList.add("mention-active");
       el.appendChild(statusDot);
 
       // Mate badge (bot icon)
@@ -406,6 +448,8 @@ export function renderUserStrip(allUsers, onlineUserIds, myUserId, dmFavorites,
 
       // Tooltip
       var displayName = mp.displayName || mate.name || "New Mate";
+      var mateVendor = mate.vendor || "claude";
+      var vendorLabels = { claude: "Claude Code", codex: "OpenAI Codex" };
       el.addEventListener("mouseenter", function () {
         var html = '<div style="font-weight:600">' + escapeHtml(displayName);
         if (mate.primary) {
@@ -415,13 +459,15 @@ export function renderUserStrip(allUsers, onlineUserIds, myUserId, dmFavorites,
         if (mate.bio) {
           html += '<div style="font-weight:400;font-size:12px;color:var(--text-secondary);margin-top:2px">' + escapeHtml(mate.bio) + '</div>';
         }
+        var vendorLabel = vendorLabels[mateVendor] || mateVendor;
+        html += '<div style="font-size:11px;color:var(--text-dimmer);margin-top:3px">Powered by ' + escapeHtml(vendorLabel) + '</div>';
         showIconTooltipHtml(el, html);
       });
       el.addEventListener("mouseleave", hideIconTooltip);
 
       // Click: open DM with mate
       el.addEventListener("click", function () {
-        if (_ctx.openDm) _ctx.openDm(mate.id);
+        if (openDm) openDm(mate.id);
       });
 
       // Right-click: context menu for mate
@@ -520,9 +566,7 @@ function toggleDmUserPicker(anchorEl) {
         item.appendChild(name);
 
         item.addEventListener("click", function () {
-          if (_ctx.sendWs) {
-            _ctx.sendWs({ type: "dm_add_favorite", targetUserId: u.id });
-          }
+          sendWs({ type: "dm_add_favorite", targetUserId: u.id });
           closeDmUserPicker();
         });
 
@@ -570,7 +614,7 @@ function toggleDmUserPicker(anchorEl) {
       });
     }
     // Build unified list: installed builtins, deleted builtins, user-created
-    var availBuiltins = (_ctx.availableBuiltins && _ctx.availableBuiltins()) || [];
+    var availBuiltins = store.get('cachedAvailableBuiltins') || [];
     var entries = [];
     // 1. Installed builtin mates
     for (var si = 0; si < allMates.length; si++) {
@@ -619,12 +663,12 @@ function toggleDmUserPicker(anchorEl) {
           bAddBtn.title = "Re-add " + b.displayName;
           bAddBtn.addEventListener("click", function (e) {
             e.stopPropagation();
-            if (_ctx.sendWs) _ctx.sendWs({ type: "mate_readd_builtin", builtinKey: b.key });
+            sendWs({ type: "mate_readd_builtin", builtinKey: b.key });
             closeDmUserPicker();
           });
           bItem.appendChild(bAddBtn);
           bItem.addEventListener("click", function () {
-            if (_ctx.sendWs) _ctx.sendWs({ type: "mate_readd_builtin", builtinKey: b.key });
+            sendWs({ type: "mate_readd_builtin", builtinKey: b.key });
             closeDmUserPicker();
           });
           matesListEl.appendChild(bItem);
@@ -675,7 +719,7 @@ function toggleDmUserPicker(anchorEl) {
             yesBtn.textContent = m.builtinKey ? "Remove" : "Delete";
             yesBtn.addEventListener("click", function (e2) {
               e2.stopPropagation();
-              if (_ctx.sendWs) _ctx.sendWs({ type: "mate_delete", mateId: m.id });
+              sendWs({ type: "mate_delete", mateId: m.id });
               closeDmUserPicker();
             });
             item.appendChild(yesBtn);
@@ -693,8 +737,8 @@ function toggleDmUserPicker(anchorEl) {
           });
           item.appendChild(delBtn);
           item.addEventListener("click", function () {
-            if (_ctx.openDm) _ctx.openDm(m.id);
-            if (!isFav && _ctx.sendWs) _ctx.sendWs({ type: "dm_add_favorite", targetUserId: m.id });
+            if (openDm) openDm(m.id);
+            if (!isFav) sendWs({ type: "dm_add_favorite", targetUserId: m.id });
             closeDmUserPicker();
           });
           matesListEl.appendChild(item);
@@ -720,7 +764,7 @@ function toggleDmUserPicker(anchorEl) {
   createMateEl.innerHTML = iconHtml("bot") + " <span>" + createMateLabel + "</span>";
   createMateEl.addEventListener("click", function () {
     closeDmUserPicker();
-    if (_ctx.openMateWizard) _ctx.openMateWizard();
+    if (openMateWizard) openMateWizard();
   });
   picker.appendChild(createMateEl);
 

package/lib/public/modules/sidebar-mobile.js

@@ -26,7 +26,15 @@ import {
   getCachedDmRemovedUsers
 } from './sidebar-mates.js';
 
-var _ctx = null;
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { dismissOverlayPanels, closeSidebar } from './sidebar.js';
+import { switchProject, getCachedProjects } from './app-projects.js';
+import { openDm } from './app-dm.js';
+import { showHomeHub } from './app-home-hub.js';
+import { openTerminal } from './terminal.js';
+import { requestKnowledgeList } from './mate-knowledge.js';
+import { loadRootDirectory } from './filebrowser.js';
 
 // --- Mobile state ---
 var mobileChatSheetOpen = false;
@@ -76,7 +84,7 @@ export function openMobileSheet(type) {
       listEl.appendChild(fileTree);
       fileTree.classList.remove("hidden");
     }
-    if (_ctx.onFilesTabOpen) _ctx.onFilesTabOpen();
+    loadRootDirectory();
   } else if (type === "mate-knowledge") {
     titleEl.textContent = "Knowledge";
     sheet.classList.add("sheet-knowledge");
@@ -86,7 +94,7 @@ export function openMobileSheet(type) {
       knowledgeFiles.classList.remove("hidden");
     }
     // Request knowledge list if not loaded
-    if (_ctx.requestKnowledgeList) _ctx.requestKnowledgeList();
+    requestKnowledgeList();
   } else if (type === "mate-profile") {
     titleEl.textContent = "";
     renderSheetMateProfile(listEl);
@@ -170,7 +178,7 @@ function renderSheetProjects(listEl) {
       }
 
       el.addEventListener("click", function () {
-        if (_ctx.switchProject) _ctx.switchProject(p.slug);
+        if (switchProject) switchProject(p.slug);
         closeMobileSheet();
       });
 
@@ -270,7 +278,7 @@ function renderSheetSessions(listEl) {
       // Processing dot: same class as icon strip, same data source
       var mateSlug = "mate-" + mate.id;
       var mateProj = null;
-      var allProjects = (_ctx && _ctx.projectList) || [];
+      var allProjects = getCachedProjects() || [];
       for (var pi = 0; pi < allProjects.length; pi++) {
         if (allProjects[pi].slug === mateSlug) { mateProj = allProjects[pi]; break; }
       }
@@ -309,7 +317,7 @@ function renderSheetSessions(listEl) {
       renderMobileSessionsInto(sessionListEl);
     } else if (type === "mate") {
       // Mate DM: open the DM and show mate actions
-      if (_ctx.openDm) _ctx.openDm(mateId);
+      openDm(mateId);
       renderMateMobileActions(sessionListEl);
     }
 
@@ -339,7 +347,7 @@ function renderSheetSessions(listEl) {
               loading.textContent = "Loading sessions...";
               sessionListEl.appendChild(loading);
             }
-            if (_ctx.switchProject) _ctx.switchProject(slug);
+            if (switchProject) switchProject(slug);
             if (!isDmNow || slug !== getCachedCurrentSlug()) {
               // renderSessionList will be called by WS, which calls refreshMobileChatSheet
             } else {
@@ -394,10 +402,10 @@ function createMobileSessionItem(s) {
 
   (function (id) {
     el.addEventListener("click", function () {
-      if (_ctx.ws && _ctx.connected) {
-        _ctx.ws.send(JSON.stringify({ type: "switch_session", id: id }));
+      if (getWs() && store.get('connected')) {
+        getWs().send(JSON.stringify({ type: "switch_session", id: id }));
       }
-      if (_ctx.dismissOverlayPanels) _ctx.dismissOverlayPanels();
+      if (dismissOverlayPanels) dismissOverlayPanels();
       closeMobileSheet();
     });
   })(s.id);
@@ -432,10 +440,10 @@ function createMobileLoopChild(s) {
 
   (function (id) {
     el.addEventListener("click", function () {
-      if (_ctx.ws && _ctx.connected) {
-        _ctx.ws.send(JSON.stringify({ type: "switch_session", id: id }));
+      if (getWs() && store.get('connected')) {
+        getWs().send(JSON.stringify({ type: "switch_session", id: id }));
       }
-      if (_ctx.dismissOverlayPanels) _ctx.dismissOverlayPanels();
+      if (dismissOverlayPanels) dismissOverlayPanels();
       closeMobileSheet();
     });
   })(s.id);
@@ -645,8 +653,8 @@ function renderMateMobileActions(container) {
   newSessionBtn.className = "mobile-session-new";
   newSessionBtn.innerHTML = '<i data-lucide="plus" style="width:16px;height:16px"></i> New session';
   newSessionBtn.addEventListener("click", function () {
-    if (_ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({ type: "new_session" }));
+    if (getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "new_session" }));
     }
     closeMobileSheet();
   });
@@ -694,8 +702,8 @@ function renderMobileSessionsInto(container) {
   newBtn.className = "mobile-session-new";
   newBtn.innerHTML = '<i data-lucide="plus" style="width:16px;height:16px"></i> New session';
   newBtn.addEventListener("click", function () {
-    if (_ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({ type: "new_session" }));
+    if (getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "new_session" }));
     }
     closeMobileSheet();
   });
@@ -801,7 +809,7 @@ export function refreshMobileChatSheet() {
     var statusDot = chip.querySelector(".icon-strip-status");
     if (statusDot) {
       var isProcessing = false;
-      var allProjects = (_ctx && _ctx.projectList) || [];
+      var allProjects = getCachedProjects() || [];
       var lookupSlug = chip.dataset.type === "mate" ? ("mate-" + chip.dataset.mateId) : chip.dataset.slug;
       for (var pi = 0; pi < allProjects.length; pi++) {
         if (allProjects[pi].slug === lookupSlug && allProjects[pi].isProcessing) {
@@ -948,10 +956,10 @@ function renderSearchResults(container, query) {
 
     (function (id) {
       el.addEventListener("click", function () {
-        if (_ctx.ws && _ctx.connected) {
-          _ctx.ws.send(JSON.stringify({ type: "switch_session", id: id }));
+        if (getWs() && store.get('connected')) {
+          getWs().send(JSON.stringify({ type: "switch_session", id: id }));
         }
-        if (_ctx.dismissOverlayPanels) _ctx.dismissOverlayPanels();
+        if (dismissOverlayPanels) dismissOverlayPanels();
         closeMobileSheet();
       });
     })(s.id);
@@ -993,7 +1001,7 @@ function renderSheetTools(listEl) {
         if (item.action === "files") {
           setTimeout(function () { openMobileSheet("files"); }, 250);
         } else if (item.action === "terminal") {
-          if (_ctx.openTerminal) _ctx.openTerminal();
+          openTerminal();
         } else if (item.action === "scheduler") {
           targetId = "scheduler-btn";
         } else if (item.action === "mate-knowledge") {
@@ -1055,7 +1063,7 @@ function renderSheetSettings(listEl) {
                 }
               }
             }
-            if (proj && _ctx.ownerLocked) proj = Object.assign({}, proj, { ownerLocked: true });
+            if (proj && store.get('ownerLocked')) proj = Object.assign({}, proj, { ownerLocked: true });
             openProjectSettings(getCachedCurrentSlug(), proj);
           }, 250);
         } else if (item.action === "server-settings") {
@@ -1124,11 +1132,7 @@ function renderSheetSettings(listEl) {
   }
 }
 
-export function initSidebarMobile(ctx) {
-  _ctx = ctx;
-
-  // Put refreshMobileChatSheet on ctx for external callers
-  ctx.refreshMobileChatSheet = refreshMobileChatSheet;
+export function initSidebarMobile() {
 
   // --- Mobile sheet close handlers ---
   var mobileSheet = document.getElementById("mobile-sheet");
@@ -1262,9 +1266,9 @@ export function initSidebarMobile(ctx) {
 
   if (mobileHomeBtn) {
     mobileHomeBtn.addEventListener("click", function () {
-      if (_ctx.closeSidebar) _ctx.closeSidebar();
+      closeSidebar();
       setMobileTabActive("home");
-      if (_ctx.showHomeHub) _ctx.showHomeHub();
+      showHomeHub();
     });
   }
 }