claude-dashboard 0.1.0

package/src/lib/db/queries.ts

@@ -0,0 +1,257 @@
+import { v4 as uuidv4 } from 'uuid';
+import { getDb } from './connection.ts';
+import {
+  AGENT_ORDER,
+  type AgentRole,
+  type AgentStep,
+  type StepStatus,
+  type Workflow,
+  type WorkflowStatus,
+} from '../workflow/types.ts';
+
+// ---------------------------------------------------------------------------
+// Internal helpers: snake_case <-> camelCase row mapping
+// ---------------------------------------------------------------------------
+
+interface WorkflowRow {
+  id: string;
+  title: string;
+  user_prompt: string;
+  status: string;
+  current_step_index: number;
+  project_path: string;
+  created_at: string;
+  updated_at: string;
+  completed_at: string | null;
+}
+
+interface AgentStepRow {
+  id: string;
+  workflow_id: string;
+  role: string;
+  status: string;
+  prompt: string;
+  output: string;
+  error: string | null;
+  retry_count: number;
+  duration_ms: number | null;
+  tokens_in: number | null;
+  tokens_out: number | null;
+  started_at: string | null;
+  completed_at: string | null;
+}
+
+function rowToWorkflow(row: WorkflowRow): Workflow {
+  return {
+    id: row.id,
+    title: row.title,
+    userPrompt: row.user_prompt,
+    status: row.status as WorkflowStatus,
+    currentStepIndex: row.current_step_index,
+    projectPath: row.project_path,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+    completedAt: row.completed_at,
+  };
+}
+
+function rowToStep(row: AgentStepRow): AgentStep {
+  return {
+    id: row.id,
+    workflowId: row.workflow_id,
+    role: row.role as AgentRole,
+    status: row.status as StepStatus,
+    prompt: row.prompt,
+    output: row.output,
+    error: row.error,
+    retryCount: row.retry_count,
+    durationMs: row.duration_ms,
+    tokensIn: row.tokens_in,
+    tokensOut: row.tokens_out,
+    startedAt: row.started_at,
+    completedAt: row.completed_at,
+  };
+}
+
+// ---------------------------------------------------------------------------
+// Workflow CRUD
+// ---------------------------------------------------------------------------
+
+/**
+ * Create a new workflow together with its five agent-step rows (one per role
+ * in `AGENT_ORDER`).  Everything runs inside a single transaction so that the
+ * workflow and its steps are always created atomically.
+ */
+export function createWorkflow(
+  id: string,
+  title: string,
+  userPrompt: string,
+  projectPath: string,
+): Workflow {
+  const db = getDb();
+
+  const insertWorkflow = db.prepare(`
+    INSERT INTO workflows (id, title, user_prompt, status, current_step_index, project_path)
+    VALUES (@id, @title, @userPrompt, 'pending', 0, @projectPath)
+  `);
+
+  const insertStep = db.prepare(`
+    INSERT INTO agent_steps (id, workflow_id, role, status)
+    VALUES (@id, @workflowId, @role, 'pending')
+  `);
+
+  const txn = db.transaction(() => {
+    insertWorkflow.run({ id, title, userPrompt, projectPath });
+
+    for (const role of AGENT_ORDER) {
+      insertStep.run({
+        id: uuidv4(),
+        workflowId: id,
+        role,
+      });
+    }
+  });
+
+  txn();
+
+  return getWorkflow(id)!;
+}
+
+/**
+ * Retrieve a single workflow by id, or `null` if not found.
+ */
+export function getWorkflow(id: string): Workflow | null {
+  const db = getDb();
+  const stmt = db.prepare('SELECT * FROM workflows WHERE id = ?');
+  const row = stmt.get(id) as WorkflowRow | undefined;
+  return row ? rowToWorkflow(row) : null;
+}
+
+/**
+ * List workflows ordered by creation time (newest first).
+ */
+export function listWorkflows(limit = 50, offset = 0): Workflow[] {
+  const db = getDb();
+  const stmt = db.prepare(
+    'SELECT * FROM workflows ORDER BY created_at DESC LIMIT ? OFFSET ?',
+  );
+  const rows = stmt.all(limit, offset) as WorkflowRow[];
+  return rows.map(rowToWorkflow);
+}
+
+/**
+ * Update a workflow's status (and optionally the current step index).
+ *
+ * `updated_at` is always bumped.  When the status is a terminal state
+ * (`completed`, `failed`, `cancelled`) `completed_at` is also set.
+ */
+export function updateWorkflowStatus(
+  id: string,
+  status: WorkflowStatus,
+  currentStepIndex?: number,
+): void {
+  const db = getDb();
+
+  const isTerminal =
+    status === 'completed' || status === 'failed' || status === 'cancelled';
+
+  if (currentStepIndex !== undefined) {
+    const stmt = db.prepare(`
+      UPDATE workflows
+      SET status             = @status,
+          current_step_index = @currentStepIndex,
+          updated_at         = datetime('now'),
+          completed_at       = CASE WHEN @isTerminal THEN datetime('now') ELSE completed_at END
+      WHERE id = @id
+    `);
+    stmt.run({ id, status, currentStepIndex, isTerminal: isTerminal ? 1 : 0 });
+  } else {
+    const stmt = db.prepare(`
+      UPDATE workflows
+      SET status       = @status,
+          updated_at   = datetime('now'),
+          completed_at = CASE WHEN @isTerminal THEN datetime('now') ELSE completed_at END
+      WHERE id = @id
+    `);
+    stmt.run({ id, status, isTerminal: isTerminal ? 1 : 0 });
+  }
+}
+
+// ---------------------------------------------------------------------------
+// AgentStep CRUD
+// ---------------------------------------------------------------------------
+
+/**
+ * Return all steps for a given workflow, ordered by the canonical agent order.
+ *
+ * We use a CASE expression so the rows always come back in the same sequence
+ * as `AGENT_ORDER` regardless of insertion order.
+ */
+export function getStepsForWorkflow(workflowId: string): AgentStep[] {
+  const db = getDb();
+  const stmt = db.prepare(`
+    SELECT *
+    FROM agent_steps
+    WHERE workflow_id = ?
+    ORDER BY CASE role
+      WHEN 'pm'   THEN 0
+      WHEN 'rd'   THEN 1
+      WHEN 'ui'   THEN 2
+      WHEN 'test' THEN 3
+      WHEN 'sec'  THEN 4
+      ELSE 5
+    END
+  `);
+  const rows = stmt.all(workflowId) as AgentStepRow[];
+  return rows.map(rowToStep);
+}
+
+/**
+ * Partial update for an agent step.  Only the fields present in `updates`
+ * will be written; all others are left untouched.
+ */
+export interface StepUpdateFields {
+  status?: StepStatus;
+  prompt?: string;
+  output?: string;
+  error?: string | null;
+  retryCount?: number;
+  durationMs?: number | null;
+  tokensIn?: number | null;
+  tokensOut?: number | null;
+  startedAt?: string | null;
+  completedAt?: string | null;
+}
+
+export function updateStepStatus(id: string, updates: StepUpdateFields): void {
+  const db = getDb();
+
+  // Build SET clause dynamically based on provided keys.
+  const columnMap: Record<keyof StepUpdateFields, string> = {
+    status: 'status',
+    prompt: 'prompt',
+    output: 'output',
+    error: 'error',
+    retryCount: 'retry_count',
+    durationMs: 'duration_ms',
+    tokensIn: 'tokens_in',
+    tokensOut: 'tokens_out',
+    startedAt: 'started_at',
+    completedAt: 'completed_at',
+  };
+
+  const setClauses: string[] = [];
+  const params: Record<string, unknown> = { id };
+
+  for (const [key, column] of Object.entries(columnMap)) {
+    if (key in updates) {
+      setClauses.push(`${column} = @${key}`);
+      params[key] = (updates as Record<string, unknown>)[key] ?? null;
+    }
+  }
+
+  if (setClauses.length === 0) return;
+
+  const sql = `UPDATE agent_steps SET ${setClauses.join(', ')} WHERE id = @id`;
+  db.prepare(sql).run(params);
+}

package/src/lib/db/schema.ts

@@ -0,0 +1,39 @@
+/**
+ * SQLite schema for the Claude Dashboard.
+ *
+ * Tables:
+ *   - workflows     : top-level workflow records
+ *   - agent_steps   : one row per agent role per workflow (5 per workflow)
+ */
+export const SCHEMA = `
+CREATE TABLE IF NOT EXISTS workflows (
+  id               TEXT PRIMARY KEY,
+  title            TEXT    NOT NULL,
+  user_prompt      TEXT    NOT NULL,
+  status           TEXT    NOT NULL DEFAULT 'pending',
+  current_step_index INTEGER NOT NULL DEFAULT 0,
+  project_path     TEXT    NOT NULL,
+  created_at       TEXT    NOT NULL DEFAULT (datetime('now')),
+  updated_at       TEXT    NOT NULL DEFAULT (datetime('now')),
+  completed_at     TEXT
+);
+
+CREATE TABLE IF NOT EXISTS agent_steps (
+  id            TEXT PRIMARY KEY,
+  workflow_id   TEXT    NOT NULL,
+  role          TEXT    NOT NULL,
+  status        TEXT    NOT NULL DEFAULT 'pending',
+  prompt        TEXT    NOT NULL DEFAULT '',
+  output        TEXT    NOT NULL DEFAULT '',
+  error         TEXT,
+  retry_count   INTEGER NOT NULL DEFAULT 0,
+  duration_ms   INTEGER,
+  tokens_in     INTEGER,
+  tokens_out    INTEGER,
+  started_at    TEXT,
+  completed_at  TEXT,
+  FOREIGN KEY (workflow_id) REFERENCES workflows(id)
+);
+
+CREATE INDEX IF NOT EXISTS idx_agent_steps_workflow ON agent_steps(workflow_id);
+`;

package/src/lib/output-buffer.ts

@@ -0,0 +1,41 @@
+/**
+ * OutputBuffer: Batches high-frequency token streams into 50ms flushes
+ */
+export class OutputBuffer {
+  private buffer: string[] = [];
+  private timer: ReturnType<typeof setTimeout> | null = null;
+  private readonly flushIntervalMs: number;
+  private readonly onFlush: (chunks: string[]) => void;
+
+  constructor(onFlush: (chunks: string[]) => void, flushIntervalMs = 50) {
+    this.onFlush = onFlush;
+    this.flushIntervalMs = flushIntervalMs;
+  }
+
+  push(chunk: string) {
+    this.buffer.push(chunk);
+    if (!this.timer) {
+      this.timer = setTimeout(() => this.flush(), this.flushIntervalMs);
+    }
+  }
+
+  flush() {
+    if (this.timer) {
+      clearTimeout(this.timer);
+      this.timer = null;
+    }
+    if (this.buffer.length > 0) {
+      const chunks = this.buffer;
+      this.buffer = [];
+      this.onFlush(chunks);
+    }
+  }
+
+  destroy() {
+    if (this.timer) {
+      clearTimeout(this.timer);
+      this.timer = null;
+    }
+    this.buffer = [];
+  }
+}

package/src/lib/terminal/pty-manager.ts

@@ -0,0 +1,106 @@
+import { v4 as uuidv4 } from 'uuid';
+import { existsSync, chmodSync } from 'fs';
+import { join, dirname } from 'path';
+import { createRequire } from 'module';
+const require = createRequire(import.meta.url);
+
+// node-pty is optional - gracefully handle if not available
+let pty: any;
+try {
+  pty = require('node-pty');
+  fixSpawnHelperPermissions();
+} catch {
+  console.warn('[PTY] node-pty not available, terminal features disabled');
+}
+
+function fixSpawnHelperPermissions() {
+  if (process.platform === 'win32') return;
+  try {
+    const ptyPath = require.resolve('node-pty');
+    const baseDir = join(dirname(ptyPath), '..');
+    const arch = process.arch;
+    const helperPath = join(baseDir, 'prebuilds', `${process.platform}-${arch}`, 'spawn-helper');
+    if (existsSync(helperPath)) {
+      chmodSync(helperPath, 0o755);
+    }
+  } catch {}
+}
+
+function getShellPath(): string {
+  if (process.platform === 'win32') return 'powershell.exe';
+
+  const preferred = process.platform === 'darwin' ? '/bin/zsh' : '/bin/bash';
+  if (existsSync(preferred)) return preferred;
+  return '/bin/sh';
+}
+
+interface PtySession {
+  id: string;
+  process: any; // IPty
+  onData: (data: string) => void;
+}
+
+export class PtyManager {
+  private sessions: Map<string, PtySession> = new Map();
+
+  create(cwd: string, onData: (data: string) => void): string {
+    if (!pty) {
+      throw new Error('node-pty is not available');
+    }
+
+    const id = uuidv4();
+    const shell = getShellPath();
+
+    const proc = pty.spawn(shell, [], {
+      name: 'xterm-256color',
+      cols: 80,
+      rows: 24,
+      cwd,
+      env: { ...process.env },
+    });
+
+    proc.onData((data: string) => {
+      onData(data);
+    });
+
+    proc.onExit(() => {
+      this.sessions.delete(id);
+    });
+
+    this.sessions.set(id, { id, process: proc, onData });
+    return id;
+  }
+
+  write(id: string, data: string) {
+    const session = this.sessions.get(id);
+    if (session) {
+      session.process.write(data);
+    }
+  }
+
+  resize(id: string, cols: number, rows: number) {
+    const session = this.sessions.get(id);
+    if (session) {
+      session.process.resize(cols, rows);
+    }
+  }
+
+  kill(id: string) {
+    const session = this.sessions.get(id);
+    if (session) {
+      session.process.kill();
+      this.sessions.delete(id);
+    }
+  }
+
+  killAll() {
+    for (const session of this.sessions.values()) {
+      session.process.kill();
+    }
+    this.sessions.clear();
+  }
+
+  getSessionCount(): number {
+    return this.sessions.size;
+  }
+}

package/src/lib/usage/get-token.ts

@@ -0,0 +1,48 @@
+import { execSync } from "child_process";
+import { readFileSync } from "fs";
+import { homedir } from "os";
+import path from "path";
+
+interface ClaudeCredentials {
+  claudeAiOauth: {
+    accessToken: string;
+    refreshToken: string;
+  };
+}
+
+/**
+ * macOS: 從 Keychain 讀取
+ */
+function readFromKeychain(): string {
+  const raw = execSync(
+    'security find-generic-password -s "Claude Code-credentials" -w',
+    { encoding: "utf-8", timeout: 5000, stdio: ["pipe", "pipe", "pipe"] }
+  ).trim();
+  return raw;
+}
+
+/**
+ * Windows / Linux: 從 ~/.claude/.credentials.json 讀取
+ */
+function readFromCredentialsFile(): string {
+  const filePath = path.join(homedir(), ".claude", ".credentials.json");
+  return readFileSync(filePath, "utf-8");
+}
+
+export function getClaudeOAuthToken(): string {
+  try {
+    const raw = process.platform === "darwin"
+      ? readFromKeychain()
+      : readFromCredentialsFile();
+
+    const credentials: ClaudeCredentials = JSON.parse(raw);
+    const token = credentials?.claudeAiOauth?.accessToken;
+    if (!token) {
+      throw new Error("accessToken not found in credential JSON");
+    }
+    return token;
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Unknown error";
+    throw new Error(`Failed to read Claude Code OAuth token: ${message}`);
+  }
+}

package/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}

package/src/lib/websocket/connection-manager.ts

@@ -0,0 +1,71 @@
+import { WebSocket } from 'ws';
+
+export interface ClientConnection {
+  ws: WebSocket;
+  id: string;
+  subscribedWorkflows: Set<string>;
+}
+
+export class ConnectionManager {
+  private clients: Map<string, ClientConnection> = new Map();
+  private clientCounter = 0;
+
+  addClient(ws: WebSocket): string {
+    const id = `client-${++this.clientCounter}`;
+    this.clients.set(id, {
+      ws,
+      id,
+      subscribedWorkflows: new Set(),
+    });
+    return id;
+  }
+
+  removeClient(id: string) {
+    this.clients.delete(id);
+  }
+
+  subscribeToWorkflow(clientId: string, workflowId: string) {
+    const client = this.clients.get(clientId);
+    if (client) {
+      client.subscribedWorkflows.add(workflowId);
+    }
+  }
+
+  /**
+   * Send to all clients subscribed to a workflow
+   */
+  broadcastToWorkflow(workflowId: string, message: object) {
+    const data = JSON.stringify(message);
+    for (const client of this.clients.values()) {
+      if (client.subscribedWorkflows.has(workflowId) && client.ws.readyState === WebSocket.OPEN) {
+        client.ws.send(data);
+      }
+    }
+  }
+
+  /**
+   * Send to all connected clients
+   */
+  broadcastAll(message: object) {
+    const data = JSON.stringify(message);
+    for (const client of this.clients.values()) {
+      if (client.ws.readyState === WebSocket.OPEN) {
+        client.ws.send(data);
+      }
+    }
+  }
+
+  /**
+   * Send to a specific client
+   */
+  sendTo(clientId: string, message: object) {
+    const client = this.clients.get(clientId);
+    if (client && client.ws.readyState === WebSocket.OPEN) {
+      client.ws.send(JSON.stringify(message));
+    }
+  }
+
+  getClientCount(): number {
+    return this.clients.size;
+  }
+}

package/src/lib/websocket/protocol.ts

@@ -0,0 +1,90 @@
+import type { AgentRole, AgentActivity } from '../workflow/types.ts';
+
+// ---------------------------------------------------------------------------
+// Client -> Server messages
+// ---------------------------------------------------------------------------
+
+export type ClientMessage =
+  | { type: 'workflow:start'; payload: { prompt: string; projectPath: string } }
+  | { type: 'workflow:pause'; payload: { workflowId: string } }
+  | { type: 'workflow:resume'; payload: { workflowId: string } }
+  | { type: 'workflow:cancel'; payload: { workflowId: string } }
+  | { type: 'workflow:subscribe'; payload: { workflowId: string } }
+  | { type: 'terminal:create'; payload: { projectPath: string } }
+  | { type: 'terminal:input'; payload: { terminalId: string; data: string } }
+  | {
+      type: 'terminal:resize';
+      payload: { terminalId: string; cols: number; rows: number };
+    }
+  | { type: 'terminal:close'; payload: { terminalId: string } }
+  | { type: 'ping' };
+
+// ---------------------------------------------------------------------------
+// Server -> Client messages
+// ---------------------------------------------------------------------------
+
+export type ServerMessage =
+  | { type: 'workflow:created'; payload: { workflowId: string; title: string } }
+  | { type: 'workflow:completed'; payload: { workflowId: string } }
+  | { type: 'workflow:failed'; payload: { workflowId: string; error: string } }
+  | { type: 'workflow:paused'; payload: { workflowId: string } }
+  | { type: 'workflow:cancelled'; payload: { workflowId: string } }
+  | {
+      type: 'step:started';
+      payload: { workflowId: string; stepId: string; role: AgentRole };
+    }
+  | {
+      type: 'step:stream';
+      payload: {
+        workflowId: string;
+        stepId: string;
+        role: AgentRole;
+        chunk: string;
+      };
+    }
+  | {
+      type: 'step:completed';
+      payload: {
+        workflowId: string;
+        stepId: string;
+        role: AgentRole;
+        output: string;
+        durationMs: number;
+        tokensIn?: number;
+        tokensOut?: number;
+      };
+    }
+  | {
+      type: 'step:failed';
+      payload: {
+        workflowId: string;
+        stepId: string;
+        role: AgentRole;
+        error: string;
+      };
+    }
+  | {
+      type: 'step:activity';
+      payload: {
+        workflowId: string;
+        stepId: string;
+        role: AgentRole;
+        activity: AgentActivity;
+      };
+    }
+  | {
+      type: 'step:retry';
+      payload: {
+        workflowId: string;
+        stepId: string;
+        role: AgentRole;
+        attempt: number;
+        maxRetries: number;
+        reason: string;
+      };
+    }
+  | { type: 'terminal:created'; payload: { terminalId: string } }
+  | { type: 'terminal:output'; payload: { terminalId: string; data: string } }
+  | { type: 'terminal:error'; payload: { error: string } }
+  | { type: 'terminal:closed'; payload: { terminalId: string } }
+  | { type: 'pong' };