claude-remote-cli 1.1.2 → 1.3.0

package/dist/server/index.js

@@ -3,6 +3,8 @@ import http from 'node:http';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 import readline from 'node:readline';
+import { execFile } from 'node:child_process';
+import { promisify } from 'node:util';
 import express from 'express';
 import cookieParser from 'cookie-parser';
 import { loadConfig, saveConfig, DEFAULTS } from './config.js';
@@ -10,11 +12,49 @@ import * as auth from './auth.js';
 import * as sessions from './sessions.js';
 import { setupWebSocket } from './ws.js';
 import { WorktreeWatcher } from './watcher.js';
+import { isInstalled as serviceIsInstalled } from './service.js';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
+const execFileAsync = promisify(execFile);
 // When run via CLI bin, config lives in ~/.config/claude-remote-cli/
 // When run directly (development), fall back to local config.json
 const CONFIG_PATH = process.env.CLAUDE_REMOTE_CONFIG || path.join(__dirname, '..', '..', 'config.json');
+const VERSION_CACHE_TTL = 5 * 60 * 1000;
+let versionCache = null;
+function getCurrentVersion() {
+    const pkgPath = path.join(__dirname, '..', '..', 'package.json');
+    const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'));
+    return pkg.version;
+}
+function semverLessThan(a, b) {
+    const parse = (v) => v.split('.').map(Number);
+    const [aMaj = 0, aMin = 0, aPat = 0] = parse(a);
+    const [bMaj = 0, bMin = 0, bPat = 0] = parse(b);
+    if (aMaj !== bMaj)
+        return aMaj < bMaj;
+    if (aMin !== bMin)
+        return aMin < bMin;
+    return aPat < bPat;
+}
+async function getLatestVersion() {
+    const now = Date.now();
+    if (versionCache && now - versionCache.fetchedAt < VERSION_CACHE_TTL) {
+        return versionCache.latest;
+    }
+    try {
+        const res = await fetch('https://registry.npmjs.org/claude-remote-cli/latest');
+        if (!res.ok)
+            return null;
+        const data = await res.json();
+        if (!data.version)
+            return null;
+        versionCache = { latest: data.version, fetchedAt: now };
+        return data.version;
+    }
+    catch (_) {
+        return null;
+    }
+}
 function parseTTL(ttl) {
     if (typeof ttl !== 'string')
         return 24 * 60 * 60 * 1000;
@@ -221,6 +261,54 @@ async function main() {
         broadcastEvent('worktrees-changed');
         res.json(config.rootDirs);
     });
+    // DELETE /worktrees — remove a worktree, prune, and delete its branch
+    app.delete('/worktrees', requireAuth, async (req, res) => {
+        const { worktreePath, repoPath } = req.body;
+        if (!worktreePath || !repoPath) {
+            res.status(400).json({ error: 'worktreePath and repoPath are required' });
+            return;
+        }
+        // Validate the path is inside a .claude/worktrees/ directory
+        if (!worktreePath.includes(path.sep + '.claude' + path.sep + 'worktrees' + path.sep)) {
+            res.status(400).json({ error: 'Path is not inside a .claude/worktrees/ directory' });
+            return;
+        }
+        // Check no active session is using this worktree
+        const activeSessions = sessions.list();
+        const conflict = activeSessions.find(function (s) { return s.repoPath === worktreePath; });
+        if (conflict) {
+            res.status(409).json({ error: 'Close the active session first' });
+            return;
+        }
+        // Derive branch name from worktree directory name
+        const branchName = worktreePath.split('/').pop() || '';
+        try {
+            // Remove the worktree (will fail if uncommitted changes — no --force)
+            await execFileAsync('git', ['worktree', 'remove', worktreePath], { cwd: repoPath });
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : 'Failed to remove worktree';
+            res.status(500).json({ error: message });
+            return;
+        }
+        try {
+            // Prune stale worktree refs
+            await execFileAsync('git', ['worktree', 'prune'], { cwd: repoPath });
+        }
+        catch (_) {
+            // Non-fatal: prune failure doesn't block success
+        }
+        if (branchName) {
+            try {
+                // Delete the branch
+                await execFileAsync('git', ['branch', '-D', branchName], { cwd: repoPath });
+            }
+            catch (_) {
+                // Non-fatal: branch may not exist or may be checked out elsewhere
+            }
+        }
+        res.json({ ok: true });
+    });
     // POST /sessions
     app.post('/sessions', requireAuth, (req, res) => {
         const { repoPath, repoName, worktreePath, claudeArgs } = req.body;
@@ -289,6 +377,28 @@ async function main() {
             res.status(404).json({ error: 'Session not found' });
         }
     });
+    // GET /version — check current vs latest
+    app.get('/version', requireAuth, async (_req, res) => {
+        const current = getCurrentVersion();
+        const latest = await getLatestVersion();
+        const updateAvailable = latest !== null && semverLessThan(current, latest);
+        res.json({ current, latest, updateAvailable });
+    });
+    // POST /update — install latest version from npm
+    app.post('/update', requireAuth, async (_req, res) => {
+        try {
+            await execFileAsync('npm', ['install', '-g', 'claude-remote-cli@latest']);
+            const restarting = serviceIsInstalled();
+            res.json({ ok: true, restarting });
+            if (restarting) {
+                setTimeout(() => process.exit(0), 1000);
+            }
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : 'Update failed';
+            res.status(500).json({ ok: false, error: message });
+        }
+    });
     server.listen(config.port, config.host, () => {
         console.log(`claude-remote-cli listening on ${config.host}:${config.port}`);
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-remote-cli",
-  "version": "1.1.2",
+  "version": "1.3.0",
   "description": "Remote web interface for Claude Code CLI sessions",
   "type": "module",
   "main": "dist/server/index.js",

package/public/app.js

@@ -34,6 +34,41 @@
   var sidebarRepoFilter = document.getElementById('sidebar-repo-filter');
   var dialogRootSelect = document.getElementById('dialog-root-select');
   var dialogRepoSelect = document.getElementById('dialog-repo-select');
+  var contextMenu = document.getElementById('context-menu');
+  var ctxDeleteWorktree = document.getElementById('ctx-delete-worktree');
+  var deleteWtDialog = document.getElementById('delete-worktree-dialog');
+  var deleteWtName = document.getElementById('delete-wt-name');
+  var deleteWtCancel = document.getElementById('delete-wt-cancel');
+  var deleteWtConfirm = document.getElementById('delete-wt-confirm');
+  var updateToast = document.getElementById('update-toast');
+  var updateToastText = document.getElementById('update-toast-text');
+  var updateToastBtn = document.getElementById('update-toast-btn');
+  var updateToastDismiss = document.getElementById('update-toast-dismiss');
+
+  // Context menu state
+  var contextMenuTarget = null; // stores { worktreePath, repoPath, name }
+  var longPressTimer = null;
+  var longPressFired = false;
+
+  function showContextMenu(x, y, wt) {
+    contextMenuTarget = { worktreePath: wt.path, repoPath: wt.repoPath, name: wt.name };
+    contextMenu.style.left = Math.min(x, window.innerWidth - 180) + 'px';
+    contextMenu.style.top = Math.min(y, window.innerHeight - 60) + 'px';
+    contextMenu.hidden = false;
+  }
+
+  function hideContextMenu() {
+    contextMenu.hidden = true;
+    contextMenuTarget = null;
+  }
+
+  document.addEventListener('click', function () {
+    hideContextMenu();
+  });
+
+  document.addEventListener('keydown', function (e) {
+    if (e.key === 'Escape') hideContextMenu();
+  });
 
   // Session / worktree / repo state
   var cachedSessions = [];
@@ -86,6 +121,7 @@
     loadRepos();
     refreshAll();
     connectEventSocket();
+    checkForUpdates();
   }
 
   // ── Terminal ────────────────────────────────────────────────────────────────
@@ -409,10 +445,44 @@
 
     li.appendChild(infoDiv);
 
+    // Click to resume (but not if context menu just opened or long-press fired)
     li.addEventListener('click', function () {
+      if (longPressFired || !contextMenu.hidden) return;
       startSession(wt.repoPath, wt.path);
     });
 
+    // Right-click context menu (desktop)
+    li.addEventListener('contextmenu', function (e) {
+      e.preventDefault();
+      e.stopPropagation();
+      showContextMenu(e.clientX, e.clientY, wt);
+    });
+
+    // Long-press context menu (mobile)
+    li.addEventListener('touchstart', function (e) {
+      longPressFired = false;
+      longPressTimer = setTimeout(function () {
+        longPressTimer = null;
+        longPressFired = true;
+        var touch = e.touches[0];
+        showContextMenu(touch.clientX, touch.clientY, wt);
+      }, 500);
+    }, { passive: true });
+
+    li.addEventListener('touchend', function () {
+      if (longPressTimer) {
+        clearTimeout(longPressTimer);
+        longPressTimer = null;
+      }
+    });
+
+    li.addEventListener('touchmove', function () {
+      if (longPressTimer) {
+        clearTimeout(longPressTimer);
+        longPressTimer = null;
+      }
+    });
+
     return li;
   }
 
@@ -480,6 +550,48 @@
       .catch(function () {});
   }
 
+  // ── Delete Worktree ────────────────────────────────────────────────────────
+
+  ctxDeleteWorktree.addEventListener('click', function (e) {
+    e.stopPropagation();
+    hideContextMenu();
+    if (!contextMenuTarget) return;
+    deleteWtName.textContent = contextMenuTarget.name;
+    deleteWtDialog.showModal();
+  });
+
+  deleteWtCancel.addEventListener('click', function () {
+    deleteWtDialog.close();
+    contextMenuTarget = null;
+  });
+
+  deleteWtConfirm.addEventListener('click', function () {
+    if (!contextMenuTarget) return;
+    var target = contextMenuTarget;
+    deleteWtDialog.close();
+    contextMenuTarget = null;
+
+    fetch('/worktrees', {
+      method: 'DELETE',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        worktreePath: target.worktreePath,
+        repoPath: target.repoPath,
+      }),
+    })
+      .then(function (res) {
+        if (!res.ok) {
+          return res.json().then(function (data) {
+            alert(data.error || 'Failed to delete worktree');
+          });
+        }
+        // UI will auto-update via worktrees-changed WebSocket event
+      })
+      .catch(function () {
+        alert('Failed to delete worktree');
+      });
+  });
+
   function highlightActiveSession() {
     var items = sessionList.querySelectorAll('li');
     items.forEach(function (li) {
@@ -744,6 +856,73 @@
     vv.addEventListener('scroll', onViewportResize);
   })();
 
+  // ── Update Toast ─────────────────────────────────────────────────────────────
+
+  function checkForUpdates() {
+    fetch('/version')
+      .then(function (res) {
+        if (!res.ok) return;
+        return res.json();
+      })
+      .then(function (data) {
+        if (data && data.updateAvailable) {
+          showUpdateToast(data.current, data.latest);
+        }
+      })
+      .catch(function () {
+        // Silently ignore version check errors
+      });
+  }
+
+  function showUpdateToast(current, latest) {
+    updateToastText.textContent = 'Update available: v' + current + ' \u2192 v' + latest;
+    updateToast.hidden = false;
+    updateToastBtn.disabled = false;
+    updateToastBtn.textContent = 'Update Now';
+
+    updateToastBtn.onclick = function () {
+      triggerUpdate(latest);
+    };
+  }
+
+  function triggerUpdate(latest) {
+    updateToastBtn.disabled = true;
+    updateToastBtn.textContent = 'Updating\u2026';
+
+    fetch('/update', { method: 'POST' })
+      .then(function (res) {
+        return res.json().then(function (data) {
+          return { ok: res.ok, data: data };
+        });
+      })
+      .then(function (result) {
+        if (result.ok && result.data.restarting) {
+          updateToastText.textContent = 'Updated! Restarting server\u2026';
+          updateToastBtn.hidden = true;
+          updateToastDismiss.hidden = true;
+          setTimeout(function () {
+            location.reload();
+          }, 5000);
+        } else if (result.ok) {
+          updateToastText.textContent = 'Updated! Please restart the server manually.';
+          updateToastBtn.hidden = true;
+        } else {
+          updateToastText.textContent = 'Update failed: ' + (result.data.error || 'Unknown error');
+          updateToastBtn.disabled = false;
+          updateToastBtn.textContent = 'Retry';
+        }
+      })
+      .catch(function () {
+        updateToastText.textContent = 'Update failed. Please try again.';
+        updateToastBtn.disabled = false;
+        updateToastBtn.textContent = 'Retry';
+      });
+  }
+
+  updateToastDismiss.addEventListener('click', function () {
+    updateToast.hidden = true;
+  });
+
   // ── Auto-auth Check ─────────────────────────────────────────────────────────
 
   fetch('/sessions')

package/public/index.html

@@ -78,6 +78,17 @@
       </div>
     </div>
 
+    <!-- Update Toast -->
+    <div id="update-toast" hidden>
+      <div id="update-toast-content">
+        <span id="update-toast-text"></span>
+        <div id="update-toast-actions">
+          <button id="update-toast-btn" class="btn-accent">Update Now</button>
+          <button id="update-toast-dismiss" aria-label="Dismiss">&times;</button>
+        </div>
+      </div>
+    </div>
+
   </div>
 
   <!-- New Session Dialog -->
@@ -122,6 +133,22 @@
     </div>
   </dialog>
 
+  <!-- Context Menu -->
+  <div id="context-menu" class="context-menu" hidden>
+    <button id="ctx-delete-worktree" class="context-menu-item">Delete worktree</button>
+  </div>
+
+  <!-- Delete Worktree Confirmation Dialog -->
+  <dialog id="delete-worktree-dialog">
+    <h2>Delete worktree?</h2>
+    <p class="delete-wt-warning">This will remove the worktree directory and delete its branch. This cannot be undone.</p>
+    <p class="delete-wt-name" id="delete-wt-name"></p>
+    <div class="dialog-actions">
+      <button id="delete-wt-cancel">Cancel</button>
+      <button id="delete-wt-confirm" class="btn-danger">Delete</button>
+    </div>
+  </dialog>
+
   <script src="/vendor/xterm.js"></script>
   <script src="/vendor/addon-fit.js"></script>
   <script src="/app.js"></script>

package/public/style.css

@@ -737,6 +737,165 @@ dialog#settings-dialog h2 {
   opacity: 0.85;
 }
 
+/* ===== Context Menu ===== */
+.context-menu {
+  position: fixed;
+  z-index: 200;
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  padding: 4px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
+  min-width: 160px;
+}
+
+.context-menu-item {
+  display: block;
+  width: 100%;
+  padding: 10px 14px;
+  background: none;
+  border: none;
+  border-radius: 6px;
+  color: var(--text);
+  font-size: 0.85rem;
+  text-align: left;
+  cursor: pointer;
+  touch-action: manipulation;
+}
+
+.context-menu-item:hover,
+.context-menu-item:active {
+  background: var(--bg);
+  color: var(--accent);
+}
+
+/* ===== Delete Worktree Dialog ===== */
+dialog#delete-worktree-dialog {
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  color: var(--text);
+  padding: 1.5rem;
+  width: 90%;
+  max-width: 400px;
+  margin: auto;
+}
+
+dialog#delete-worktree-dialog::backdrop {
+  background: rgba(0, 0, 0, 0.7);
+}
+
+dialog#delete-worktree-dialog h2 {
+  font-size: 1.1rem;
+  margin-bottom: 0.75rem;
+}
+
+.delete-wt-warning {
+  font-size: 0.85rem;
+  color: var(--text-muted);
+  margin-bottom: 0.75rem;
+  line-height: 1.4;
+}
+
+.delete-wt-name {
+  font-size: 0.85rem;
+  font-family: monospace;
+  color: var(--accent);
+  padding: 8px 10px;
+  background: var(--bg);
+  border-radius: 6px;
+  margin-bottom: 1rem;
+  word-break: break-all;
+}
+
+.btn-danger {
+  background: #c0392b !important;
+  border-color: #c0392b !important;
+  color: #fff !important;
+}
+
+.btn-danger:active {
+  opacity: 0.85;
+}
+
+/* ===== Update Toast ===== */
+
+#update-toast {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 150;
+  display: flex;
+  justify-content: center;
+  padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
+  pointer-events: none;
+  animation: toast-slide-up 0.25s ease-out;
+}
+
+@keyframes toast-slide-up {
+  from {
+    transform: translateY(100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+#update-toast-content {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 12px;
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: 10px;
+  padding: 12px 16px;
+  max-width: 500px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
+  pointer-events: auto;
+}
+
+#update-toast-text {
+  flex: 1;
+  font-size: 0.85rem;
+  color: var(--text);
+}
+
+#update-toast-actions {
+  display: flex;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+#update-toast-btn {
+  padding: 8px 14px;
+  border-radius: 6px;
+  font-size: 0.8rem;
+  border: none;
+  white-space: nowrap;
+}
+
+#update-toast-btn:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+#update-toast-dismiss {
+  background: none;
+  border: none;
+  color: var(--text-muted);
+  font-size: 1.2rem;
+  padding: 4px 6px;
+  cursor: pointer;
+}
+
+#update-toast-dismiss:hover {
+  color: var(--text);
+}
+
 /* ===== Mobile Responsive ===== */
 @media (max-width: 600px) {
   #mobile-header {