claude-home 1.1.1 → 1.2.0

package/README.md

@@ -62,13 +62,16 @@ Opens `http://localhost:3141` in your browser automatically.
 
 ### Auto-launch on every Claude session
 
-Run this once to register a hook that starts claude-home in the background whenever you open Claude Code:
+On first run, claude-home will ask if you want to register a hook that starts the dashboard automatically whenever Claude Code opens. You can also manage this anytime:
 
 ```bash
-claude-home setup-hook
+claude-home setup-hook    # enable auto-start
+claude-home remove-hook   # disable auto-start
 ```
 
-This also creates a `/claude-home` slash command so you can trigger it from any Claude session.
+Or toggle it directly from the **Hooks** section in the UI.
+
+`setup-hook` also creates a `/claude-home` slash command so you can trigger it from any Claude session.
 
 ### CLI flags
 
@@ -82,6 +85,7 @@ claude-home [options]
 
 Commands:
   setup-hook       Add SessionStart hook + /claude-home slash command
+  remove-hook      Remove SessionStart hook + /claude-home slash command
 ```
 
 ---

package/bin/cli.js

@@ -44,29 +44,36 @@ if (args.includes('--help') || args.includes('-h')) {
 
   Commands:
     setup-hook       Add SessionStart hook and /claude-home slash command
+    remove-hook      Remove SessionStart hook and /claude-home slash command
   `);
   process.exit(0);
 }
 
-// ─── Setup-hook subcommand ────────────────────────────────────────────────────
+// ─── Setup-hook / remove-hook subcommands ────────────────────────────────────
 
 if (subcommand === 'setup-hook') {
   setupHook();
   process.exit(0);
 }
 
+if (subcommand === 'remove-hook') {
+  removeHook();
+  process.exit(0);
+}
+
 // ─── Main: start server or reuse existing ────────────────────────────────────
 
 checkForUpdates(); // async, non-blocking
-
-isPortFree(port).then(free => {
-  if (free) {
-    const { startServer } = require('../server.js');
-    startServer(port);
-  } else {
-    console.log(`claude-home already running at http://localhost:${port}`);
-  }
-  if (!noOpen) openBrowser(`http://localhost:${port}`);
+promptSetupHookIfNeeded().then(() => {
+  isPortFree(port).then(free => {
+    if (free) {
+      const { startServer } = require('../server.js');
+      startServer(port);
+    } else {
+      console.log(`claude-home already running at http://localhost:${port}`);
+    }
+    if (!noOpen) openBrowser(`http://localhost:${port}`);
+  });
 });
 
 // ─── Update check ────────────────────────────────────────────────────────────
@@ -118,6 +125,34 @@ function isPortFree(p) {
   });
 }
 
+function promptSetupHookIfNeeded() {
+  const settingsPath = path.join(os.homedir(), '.claude', 'settings.json');
+  const sentinelPath = path.join(os.homedir(), '.claude', 'claude-home', '.hook-prompted');
+
+  // Already prompted before, or hook already set up
+  if (fs.existsSync(sentinelPath)) return Promise.resolve();
+  try {
+    const s = JSON.parse(fs.readFileSync(settingsPath, 'utf8'));
+    const already = s.hooks?.SessionStart?.some(e => e.hooks?.some(h => h.command?.includes('claude-home')));
+    if (already) { fs.writeFileSync(sentinelPath, '1'); return Promise.resolve(); }
+  } catch { /* settings.json may not exist */ }
+
+  return new Promise(resolve => {
+    process.stdout.write('\n  Auto-start claude-home when Claude Code opens? (y/n) ');
+    process.stdin.setEncoding('utf8');
+    process.stdin.once('data', d => {
+      process.stdin.pause();
+      if (d.trim().toLowerCase() === 'y') {
+        setupHook();
+      } else {
+        console.log('  Skipped. Run `claude-home setup-hook` anytime to enable it.\n');
+      }
+      fs.writeFileSync(sentinelPath, '1');
+      resolve();
+    });
+  });
+}
+
 function openBrowser(url) {
   const cmd = process.platform === 'darwin' ? `open "${url}"`
     : process.platform === 'win32' ? `start "" "${url}"`
@@ -175,3 +210,38 @@ function setupHook() {
 
   console.log('\nDone! Restart Claude Code for the hook to take effect.');
 }
+
+function removeHook() {
+  const settingsPath = path.join(os.homedir(), '.claude', 'settings.json');
+  const commandPath = path.join(os.homedir(), '.claude', 'commands', 'claude-home.md');
+  const sentinelPath = path.join(os.homedir(), '.claude', 'claude-home', '.hook-prompted');
+
+  // Remove SessionStart hook
+  let removed = false;
+  try {
+    const settings = JSON.parse(fs.readFileSync(settingsPath, 'utf8'));
+    if (settings.hooks?.SessionStart) {
+      const before = settings.hooks.SessionStart.length;
+      settings.hooks.SessionStart = settings.hooks.SessionStart.filter(
+        e => !e.hooks?.some(h => h.command?.includes('claude-home'))
+      );
+      if (settings.hooks.SessionStart.length < before) {
+        fs.writeFileSync(settingsPath, JSON.stringify(settings, null, 2), 'utf8');
+        console.log(`✓ SessionStart hook removed from ${settingsPath}`);
+        removed = true;
+      }
+    }
+    if (!removed) console.log('  No claude-home hook found — skipped');
+  } catch { console.log('  Could not read settings.json — skipped'); }
+
+  // Remove slash command
+  if (fs.existsSync(commandPath)) {
+    fs.unlinkSync(commandPath);
+    console.log(`✓ Slash command removed from ${commandPath}`);
+  }
+
+  // Reset sentinel so setup prompt can appear again
+  try { fs.unlinkSync(sentinelPath); } catch { /* ignore */ }
+
+  console.log('\nDone! Restart Claude Code for the change to take effect.');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-home",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "Web dashboard for Claude Code — browse sessions, manage skills, hooks, commands, and agents",
   "main": "server.js",
   "bin": {

package/public/index.html

@@ -3121,6 +3121,18 @@
                 <div class="perm-pipeline-note">Hooks reciben el evento como JSON por stdin. Usar matcher para filtrar por tool (Bash, Edit…)</div>
               </div>
 
+              <!-- Auto-start toggle -->
+              <div style="display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border:1px solid var(--rule-2);border-radius:6px;margin-bottom:16px;background:var(--canvas)">
+                <div>
+                  <div style="font-size:12px;font-weight:600;color:var(--ink)">Auto-start claude-home</div>
+                  <div style="font-size:11px;color:var(--ink-3);margin-top:2px">Start the dashboard automatically when Claude Code opens</div>
+                </div>
+                <label style="display:flex;align-items:center;gap:8px;cursor:pointer">
+                  <span style="font-size:11px;color:var(--ink-3)" x-text="isAutoStartEnabled() ? 'On' : 'Off'"></span>
+                  <input type="checkbox" :checked="isAutoStartEnabled()" @change="toggleAutoStart($event.target.checked)" style="cursor:pointer;width:16px;height:16px;accent-color:var(--accent,#4a9)">
+                </label>
+              </div>
+
               <!-- Hooks section -->
               <div class="config-section" style="margin-bottom:16px">
                 <div class="config-section-title" style="display:flex;align-items:center;justify-content:space-between">
@@ -5191,6 +5203,31 @@
           return ordered;
         },
 
+        isAutoStartEnabled() {
+          const hooks = this.configHooks();
+          return hooks.some(h => h.event === 'SessionStart' && h.command?.includes('claude-home'));
+        },
+
+        async toggleAutoStart(enable) {
+          if (enable) {
+            await fetch('/api/config/hooks', {
+              method: 'POST',
+              headers: { 'Content-Type': 'application/json' },
+              body: JSON.stringify({
+                scope: 'user',
+                event: 'SessionStart',
+                matcher: '',
+                type: 'command',
+                command: `lsof -ti:3141 >/dev/null 2>&1 || (claude-home --no-open &>/dev/null &)`,
+              }),
+            });
+          } else {
+            const hook = this.configHooks().find(h => h.event === 'SessionStart' && h.command?.includes('claude-home'));
+            if (hook) await this.deleteHook(hook);
+          }
+          await this.loadConfig();
+        },
+
         configHooks() {
           if (!this.config?.settings) return [];
           const result = [];