@oro.ad/nuxt-claude-devtools 1.0.6 → 1.1.0

package/dist/runtime/server/claude-session.js

@@ -1,38 +1,56 @@
-import { createServer } from "node:http";
 import { execSync, spawn } from "node:child_process";
-import { Server as SocketServer } from "socket.io";
+import { createLogger } from "../logger.js";
+import { AgentsManager } from "./agents-manager.js";
+import { CommandsManager } from "./commands-manager.js";
+import { DocsManager } from "./docs-manager.js";
+import { HistoryManager } from "./history-manager.js";
+import { SkillsManager } from "./skills-manager.js";
+const log = createLogger("session", { timestamp: true });
 function getErrorMessage(error) {
   if (error instanceof Error) return error.message;
   return String(error);
 }
-export const SOCKET_PORT = 3355;
-function log(message, data) {
-  const timestamp = (/* @__PURE__ */ new Date()).toISOString();
-  console.log(`[claude-session] [${timestamp}] ${message}`, data !== void 0 ? data : "");
+function generateId() {
+  return `msg_${Date.now()}_${Math.random().toString(36).substring(2, 9)}`;
 }
+export const SOCKET_PATH = "/__claude_devtools_socket";
 export class ClaudeSession {
   config;
   io = null;
-  httpServer = null;
   isProcessing = false;
   continueSession = false;
+  historyManager;
+  docsManager;
+  commandsManager;
+  agentsManager;
+  skillsManager;
+  // Claude CLI session ID (in-memory only, lost on hot-reload)
+  claudeSessionId = null;
+  // Stream parsing state
+  parseBuffer = "";
+  currentContentBlocks = [];
+  currentMessageId = "";
+  currentModel = "";
+  accumulatedText = "";
   constructor(config) {
     this.config = config;
+    this.historyManager = new HistoryManager(config.rootDir);
+    this.docsManager = new DocsManager(config.rootDir);
+    this.commandsManager = new CommandsManager(config.rootDir);
+    this.agentsManager = new AgentsManager(config.rootDir);
+    this.skillsManager = new SkillsManager(config.rootDir);
   }
-  startSocketServer() {
-    this.httpServer = createServer();
-    this.io = new SocketServer(this.httpServer, {
-      cors: {
-        origin: "*",
-        methods: ["GET", "POST"]
-      }
-    });
+  attachSocketIO(io) {
+    this.io = io;
+    log(`Socket.IO attached, setting up event handlers`);
     this.io.on("connection", (socket) => {
       log("Client connected", { socketId: socket.id });
       socket.emit("session:status", {
         active: true,
         processing: this.isProcessing
       });
+      const conversation = this.historyManager.getActiveConversation();
+      socket.emit("history:loaded", conversation);
       socket.on("message:send", (message) => {
         log("Message received", { length: message.length, preview: message.substring(0, 100) });
         this.sendMessage(message);
@@ -40,7 +58,37 @@ export class ClaudeSession {
       socket.on("session:reset", () => {
         log("Resetting session (new conversation)");
         this.continueSession = false;
+        this.claudeSessionId = null;
+        const conversation2 = this.historyManager.resetSession();
         this.io?.emit("session:status", { active: true, processing: false });
+        this.io?.emit("history:loaded", conversation2);
+      });
+      socket.on("history:load", () => {
+        const conversation2 = this.historyManager.getActiveConversation();
+        socket.emit("history:loaded", conversation2);
+      });
+      socket.on("history:list", () => {
+        const conversations = this.historyManager.getConversations();
+        socket.emit("history:list", conversations);
+      });
+      socket.on("history:switch", (id) => {
+        const conversation2 = this.historyManager.setActiveConversation(id);
+        if (conversation2) {
+          this.continueSession = false;
+          this.claudeSessionId = conversation2.claudeSessionId || null;
+          log("Switched to conversation", {
+            id: conversation2.id,
+            claudeSessionId: this.claudeSessionId,
+            messageCount: conversation2.messages.length
+          });
+          socket.emit("history:switched", conversation2);
+        }
+      });
+      socket.on("history:delete", (id) => {
+        const success = this.historyManager.deleteConversation(id);
+        socket.emit("history:deleted", { id, success });
+        const conversations = this.historyManager.getConversations();
+        socket.emit("history:list", conversations);
       });
       socket.on("mcp:list", () => {
         log("MCP list requested");
@@ -55,17 +103,349 @@ export class ClaudeSession {
         log("MCP remove requested", data);
         this.removeMcpServer(data, socket);
       });
+      socket.on("docs:list", () => {
+        log("Docs list requested");
+        const files = this.docsManager.getDocFiles();
+        socket.emit("docs:list", files);
+      });
+      socket.on("docs:get", (path) => {
+        log("Docs get requested", { path });
+        const file = this.docsManager.getDocFile(path);
+        socket.emit("docs:file", file);
+      });
+      socket.on("docs:save", (data) => {
+        log("Docs save requested", { path: data.path });
+        try {
+          const file = this.docsManager.saveDocFile(data.path, data.content);
+          socket.emit("docs:saved", { success: true, file });
+          const files = this.docsManager.getDocFiles();
+          socket.emit("docs:list", files);
+        } catch (error) {
+          socket.emit("docs:saved", { success: false, error: String(error) });
+        }
+      });
+      socket.on("docs:delete", (path) => {
+        log("Docs delete requested", { path });
+        const success = this.docsManager.deleteDocFile(path);
+        socket.emit("docs:deleted", { path, success });
+        const files = this.docsManager.getDocFiles();
+        socket.emit("docs:list", files);
+      });
+      socket.on("claudemd:get", () => {
+        log("CLAUDE.md get requested");
+        const data = this.docsManager.getClaudeMd();
+        socket.emit("claudemd:data", data);
+      });
+      socket.on("claudemd:save", (content) => {
+        log("CLAUDE.md save requested");
+        try {
+          const data = this.docsManager.saveClaudeMd(content);
+          socket.emit("claudemd:saved", { success: true, ...data });
+        } catch (error) {
+          socket.emit("claudemd:saved", { success: false, error: String(error) });
+        }
+      });
+      socket.on("llms:list", () => {
+        log("LLMS list requested");
+        const sources = this.docsManager.getLlmsSources();
+        socket.emit("llms:list", sources);
+      });
+      socket.on("llms:add", (data) => {
+        log("LLMS add requested", { url: data.url });
+        try {
+          const source = this.docsManager.addLlmsSource(data.url, data.title, data.description);
+          socket.emit("llms:added", { success: true, source });
+          const sources = this.docsManager.getLlmsSources();
+          socket.emit("llms:list", sources);
+        } catch (error) {
+          socket.emit("llms:added", { success: false, error: String(error) });
+        }
+      });
+      socket.on("llms:remove", (url) => {
+        log("LLMS remove requested", { url });
+        const success = this.docsManager.removeLlmsSource(url);
+        socket.emit("llms:removed", { url, success });
+        const sources = this.docsManager.getLlmsSources();
+        socket.emit("llms:list", sources);
+      });
+      socket.on("llms:update", (data) => {
+        log("LLMS update requested", { url: data.url });
+        const source = this.docsManager.updateLlmsSource(data.url, {
+          title: data.title,
+          description: data.description
+        });
+        socket.emit("llms:updated", { success: !!source, source });
+      });
+      socket.on("commands:list", () => {
+        log("Commands list requested");
+        const commands = this.commandsManager.getCommands();
+        socket.emit("commands:list", commands);
+      });
+      socket.on("commands:get", (name) => {
+        log("Command get requested", { name });
+        const command = this.commandsManager.getCommand(name);
+        socket.emit("commands:data", command);
+      });
+      socket.on("commands:save", (data) => {
+        log("Command save requested", { name: data.name });
+        try {
+          const command = this.commandsManager.saveCommand(data.name, data.content, {
+            description: data.description,
+            allowedTools: data.allowedTools,
+            disableModelInvocation: data.disableModelInvocation
+          });
+          socket.emit("commands:saved", { success: true, command });
+          const commands = this.commandsManager.getCommands();
+          socket.emit("commands:list", commands);
+        } catch (error) {
+          socket.emit("commands:saved", { success: false, error: String(error) });
+        }
+      });
+      socket.on("commands:delete", (name) => {
+        log("Command delete requested", { name });
+        const success = this.commandsManager.deleteCommand(name);
+        socket.emit("commands:deleted", { name, success });
+        const commands = this.commandsManager.getCommands();
+        socket.emit("commands:list", commands);
+      });
+      socket.on("agents:list", () => {
+        log("Agents list requested");
+        const agents = this.agentsManager.getAgents();
+        socket.emit("agents:list", agents);
+      });
+      socket.on("agents:get", (name) => {
+        log("Agent get requested", { name });
+        const agent = this.agentsManager.getAgent(name);
+        socket.emit("agents:data", agent);
+      });
+      socket.on("agents:save", (data) => {
+        log("Agent save requested", { name: data.name });
+        try {
+          const agent = this.agentsManager.saveAgent({
+            name: data.name,
+            description: data.description,
+            prompt: data.prompt,
+            model: data.model,
+            tools: data.tools,
+            disallowedTools: data.disallowedTools,
+            permissionMode: data.permissionMode,
+            skills: data.skills
+          });
+          socket.emit("agents:saved", { success: true, agent });
+          const agents = this.agentsManager.getAgents();
+          socket.emit("agents:list", agents);
+        } catch (error) {
+          socket.emit("agents:saved", { success: false, error: String(error) });
+        }
+      });
+      socket.on("agents:delete", (name) => {
+        log("Agent delete requested", { name });
+        const success = this.agentsManager.deleteAgent(name);
+        socket.emit("agents:deleted", { name, success });
+        const agents = this.agentsManager.getAgents();
+        socket.emit("agents:list", agents);
+      });
+      socket.on("skills:list", () => {
+        log("Skills list requested");
+        const skills = this.skillsManager.getSkills();
+        socket.emit("skills:list", skills);
+      });
+      socket.on("skills:get", (name) => {
+        log("Skill get requested", { name });
+        const skill = this.skillsManager.getSkill(name);
+        socket.emit("skills:get", skill);
+      });
+      socket.on("skills:save", (data) => {
+        log("Skill save requested", { name: data.name });
+        try {
+          const skill = this.skillsManager.saveSkill({
+            name: data.name,
+            description: data.description,
+            content: data.content,
+            argumentHint: data.argumentHint,
+            disableModelInvocation: data.disableModelInvocation,
+            userInvocable: data.userInvocable,
+            allowedTools: data.allowedTools,
+            model: data.model,
+            context: data.context,
+            agent: data.agent
+          });
+          socket.emit("skills:saved", { success: true, skill });
+          const skills = this.skillsManager.getSkills();
+          socket.emit("skills:list", skills);
+        } catch (error) {
+          socket.emit("skills:saved", { success: false, error: getErrorMessage(error) });
+        }
+      });
+      socket.on("skills:names", () => {
+        log("Skill names requested");
+        const names = this.skillsManager.getSkillNames();
+        socket.emit("skills:names", names);
+      });
+      socket.on("skills:delete", (name) => {
+        log("Skill delete requested", { name });
+        const success = this.skillsManager.deleteSkill(name);
+        socket.emit("skills:deleted", { name, success });
+        const skills = this.skillsManager.getSkills();
+        socket.emit("skills:list", skills);
+      });
       socket.on("disconnect", () => {
         log("Client disconnected", { socketId: socket.id });
       });
     });
-    this.httpServer.listen(SOCKET_PORT, () => {
-      log(`Socket.IO server started on port ${SOCKET_PORT}`);
-    });
   }
   destroy() {
     this.io?.close();
-    this.httpServer?.close();
+  }
+  resetStreamState() {
+    this.parseBuffer = "";
+    this.currentContentBlocks = [];
+    this.currentMessageId = generateId();
+    this.currentModel = "";
+    this.accumulatedText = "";
+  }
+  buildSystemPrompt() {
+    const sections = [];
+    const llmsSources = this.docsManager.getLlmsSources();
+    if (llmsSources.length > 0) {
+      sections.push("=== EXTERNAL DOCUMENTATION SOURCES ===");
+      sections.push("The following llms.txt sources are configured for this project.");
+      sections.push("You can fetch these URLs to get documentation context when needed:");
+      sections.push("");
+      for (const source of llmsSources) {
+        const title = source.title || source.domain;
+        const desc = source.description ? ` - ${source.description}` : "";
+        sections.push(`- ${title}${desc}`);
+        sections.push(`  URL: ${source.url}`);
+      }
+      sections.push("");
+    }
+    if (this.historyManager.hasHistoryForRecovery()) {
+      const historyPrompt = this.historyManager.formatHistoryForSystemPrompt();
+      if (historyPrompt) {
+        sections.push(historyPrompt);
+      }
+    }
+    if (sections.length === 0) {
+      return null;
+    }
+    return sections.join("\n");
+  }
+  parseStreamChunk(data) {
+    this.parseBuffer += data;
+    const events = [];
+    const lines = this.parseBuffer.split("\n");
+    this.parseBuffer = lines.pop() || "";
+    for (const line of lines) {
+      if (line.trim()) {
+        try {
+          const event = JSON.parse(line);
+          events.push(event);
+        } catch (e) {
+          log("Failed to parse stream event", { line: line.substring(0, 100), error: e });
+        }
+      }
+    }
+    return events;
+  }
+  processStreamEvent(event) {
+    switch (event.type) {
+      case "system":
+        log("System event", { subtype: event.subtype });
+        break;
+      case "assistant": {
+        const assistantEvent = event;
+        this.currentMessageId = assistantEvent.message.id;
+        this.currentModel = assistantEvent.message.model;
+        for (const block of assistantEvent.message.content) {
+          if (block.type === "text" && block.text) {
+            const textBlock = {
+              type: "text",
+              text: block.text
+            };
+            this.currentContentBlocks.push(textBlock);
+            this.accumulatedText += block.text;
+            this.io?.emit("output:chunk", block.text);
+            this.io?.emit("stream:text_delta", {
+              index: this.currentContentBlocks.length - 1,
+              text: block.text
+            });
+          } else if (block.type === "tool_use" && block.id && block.name) {
+            const toolBlock = {
+              type: "tool_use",
+              id: block.id,
+              name: block.name,
+              input: block.input || {}
+            };
+            this.currentContentBlocks.push(toolBlock);
+            this.io?.emit("stream:tool_use", {
+              id: block.id,
+              name: block.name,
+              input: block.input || {}
+            });
+          }
+        }
+        break;
+      }
+      case "tool_use": {
+        const toolEvent = event;
+        const toolBlock = {
+          type: "tool_use",
+          id: toolEvent.tool_use_id,
+          name: toolEvent.name,
+          input: toolEvent.input
+        };
+        this.currentContentBlocks.push(toolBlock);
+        this.io?.emit("stream:tool_use", {
+          id: toolEvent.tool_use_id,
+          name: toolEvent.name,
+          input: toolEvent.input
+        });
+        break;
+      }
+      case "tool_result": {
+        const resultEvent = event;
+        this.currentContentBlocks.push({
+          type: "tool_result",
+          tool_use_id: resultEvent.tool_use_id,
+          content: resultEvent.content,
+          is_error: resultEvent.is_error
+        });
+        this.io?.emit("stream:tool_result", {
+          tool_use_id: resultEvent.tool_use_id,
+          name: resultEvent.name,
+          content: resultEvent.content,
+          is_error: resultEvent.is_error
+        });
+        break;
+      }
+      case "result": {
+        const resultEvent = event;
+        log("Result event", {
+          subtype: resultEvent.subtype,
+          cost: resultEvent.cost_usd,
+          duration: resultEvent.duration_ms,
+          session_id: resultEvent.session_id
+        });
+        if (resultEvent.session_id) {
+          this.claudeSessionId = resultEvent.session_id;
+          this.historyManager.setClaudeSessionId(resultEvent.session_id);
+          log("Saved Claude session ID", { sessionId: resultEvent.session_id });
+        }
+        this.io?.emit("stream:result", {
+          subtype: resultEvent.subtype,
+          result: resultEvent.result,
+          error: resultEvent.error,
+          session_id: resultEvent.session_id,
+          cost_usd: resultEvent.cost_usd,
+          duration_ms: resultEvent.duration_ms,
+          is_error: resultEvent.is_error
+        });
+        break;
+      }
+      default:
+        log("Unknown event type", { type: event.type });
+    }
   }
   sendMessage(message) {
     if (this.isProcessing) {
@@ -73,15 +453,41 @@ export class ClaudeSession {
       return;
     }
     this.isProcessing = true;
+    this.resetStreamState();
     this.io?.emit("session:status", { active: true, processing: true });
+    const userMessage = {
+      id: generateId(),
+      role: "user",
+      content: message,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString()
+    };
+    this.historyManager.addMessage(userMessage);
+    this.io?.emit("stream:message_start", {
+      id: this.currentMessageId
+    });
     const args = [
       ...this.config.args,
       "-p",
       message,
+      "--output-format",
+      "stream-json",
+      "--verbose",
       "--dangerously-skip-permissions"
     ];
-    if (this.continueSession) {
-      args.push("--continue");
+    const storedSessionId = this.claudeSessionId || this.historyManager.getClaudeSessionId();
+    if (storedSessionId) {
+      args.push("--resume", storedSessionId);
+      log("Resuming Claude session", { sessionId: storedSessionId });
+    } else {
+      const systemPrompt = this.buildSystemPrompt();
+      if (systemPrompt) {
+        args.push("--system-prompt", systemPrompt);
+        log("Using system prompt with project context", {
+          promptLength: systemPrompt.length
+        });
+      } else if (this.continueSession) {
+        args.push("--continue");
+      }
     }
     log("Spawning Claude process", { command: this.config.command, args, cwd: this.config.rootDir });
     const child = spawn(this.config.command, args, {
@@ -97,7 +503,10 @@ export class ClaudeSession {
     child.stdout?.on("data", (data) => {
       const chunk = data.toString();
       log("stdout chunk", { length: chunk.length });
-      this.io?.emit("output:chunk", chunk);
+      const events = this.parseStreamChunk(chunk);
+      for (const event of events) {
+        this.processStreamEvent(event);
+      }
     });
     child.stderr?.on("data", (data) => {
       const chunk = data.toString();
@@ -109,18 +518,46 @@ export class ClaudeSession {
       this.isProcessing = false;
       this.io?.emit("session:status", { active: true, processing: false });
     });
+    child.stdin?.on("error", (error) => {
+      log("stdin error (process may have exited)", { error: error.message });
+    });
     child.on("close", (code) => {
       log("Process closed", { exitCode: code });
       this.isProcessing = false;
       if (code === 0) {
         this.continueSession = true;
+        const assistantMessage = {
+          id: this.currentMessageId,
+          role: "assistant",
+          content: this.accumulatedText,
+          contentBlocks: this.currentContentBlocks.length > 0 ? [...this.currentContentBlocks] : void 0,
+          timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+          model: this.currentModel
+        };
+        this.historyManager.addMessage(assistantMessage);
+        this.io?.emit("stream:message_complete", {
+          id: this.currentMessageId,
+          model: this.currentModel,
+          content: this.accumulatedText,
+          contentBlocks: this.currentContentBlocks
+        });
         this.io?.emit("output:complete");
       } else {
-        this.io?.emit("session:error", `Process exited with code ${code}`);
+        const sessionIdWasUsed = this.claudeSessionId || this.historyManager.getClaudeSessionId();
+        if (sessionIdWasUsed) {
+          log("Clearing expired Claude session ID", { sessionId: sessionIdWasUsed });
+          this.claudeSessionId = null;
+          this.historyManager.setClaudeSessionId("");
+        }
+        this.io?.emit("session:error", `Process exited with code ${code}. Session may have expired - try sending the message again.`);
       }
       this.io?.emit("session:status", { active: true, processing: false });
     });
-    child.stdin?.end();
+    try {
+      child.stdin?.end();
+    } catch (e) {
+      log("Error closing stdin", { error: e });
+    }
   }
   getMcpServers() {
     const servers = [];
@@ -199,15 +636,20 @@ export class ClaudeSession {
   }
 }
 let sessionInstance = null;
-export function getClaudeSession(config) {
+export function initClaudeSession(config) {
   if (!sessionInstance) {
     sessionInstance = new ClaudeSession(config);
+    log("Session initialized");
   }
   return sessionInstance;
 }
+export function getClaudeSessionInstance() {
+  return sessionInstance;
+}
 export function destroyClaudeSession() {
   if (sessionInstance) {
     sessionInstance.destroy();
     sessionInstance = null;
+    log("Session destroyed");
   }
 }

package/dist/runtime/server/commands-manager.d.ts

@@ -0,0 +1,24 @@
+export interface SlashCommand {
+    name: string;
+    path: string;
+    description?: string;
+    allowedTools?: string[];
+    disableModelInvocation?: boolean;
+    content: string;
+    rawContent: string;
+    updatedAt: string;
+}
+export declare class CommandsManager {
+    private commandsDir;
+    constructor(projectPath: string);
+    private parseFrontmatter;
+    private buildFrontmatter;
+    getCommands(): SlashCommand[];
+    getCommand(name: string): SlashCommand | null;
+    saveCommand(name: string, content: string, options?: {
+        description?: string;
+        allowedTools?: string[];
+        disableModelInvocation?: boolean;
+    }): SlashCommand;
+    deleteCommand(name: string): boolean;
+}