clay-server 5.0.0-beta.2 → 5.0.0-beta.3

package/lib/public/modules/sidebar.js

@@ -65,6 +65,15 @@ export function closeSidebar() {
 export function initSidebar(_ctx) {
   ctx = _ctx;
 
+  // Suppress native menus across the sidebar, including its empty space,
+  // while allowing the target's Clay context-menu handlers to run.
+  ["icon-strip", "sidebar-column", "mate-sidebar-column", "user-island"].forEach(function (id) {
+    var region = document.getElementById(id);
+    if (region) region.addEventListener("contextmenu", function (event) {
+      event.preventDefault();
+    }, true);
+  });
+
   // Initialize sidebar sub-modules (they import their own deps directly)
   initSidebarSessions();
   initSidebarProjects();
@@ -191,8 +200,7 @@ export function initSidebar(_ctx) {
 
   if (fileBrowserBtn) {
     // Clicking the tile toggles: open if closed, close (back to sessions)
-    // if it's already the visible panel. Same behavior via the Cmd+O
-    // hotkey since that calls .click().
+    // if it's already the visible panel.
     fileBrowserBtn.addEventListener("click", function () {
       if (filesPanel && !filesPanel.classList.contains("hidden")) {
         hideFilesPanel(function () { showSessionsPanel(); });

package/lib/public/modules/terminal.js

@@ -165,8 +165,8 @@ export function initTerminal(_ctx) {
     });
   }
 
-  // Sidebar terminal button — toggles open/close. Second click (or the
-  // Cmd+O hotkey on the same tile) dismisses the terminal panel.
+  // Sidebar terminal button — toggles open/close. Second click dismisses
+  // the terminal panel.
   var sidebarTermBtn = document.getElementById("terminal-sidebar-btn");
   if (sidebarTermBtn) {
     sidebarTermBtn.addEventListener("click", function () {

package/lib/public/modules/tool-palette.js

@@ -1,26 +1,21 @@
-// tool-palette.js — Customizable sidebar tool palette
+// tool-palette.js — Sidebar tool palette
 //
-// Renders the per-session and per-mate tool grids from a data registry,
-// so users can reorder tools and hide ones they don't use. Preserves the
-// original button IDs so existing click handlers (attached by sidebar.js,
-// terminal.js, mcp-ui.js, etc.) keep working on the rendered nodes.
+// Renders the per-session and per-mate tool grids from a data registry and
+// lets users reorder them. Preserves the original button IDs so existing
+// click handlers (attached by sidebar.js, terminal.js, mcp-ui.js, etc.) keep
+// working on the rendered nodes.
 //
-// Design notes (see issue #325 for the broader context):
-// - Buttons are created once on init and never destroyed; hide/reorder
-//   moves existing DOM nodes, so event listeners bound elsewhere survive.
-// - Edit mode is a state on the palette container (class="edit-mode").
-//   CSS shows the × remove affordance and enables drag reordering.
-// - Preferences persist per-user via the /api/user/tool-palettes endpoint.
-//   An in-flight save is debounced so rapid drag reorders don't spam.
+// Design notes:
+// - Buttons are created once on init and never destroyed; reorder moves
+//   existing DOM nodes, so event listeners bound elsewhere survive.
+// - Tools can no longer be hidden or added back. A tool a saved preference
+//   marks hidden is simply shown, appended after the ordered tools, and the
+//   stored preference is not rewritten on load.
+// - Order persists per-user via the /api/user/tool-palettes endpoint. An
+//   in-flight save is debounced so rapid drag reorders don't spam.
 
 import { refreshIcons } from './icons.js';
 import { PALETTES, normalizeToolPreferences } from './tool-palette-order.js';
-import {
-  enterToolPickMode,
-  exitToolPickMode,
-  isToolPickActive,
-  openPaletteContextMenu
-} from './tool-palette-overlays.js';
 
 var _saveTimers = {};
 var _draggingEl = null;
@@ -31,35 +26,6 @@ export function initToolPalettes() {
     buildPalette(name);
   }
 
-  // Edit pills toggle edit mode on their associated palette.
-  var editBtns = document.querySelectorAll('.tool-palette-edit-btn');
-  for (var i = 0; i < editBtns.length; i++) {
-    (function (btn) {
-      btn.addEventListener('click', function () {
-        toggleEditMode(btn.dataset.palette);
-      });
-    })(editBtns[i]);
-  }
-
-  // Keyboard-hotkey hint pill. Matches the icon-strip shortcut pills
-  // in shape — just the chord, no prose. Clicking the pill opens the
-  // hotkey overlay, same as pressing the shortcut.
-  var isMac = /Mac|iPhone|iPod|iPad/i.test(navigator.platform);
-  var hintLabel = isMac ? '\u2318O' : 'Ctrl+O';
-  var hints = document.querySelectorAll('.sidebar-tools-hint');
-  for (var h = 0; h < hints.length; h++) {
-    hints[h].textContent = hintLabel;
-    hints[h].title = 'Show keyboard hotkeys (' + hintLabel + ')';
-    hints[h].addEventListener('click', function (e) {
-      // Stop the click from bubbling to the document-level dismiss
-      // handler below, which would immediately tear down the pick-mode
-      // we just entered.
-      e.stopPropagation();
-      if (isToolPickActive()) exitToolPickMode();
-      else enterToolPickMode();
-    });
-  }
-
   // Load saved preferences and apply to both palettes once buttons exist.
   loadPreferences();
 
@@ -76,22 +42,8 @@ function buildPalette(name) {
     active.appendChild(buildToolButton(palette.tools[i], name));
   }
 
-  // Scaffold the hidden section (its grid fills in when items are hidden).
-  var hiddenSection = document.getElementById(palette.hiddenSectionId);
-  if (hiddenSection) {
-    hiddenSection.innerHTML = '';
-    var labelEl = document.createElement('div');
-    labelEl.className = 'tool-palette-hidden-label';
-    labelEl.textContent = 'Add back';
-    var gridEl = document.createElement('div');
-    gridEl.className = 'tool-palette-hidden-grid';
-    hiddenSection.appendChild(labelEl);
-    hiddenSection.appendChild(gridEl);
-  }
-
-  // Drag-reorder within the active container. Works in both normal and
-  // edit mode so users can rearrange without entering a separate mode
-  // (matches the macOS dock pattern). HTML5 drag has a small movement
+  // Drag-reorder within the active container. Users can rearrange in
+  // place (matches the macOS dock pattern). HTML5 drag has a small movement
   // threshold, so quick clicks still activate the tool normally.
   active.addEventListener('dragover', function (e) {
     if (_draggingPaletteName !== name || !_draggingEl) return;
@@ -121,9 +73,7 @@ function buildToolButton(tool, paletteName) {
   btn.setAttribute('aria-label', tool.label);
   btn.dataset.toolId = tool.id;
   btn.dataset.palette = paletteName;
-  // Draggable at all times so users can reorder without entering edit
-  // mode. Drag is gated to the active grid in the handlers below; tiles
-  // in the hidden grid get draggable=false set on move.
+  // Draggable at all times so users can reorder in place.
   btn.draggable = true;
 
   var icon = document.createElement('i');
@@ -142,61 +92,8 @@ function buildToolButton(tool, paletteName) {
     btn.appendChild(count);
   }
 
-  // × affordance — shown only in edit mode via CSS.
-  var remove = document.createElement('span');
-  remove.className = 'tool-palette-remove';
-  remove.setAttribute('role', 'button');
-  remove.setAttribute('aria-label', 'Remove ' + tool.label + ' from palette');
-  remove.textContent = '\u00D7';
-  btn.appendChild(remove);
-
-  // Click interceptor, registered before any other module attaches to
-  // the button by ID. stopImmediatePropagation prevents the tool's own
-  // handler from running in three cases: clicking the × in edit mode,
-  // clicking a tile in the hidden-grid (which should restore it), and
-  // clicking any tile while edit mode is active (tiles are inert then).
-  btn.addEventListener('click', function (e) {
-    if (e.target.closest('.tool-palette-remove')) {
-      e.preventDefault();
-      e.stopImmediatePropagation();
-      moveToHidden(paletteName, tool.id);
-      return;
-    }
-    var container = btn.parentNode;
-    if (!container) return;
-    if (container.classList.contains('tool-palette-hidden-grid')) {
-      e.preventDefault();
-      e.stopImmediatePropagation();
-      moveToActive(paletteName, tool.id);
-      return;
-    }
-    if (container.classList.contains('edit-mode')) {
-      e.preventDefault();
-      e.stopImmediatePropagation();
-    }
-  });
-
-  btn.addEventListener('contextmenu', function (e) {
-    e.preventDefault();
-    e.stopPropagation();
-    var container = btn.parentNode;
-    var inHidden = container && container.classList.contains('tool-palette-hidden-grid');
-    openPaletteContextMenu(e.clientX, e.clientY, inHidden ? [
-      { label: 'Add back to palette', action: function () { moveToActive(paletteName, tool.id); } },
-    ] : [
-      { label: 'Remove from palette', action: function () { moveToHidden(paletteName, tool.id); } },
-      { label: 'Edit palette\u2026', action: function () {
-          if (!document.getElementById(PALETTES[paletteName].activeContainerId).classList.contains('edit-mode')) {
-            toggleEditMode(paletteName);
-          }
-        } },
-    ]);
-  });
-
   btn.addEventListener('dragstart', function (e) {
     var container = btn.parentNode;
-    // Only allow drag from the active grid; hidden tiles are added back
-    // via click, not drag.
     if (!container || container.id !== PALETTES[paletteName].activeContainerId) {
       e.preventDefault();
       return;
@@ -218,60 +115,6 @@ function buildToolButton(tool, paletteName) {
   return btn;
 }
 
-function toggleEditMode(name) {
-  var palette = PALETTES[name];
-  if (!palette) return;
-  var active = document.getElementById(palette.activeContainerId);
-  var hidden = document.getElementById(palette.hiddenSectionId);
-  var editBtn = document.querySelector('.tool-palette-edit-btn[data-palette="' + name + '"]');
-  if (!active || !editBtn) return;
-
-  var entering = !active.classList.contains('edit-mode');
-  active.classList.toggle('edit-mode', entering);
-  if (hidden) {
-    // Show hidden-section in edit mode if any items exist there (or to
-    // allow adding back even when empty, keep visible so the state is
-    // legible). We show whenever edit mode is on.
-    hidden.classList.toggle('hidden', !entering);
-  }
-  // Pencil icon stays; the .active class provides visual feedback by
-  // swapping to the accent background. No label text swap needed now.
-  editBtn.classList.toggle('active', entering);
-
-  if (!entering) queueSave(name);
-}
-
-function moveToHidden(name, toolId) {
-  var palette = PALETTES[name];
-  if (!palette) return;
-  var btn = document.getElementById(toolId);
-  var hiddenSection = document.getElementById(palette.hiddenSectionId);
-  if (!btn || !hiddenSection) return;
-  var grid = hiddenSection.querySelector('.tool-palette-hidden-grid');
-  if (!grid) return;
-  // Hidden tiles stay draggable=false so users don't drag them around
-  // before adding them back. The active-grid dragstart gate also
-  // enforces this.
-  btn.draggable = false;
-  grid.appendChild(btn);
-  queueSave(name);
-}
-
-function moveToActive(name, toolId) {
-  var palette = PALETTES[name];
-  if (!palette) return;
-  var btn = document.getElementById(toolId);
-  var active = document.getElementById(palette.activeContainerId);
-  if (!btn || !active) return;
-  active.appendChild(btn);
-  btn.draggable = true;
-  queueSave(name);
-}
-
-// (Hidden-tile clicks are handled in each button's own click listener,
-// attached in buildToolButton before any external module attaches
-// handlers by ID. See the stopImmediatePropagation logic there.)
-
 function getDragAfterElement(container, x, y) {
   var tiles = Array.prototype.slice.call(
     container.querySelectorAll('[data-tool-id]:not(.dragging)')
@@ -314,50 +157,32 @@ function applyPreferences(name, prefs) {
   var palette = PALETTES[name];
   if (!palette) return;
   var active = document.getElementById(palette.activeContainerId);
-  var hiddenSection = document.getElementById(palette.hiddenSectionId);
-  var hiddenGrid = hiddenSection ? hiddenSection.querySelector('.tool-palette-hidden-grid') : null;
-  if (!active || !hiddenGrid) return;
+  if (!active) return;
 
   var normalized = normalizeToolPreferences(name, prefs);
-
-  var hiddenSet = {};
-  var hiddenList = normalized.hidden;
-  for (var i = 0; i < hiddenList.length; i++) hiddenSet[hiddenList[i]] = true;
-
-  var orderList = normalized.order;
-  // Any tools not in the stored order are appended in registry order so
-  // newly-added tools surface automatically for existing users. This is how
-  // a restored tool reaches a saved palette that predates it: no rewrite, no
-  // server state, just the normal new-registry append.
   var placed = {};
-  for (var j = 0; j < orderList.length; j++) {
-    var id = orderList[j];
-    if (hiddenSet[id]) continue;
+  function place(id) {
+    if (placed[id]) return;
     var btn = document.getElementById(id);
-    if (btn) {
-      active.appendChild(btn);
-      placed[id] = true;
-    }
+    if (!btn) return;
+    active.appendChild(btn);
+    placed[id] = true;
   }
-  for (var k = 0; k < palette.tools.length; k++) {
-    var tid = palette.tools[k].id;
-    if (placed[tid] || hiddenSet[tid]) continue;
-    var tbtn = document.getElementById(tid);
-    if (tbtn) active.appendChild(tbtn);
+
+  // Saved order first, then tools the saved list predates in registry order,
+  // then tools an older client had hidden. Hiding is no longer offered, so
+  // those tools surface at the end instead of staying unreachable. Nothing
+  // is written back here; the stored preference only changes on a reorder.
+  var hiddenSet = {};
+  for (var i = 0; i < normalized.hidden.length; i++) hiddenSet[normalized.hidden[i]] = true;
+  for (var j = 0; j < normalized.order.length; j++) {
+    if (!hiddenSet[normalized.order[j]]) place(normalized.order[j]);
   }
-  for (var h = 0; h < hiddenList.length; h++) {
-    var hbtn = document.getElementById(hiddenList[h]);
-    if (hbtn) {
-      hbtn.draggable = false;
-      hiddenGrid.appendChild(hbtn);
-    }
+  for (var k = 0; k < palette.tools.length; k++) {
+    if (!hiddenSet[palette.tools[k].id]) place(palette.tools[k].id);
   }
-
-  // Write the rewritten preference back once, through the normal save path, so
-  // the migration survives reloads and reaches the user's other devices. The
-  // save reads the DOM this function just arranged, so it records exactly what
-  // is on screen.
-  if (normalized.migrated) queueSave(name);
+  for (var h = 0; h < normalized.hidden.length; h++) place(normalized.hidden[h]);
+  for (var m = 0; m < palette.tools.length; m++) place(palette.tools[m].id);
 }
 
 function queueSave(name) {
@@ -372,24 +197,17 @@ function savePreferences(name) {
   var palette = PALETTES[name];
   if (!palette) return;
   var active = document.getElementById(palette.activeContainerId);
-  var hiddenSection = document.getElementById(palette.hiddenSectionId);
-  var hiddenGrid = hiddenSection ? hiddenSection.querySelector('.tool-palette-hidden-grid') : null;
   if (!active) return;
 
   var order = [];
   var activeTiles = active.querySelectorAll('[data-tool-id]');
   for (var i = 0; i < activeTiles.length; i++) order.push(activeTiles[i].dataset.toolId);
 
-  var hidden = [];
-  if (hiddenGrid) {
-    var hiddenTiles = hiddenGrid.querySelectorAll('[data-tool-id]');
-    for (var j = 0; j < hiddenTiles.length; j++) hidden.push(hiddenTiles[j].dataset.toolId);
-  }
-
+  // Every tool is visible, so the explicit order is the whole preference.
   fetch('/api/user/tool-palettes', {
     method: 'PUT',
     credentials: 'same-origin',
     headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify({ palette: name, order: order, hidden: hidden }),
+    body: JSON.stringify({ palette: name, order: order, hidden: [] }),
   }).catch(function () { /* save best-effort */ });
 }

package/lib/public/style.css

@@ -12,6 +12,7 @@
 @import url("css/workspace-assignment.css");
 @import url("css/session-actions.css?v=20260828-contrast1");
 @import url("css/sidebar.css?v=20260828-session-list3");
+@import url("css/session-folders.css");
 @import url("css/overlays.css?v=20260827-brand3");
 @import url("css/menus.css");
 @import url("css/messages.css?v=20260828-delegated-muted1");

package/lib/server.js

@@ -181,6 +181,8 @@ function createServer(opts) {
   var onSetProjectDefaultMode = opts.onSetProjectDefaultMode || null;
   var onGetProjectLastVendor = opts.onGetProjectLastVendor || null;
   var onSetProjectLastVendor = opts.onSetProjectLastVendor || null;
+  var onGetProjectNewSessionDefault = opts.onGetProjectNewSessionDefault || null;
+  var onSetProjectNewSessionDefault = opts.onSetProjectNewSessionDefault || null;
   var onGetProjectMcpServers = opts.onGetProjectMcpServers || null;
   var onSetProjectMcpServers = opts.onSetProjectMcpServers || null;
   var onGetDaemonConfig = opts.onGetDaemonConfig || null;
@@ -1468,6 +1470,8 @@ function createServer(opts) {
       onSetProjectDefaultMode: onSetProjectDefaultMode,
       onGetProjectLastVendor: onGetProjectLastVendor,
       onSetProjectLastVendor: onSetProjectLastVendor,
+      onGetProjectNewSessionDefault: onGetProjectNewSessionDefault,
+      onSetProjectNewSessionDefault: onSetProjectNewSessionDefault,
       listControllableTools: function (userId) {
         return toolsHandler ? toolsHandler.installedManifests(userId) : [];
       },