clay-server 2.31.0 → 2.32.0-beta.2

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

@@ -6,8 +6,12 @@ import { iconHtml, refreshIcons } from './icons.js';
 import { openProjectSettings } from './project-settings.js';
 import { triggerShare } from './qrcode.js';
 import { parseEmojis } from './markdown.js';
-
-var _ctx = null;
+import { store } from './store.js';
+import { getWs } from './ws-ref.js';
+import { closeSidebar } from './sidebar.js';
+import { showIconTooltip, hideIconTooltip, closeUserCtxMenu, getCurrentDmUserId } from './sidebar-mates.js';
+import { switchProject, openAddProjectModal, getCachedProjects } from './app-projects.js';
+import { showHomeHub } from './app-home-hub.js';
 
 // --- Project state ---
 var cachedProjectList = [];
@@ -236,8 +240,7 @@ var EMOJI_CATEGORIES = [
   ]},
 ];
 
-export function initSidebarProjects(ctx) {
-  _ctx = ctx;
+export function initSidebarProjects() {
 
   // Close project ctx menu and emoji picker on document click
   document.addEventListener("click", function () {
@@ -249,35 +252,35 @@ export function initSidebarProjects(ctx) {
   var addBtn = document.getElementById("icon-strip-add");
   if (addBtn) {
     addBtn.addEventListener("click", function () {
-      if (_ctx.openAddProjectModal) {
-        _ctx.openAddProjectModal();
+      if (openAddProjectModal) {
+        openAddProjectModal();
       } else {
-        var modal = _ctx.$("add-project-modal");
+        var modal = document.getElementById("add-project-modal");
         if (modal) modal.classList.remove("hidden");
       }
     });
-    addBtn.addEventListener("mouseenter", function () { _ctx.showIconTooltip(addBtn, "Add project"); });
-    addBtn.addEventListener("mouseleave", _ctx.hideIconTooltip);
+    addBtn.addEventListener("mouseenter", function () { showIconTooltip(addBtn, "Add project"); });
+    addBtn.addEventListener("mouseleave", hideIconTooltip);
   }
 
   var exploreBtn = document.getElementById("icon-strip-explore");
   if (exploreBtn) {
     exploreBtn.addEventListener("click", function () {
-      var fileBrowserBtn = _ctx.$("file-browser-btn");
+      var fileBrowserBtn = document.getElementById("file-browser-btn");
       if (fileBrowserBtn) fileBrowserBtn.click();
     });
-    exploreBtn.addEventListener("mouseenter", function () { _ctx.showIconTooltip(exploreBtn, "File browser"); });
-    exploreBtn.addEventListener("mouseleave", _ctx.hideIconTooltip);
+    exploreBtn.addEventListener("mouseenter", function () { showIconTooltip(exploreBtn, "File browser"); });
+    exploreBtn.addEventListener("mouseleave", hideIconTooltip);
   }
 
   // Tooltip + click for home icon
   var homeIcon = document.querySelector(".icon-strip-home");
   if (homeIcon) {
-    homeIcon.addEventListener("mouseenter", function () { _ctx.showIconTooltip(homeIcon, "Clay"); });
-    homeIcon.addEventListener("mouseleave", _ctx.hideIconTooltip);
+    homeIcon.addEventListener("mouseenter", function () { showIconTooltip(homeIcon, "Clay"); });
+    homeIcon.addEventListener("mouseleave", hideIconTooltip);
     homeIcon.addEventListener("click", function (e) {
       e.preventDefault();
-      if (_ctx.showHomeHub) _ctx.showHomeHub();
+      if (showHomeHub) showHomeHub();
     });
     homeIcon.style.cursor = "pointer";
   }
@@ -490,7 +493,7 @@ export function closeProjectCtxMenu() {
 
 function showIconCtxMenu(anchorEl, slug, name) {
   closeProjectCtxMenu();
-  if (_ctx.closeUserCtxMenu) _ctx.closeUserCtxMenu();
+  if (closeUserCtxMenu) closeUserCtxMenu();
   closeEmojiPicker();
 
   var menu = document.createElement("div");
@@ -515,8 +518,8 @@ function showIconCtxMenu(anchorEl, slug, name) {
     removeWtItem.addEventListener("click", function (e) {
       e.stopPropagation();
       closeProjectCtxMenu();
-      if (_ctx.ws && _ctx.connected) {
-        _ctx.ws.send(JSON.stringify({ type: "remove_project_check", slug: slug, name: name || slug }));
+      if (getWs() && store.get('connected')) {
+        getWs().send(JSON.stringify({ type: "remove_project_check", slug: slug, name: name || slug }));
       }
     });
     menu.appendChild(removeWtItem);
@@ -553,7 +556,7 @@ function showIconCtxMenu(anchorEl, slug, name) {
 
 function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
   closeProjectCtxMenu();
-  if (_ctx.closeUserCtxMenu) _ctx.closeUserCtxMenu();
+  if (closeUserCtxMenu) closeUserCtxMenu();
   closeEmojiPicker();
 
   var menu = document.createElement("div");
@@ -571,14 +574,14 @@ function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
   menu.appendChild(iconItem);
 
   // --- Project Settings ---
-  if (!_ctx.permissions || _ctx.permissions.projectSettings !== false) {
+  if (!store.get('permissions') || store.get('permissions').projectSettings !== false) {
     var settingsItem = document.createElement("button");
     settingsItem.className = "project-ctx-item";
     settingsItem.innerHTML = iconHtml("settings") + " <span>Project Settings</span>";
     settingsItem.addEventListener("click", function (e) {
       e.stopPropagation();
       closeProjectCtxMenu();
-      openProjectSettings(slug, { slug: slug, name: name, icon: icon, projectOwnerId: _ctx.projectOwnerId, ownerLocked: _ctx.ownerLocked });
+      openProjectSettings(slug, { slug: slug, name: name, icon: icon, projectOwnerId: store.get('currentProjectOwnerId'), ownerLocked: store.get('ownerLocked') });
     });
     menu.appendChild(settingsItem);
   }
@@ -599,9 +602,9 @@ function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
   menu.appendChild(shareItem);
 
   // --- Manage Access ---
-  if (_ctx.multiUser && slug.indexOf("--") === -1) {
-    var isProjectOwner = _ctx.myUserId && _ctx.projectOwnerId && _ctx.myUserId === _ctx.projectOwnerId;
-    var isAdmin = _ctx.permissions && _ctx.permissions.projectSettings !== false;
+  if (store.get('isMultiUserMode') && slug.indexOf("--") === -1) {
+    var isProjectOwner = store.get('myUserId') && store.get('currentProjectOwnerId') && store.get('myUserId') === store.get('currentProjectOwnerId');
+    var isAdmin = store.get('permissions') && store.get('permissions').projectSettings !== false;
     if (isProjectOwner || isAdmin) {
       var accessItem = document.createElement("button");
       accessItem.className = "project-ctx-item";
@@ -630,7 +633,7 @@ function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
   });
   menu.appendChild(wtItem);
 
-  if (!_ctx.permissions || _ctx.permissions.deleteProject !== false) {
+  if (!store.get('permissions') || store.get('permissions').deleteProject !== false) {
     var sep3 = document.createElement("div");
     sep3.className = "project-ctx-separator";
     menu.appendChild(sep3);
@@ -641,8 +644,8 @@ function showProjectCtxMenu(anchorEl, slug, name, icon, position) {
     deleteItem.addEventListener("click", function (e) {
       e.stopPropagation();
       closeProjectCtxMenu();
-      if (_ctx.ws && _ctx.connected) {
-        _ctx.ws.send(JSON.stringify({ type: "remove_project_check", slug: slug, name: name }));
+      if (getWs() && store.get('connected')) {
+        getWs().send(JSON.stringify({ type: "remove_project_check", slug: slug, name: name }));
       }
     });
     menu.appendChild(deleteItem);
@@ -698,8 +701,8 @@ function showEmojiPicker(slug, anchorEl) {
   removeBtn.addEventListener("click", function (e) {
     e.stopPropagation();
     closeEmojiPicker();
-    if (_ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({ type: "set_project_icon", slug: slug, icon: null }));
+    if (getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "set_project_icon", slug: slug, icon: null }));
     }
   });
   header.appendChild(removeBtn);
@@ -744,8 +747,8 @@ function showEmojiPicker(slug, anchorEl) {
         btn.addEventListener("click", function (e) {
           e.stopPropagation();
           closeEmojiPicker();
-          if (_ctx.ws && _ctx.connected) {
-            _ctx.ws.send(JSON.stringify({ type: "set_project_icon", slug: slug, icon: emoji }));
+          if (getWs() && store.get('connected')) {
+            getWs().send(JSON.stringify({ type: "set_project_icon", slug: slug, icon: emoji }));
           }
         });
         grid.appendChild(btn);
@@ -803,8 +806,8 @@ function showProjectRename(slug, currentName) {
     if (committed) return;
     committed = true;
     var newName = input.value.trim();
-    if (newName && newName !== currentName && _ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({ type: "set_project_title", slug: slug, title: newName }));
+    if (newName && newName !== currentName && getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "set_project_title", slug: slug, title: newName }));
       nameEl.textContent = newName;
     } else {
       nameEl.textContent = originalText;
@@ -837,8 +840,8 @@ function showTrashZone() {
   addBtn.parentNode.insertBefore(trash, addBtn.nextSibling);
   refreshIcons();
 
-  trash.addEventListener("mouseenter", function () { _ctx.showIconTooltip(trash, "Remove project"); });
-  trash.addEventListener("mouseleave", _ctx.hideIconTooltip);
+  trash.addEventListener("mouseenter", function () { showIconTooltip(trash, "Remove project"); });
+  trash.addEventListener("mouseleave", hideIconTooltip);
 
   trash.addEventListener("dragover", function (e) {
     e.preventDefault();
@@ -852,8 +855,8 @@ function showTrashZone() {
     e.preventDefault();
     trash.classList.remove("drag-hover");
     var slug = e.dataTransfer.getData("text/plain");
-    if (slug && _ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({ type: "remove_project_check", slug: slug }));
+    if (slug && getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "remove_project_check", slug: slug }));
     }
   });
 }
@@ -891,7 +894,7 @@ function setupDragHandlers(el, slug) {
     setTimeout(function () { ghost.remove(); }, 0);
 
     setTimeout(function () { el.classList.add("dragging"); }, 0);
-    _ctx.hideIconTooltip();
+    hideIconTooltip();
     showTrashZone();
   });
 
@@ -935,8 +938,8 @@ function setupDragHandlers(el, slug) {
     if (!insertBefore) targetIdx++;
     slugs.splice(targetIdx, 0, draggedSlug);
 
-    if (_ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({ type: "reorder_projects", slugs: slugs }));
+    if (getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({ type: "reorder_projects", slugs: slugs }));
     }
   });
 
@@ -974,7 +977,7 @@ function groupProjects(projects) {
 // --- Icon item creation ---
 
 function createIconItem(p, currentSlug) {
-  var currentDmUserId = _ctx.getCurrentDmUserId ? _ctx.getCurrentDmUserId() : null;
+  var currentDmUserId = getCurrentDmUserId ? getCurrentDmUserId() : null;
   var el = document.createElement("a");
   var isActive = p.slug === currentSlug && !currentDmUserId;
   el.className = "icon-strip-item" + (isActive ? " active" : "");
@@ -1013,14 +1016,14 @@ function createIconItem(p, currentSlug) {
   }
 
   (function (name, elem) {
-    elem.addEventListener("mouseenter", function () { _ctx.showIconTooltip(elem, name); });
-    elem.addEventListener("mouseleave", _ctx.hideIconTooltip);
+    elem.addEventListener("mouseenter", function () { showIconTooltip(elem, name); });
+    elem.addEventListener("mouseleave", hideIconTooltip);
   })(p.name, el);
 
   (function (slug) {
     el.addEventListener("click", function (e) {
       e.preventDefault();
-      if (_ctx.switchProject) _ctx.switchProject(slug);
+      if (switchProject) switchProject(slug);
     });
   })(p.slug);
 
@@ -1127,8 +1130,8 @@ function showWorktreeModal(parentSlug, parentName) {
     createBtn.textContent = "Creating...";
     errorDiv.classList.remove("visible");
 
-    if (_ctx.ws && _ctx.connected) {
-      _ctx.ws.send(JSON.stringify({
+    if (getWs() && store.get('connected')) {
+      getWs().send(JSON.stringify({
         type: "create_worktree",
         branch: branch,
         dirName: dirName,
@@ -1140,10 +1143,10 @@ function showWorktreeModal(parentSlug, parentName) {
       var msg;
       try { msg = JSON.parse(event.data); } catch (e) { return; }
       if (msg.type === "create_worktree_result") {
-        _ctx.ws.removeEventListener("message", handler);
+        getWs().removeEventListener("message", handler);
         if (msg.ok) {
           closeModal();
-          if (msg.slug && _ctx.switchProject) _ctx.switchProject(msg.slug);
+          if (msg.slug && switchProject) switchProject(msg.slug);
         } else {
           createBtn.disabled = false;
           createBtn.textContent = "Create";
@@ -1152,7 +1155,7 @@ function showWorktreeModal(parentSlug, parentName) {
         }
       }
     };
-    _ctx.ws.addEventListener("message", handler);
+    getWs().addEventListener("message", handler);
   }
 
   overlay.addEventListener("click", closeModal);
@@ -1178,7 +1181,7 @@ export function renderIconStrip(projects, currentSlug) {
   if (!container) return;
   container.innerHTML = "";
 
-  var currentDmUserId = _ctx.getCurrentDmUserId ? _ctx.getCurrentDmUserId() : null;
+  var currentDmUserId = getCurrentDmUserId ? getCurrentDmUserId() : null;
   var grouped = groupProjects(projects);
 
   for (var i = 0; i < grouped.parents.length; i++) {
@@ -1269,15 +1272,15 @@ export function renderIconStrip(projects, currentSlug) {
           tooltipText += " (outside project path, cannot be accessed)";
         }
         (function (text, elem) {
-          elem.addEventListener("mouseenter", function () { _ctx.showIconTooltip(elem, text); });
-          elem.addEventListener("mouseleave", _ctx.hideIconTooltip);
+          elem.addEventListener("mouseenter", function () { showIconTooltip(elem, text); });
+          elem.addEventListener("mouseleave", hideIconTooltip);
         })(tooltipText, wtEl);
 
         if (isAccessible) {
           (function (slug) {
             wtEl.addEventListener("click", function (e) {
               e.preventDefault();
-              if (_ctx.switchProject) _ctx.switchProject(slug);
+              if (switchProject) switchProject(slug);
             });
           })(wt.slug);
         } else {
@@ -1324,8 +1327,8 @@ export function renderIconStrip(projects, currentSlug) {
         e.stopPropagation();
         showWorktreeModal(parentSlug, parentName);
       });
-      btn.addEventListener("mouseenter", function () { _ctx.showIconTooltip(btn, "New worktree"); });
-      btn.addEventListener("mouseleave", _ctx.hideIconTooltip);
+      btn.addEventListener("mouseenter", function () { showIconTooltip(btn, "New worktree"); });
+      btn.addEventListener("mouseleave", hideIconTooltip);
     })(p.slug, p.name, addBtn);
     itemsContainer.appendChild(addBtn);
 
@@ -1425,8 +1428,8 @@ function createMobileProjectItem(p, currentSlug, isWorktree) {
   }
 
   el.addEventListener("click", function () {
-    if (_ctx.switchProject) _ctx.switchProject(p.slug);
-    if (_ctx.closeSidebar) _ctx.closeSidebar();
+    if (switchProject) switchProject(p.slug);
+    if (closeSidebar) closeSidebar();
   });
 
   return el;