create-claude-code-visualizer 0.1.0

package/templates/app/src/lib/auth-guard.ts

@@ -0,0 +1,116 @@
+import { NextRequest, NextResponse } from "next/server";
+import { createClient } from "@/lib/supabase-server";
+
+export type Role = "admin" | "operator" | "viewer";
+
+interface AuthResult {
+  authorized: boolean;
+  user: { email: string; role: Role } | null;
+  response?: NextResponse;
+}
+
+/**
+ * Check if the current user has one of the required roles.
+ * Logs every access attempt (allowed or blocked) with a reason.
+ */
+export async function requireRole(
+  req: NextRequest,
+  allowedRoles: Role[],
+  action: string,
+  resource?: string
+): Promise<AuthResult> {
+  const supabase = await createClient();
+  const ip = req.headers.get("x-forwarded-for") || req.headers.get("x-real-ip") || "unknown";
+  const ua = req.headers.get("user-agent") || "unknown";
+
+  // Check authentication
+  const { data: { user } } = await supabase.auth.getUser();
+
+  if (!user?.email) {
+    await supabase.rpc("log_access", {
+      p_email: null,
+      p_role: null,
+      p_action: action,
+      p_resource: resource || null,
+      p_allowed: false,
+      p_reason: "Not authenticated — no valid session",
+      p_ip_address: ip,
+      p_user_agent: ua,
+    });
+
+    return {
+      authorized: false,
+      user: null,
+      response: NextResponse.json(
+        { error: "Not authenticated" },
+        { status: 401 }
+      ),
+    };
+  }
+
+  // Check role
+  const { data: role } = await supabase.rpc("check_user_role", {
+    user_email: user.email,
+  }) as { data: Role | null };
+
+  if (!role) {
+    await supabase.rpc("log_access", {
+      p_email: user.email,
+      p_role: null,
+      p_action: action,
+      p_resource: resource || null,
+      p_allowed: false,
+      p_reason: "User has no role assigned — not in user_roles table",
+      p_ip_address: ip,
+      p_user_agent: ua,
+    });
+
+    return {
+      authorized: false,
+      user: null,
+      response: NextResponse.json(
+        { error: "Not authorized — no role assigned" },
+        { status: 403 }
+      ),
+    };
+  }
+
+  if (!allowedRoles.includes(role)) {
+    await supabase.rpc("log_access", {
+      p_email: user.email,
+      p_role: role,
+      p_action: action,
+      p_resource: resource || null,
+      p_allowed: false,
+      p_reason: `Role "${role}" is not allowed — requires one of: ${allowedRoles.join(", ")}`,
+      p_ip_address: ip,
+      p_user_agent: ua,
+    });
+
+    return {
+      authorized: false,
+      user: { email: user.email, role },
+      response: NextResponse.json(
+        { error: `Forbidden — your role "${role}" does not have access to this action` },
+        { status: 403 }
+      ),
+    };
+  }
+
+  // Allowed
+  await supabase.rpc("log_access", {
+    p_email: user.email,
+    p_role: role,
+    p_action: action,
+    p_resource: resource || null,
+    p_allowed: true,
+    p_reason: `Allowed — role "${role}" permitted for this action`,
+    p_ip_address: ip,
+    p_user_agent: ua,
+  });
+
+  return {
+    authorized: true,
+    user: { email: user.email, role },
+  };
+}

package/templates/app/src/lib/capabilities.ts

@@ -0,0 +1,191 @@
+import fs from "fs";
+import path from "path";
+import matter from "gray-matter";
+import { getAgents } from "./agents";
+
+const PROJECT_ROOT = process.env.PROJECT_ROOT || path.resolve(__dirname, "../../../..");
+const SKILLS_DIR = path.join(PROJECT_ROOT, ".claude", "skills");
+const COMMANDS_DIR = path.join(PROJECT_ROOT, ".claude", "commands");
+const MCP_PATH = path.join(PROJECT_ROOT, ".mcp.json");
+
+export interface SkillInfo {
+  slug: string;
+  name: string;
+  description: string;
+  category: string;
+}
+
+export interface CommandInfo {
+  slug: string;
+  name: string;
+  description: string;
+  group?: string; // e.g., "consider" for consider/* commands
+}
+
+export interface McpServerInfo {
+  name: string;
+  type: "local" | "remote";
+}
+
+export interface SubagentInfo {
+  slug: string;
+  name: string;
+  description: string;
+  emoji?: string;
+}
+
+export interface AgentCapabilities {
+  skills: SkillInfo[];
+  commands: CommandInfo[];
+  mcpServers: McpServerInfo[];
+  subagents: SubagentInfo[];
+  tools: string[];
+}
+
+function categorizeSkill(slug: string): string {
+  if (slug.startsWith("gws-workflow")) return "Workflows";
+  if (slug.startsWith("gws-")) return "Google Workspace";
+  if (slug.startsWith("recipe-")) return "Recipes";
+  if (slug.startsWith("persona-")) return "Personas";
+  if (slug.includes("frontend") || slug.includes("design")) return "Development";
+  return "Other";
+}
+
+export function readSkillContent(slug: string): string | null {
+  try {
+    const skillFile = path.join(SKILLS_DIR, slug, "SKILL.md");
+    const raw = fs.readFileSync(skillFile, "utf-8");
+    const { content } = matter(raw);
+    return content.trim() || null;
+  } catch {
+    return null;
+  }
+}
+
+export function readSkills(): SkillInfo[] {
+  try {
+    const dirs = fs.readdirSync(SKILLS_DIR, { withFileTypes: true })
+      .filter((d) => d.isDirectory());
+
+    return dirs.map((dir) => {
+      const skillFile = path.join(SKILLS_DIR, dir.name, "SKILL.md");
+      try {
+        const raw = fs.readFileSync(skillFile, "utf-8");
+        const { data } = matter(raw);
+        return {
+          slug: dir.name,
+          name: data.name || dir.name,
+          description: data.description || "",
+          category: categorizeSkill(dir.name),
+        };
+      } catch {
+        return {
+          slug: dir.name,
+          name: dir.name,
+          description: "",
+          category: categorizeSkill(dir.name),
+        };
+      }
+    }).sort((a, b) => a.category.localeCompare(b.category) || a.name.localeCompare(b.name));
+  } catch {
+    return [];
+  }
+}
+
+export function readCommands(): CommandInfo[] {
+  try {
+    const commands: CommandInfo[] = [];
+    const entries = fs.readdirSync(COMMANDS_DIR, { withFileTypes: true });
+
+    for (const entry of entries) {
+      if (entry.isFile() && entry.name.endsWith(".md")) {
+        const raw = fs.readFileSync(path.join(COMMANDS_DIR, entry.name), "utf-8");
+        const { data } = matter(raw);
+        const slug = entry.name.replace(/\.md$/, "");
+        commands.push({
+          slug,
+          name: data.name || slug,
+          description: data.description || "",
+        });
+      } else if (entry.isDirectory()) {
+        // Grouped commands like consider/*
+        const subDir = path.join(COMMANDS_DIR, entry.name);
+        const subFiles = fs.readdirSync(subDir).filter((f) => f.endsWith(".md"));
+        for (const sub of subFiles) {
+          const raw = fs.readFileSync(path.join(subDir, sub), "utf-8");
+          const { data } = matter(raw);
+          const slug = `${entry.name}/${sub.replace(/\.md$/, "")}`;
+          commands.push({
+            slug,
+            name: data.name || sub.replace(/\.md$/, ""),
+            description: data.description || "",
+            group: entry.name,
+          });
+        }
+      }
+    }
+
+    return commands.sort((a, b) => (a.group || "").localeCompare(b.group || "") || a.slug.localeCompare(b.slug));
+  } catch {
+    return [];
+  }
+}
+
+function readMcpServers(): McpServerInfo[] {
+  try {
+    const raw = JSON.parse(fs.readFileSync(MCP_PATH, "utf-8"));
+    const servers = raw.mcpServers || {};
+    return Object.keys(servers).map((name) => ({
+      name,
+      type: servers[name].type === "http" ? "remote" as const : "local" as const,
+    }));
+  } catch {
+    return [];
+  }
+}
+
+function getSubagents(excludeSlug?: string): SubagentInfo[] {
+  return getAgents()
+    .filter((a) => a.slug !== "main" && a.slug !== excludeSlug)
+    .map((a) => ({
+      slug: a.slug,
+      name: a.name,
+      description: a.description,
+      emoji: a.emoji,
+    }));
+}
+
+// Anthropic-hosted MCP integrations (add your own here)
+const HOSTED_INTEGRATIONS: McpServerInfo[] = [];
+
+export function getAgentCapabilities(slug: string): AgentCapabilities {
+  const isMain = slug === "main";
+  const agents = getAgents();
+  const agent = agents.find((a) => a.slug === slug);
+  const tools = agent?.tools || [];
+
+  if (isMain) {
+    return {
+      skills: readSkills(),
+      commands: readCommands(),
+      mcpServers: [...readMcpServers(), ...HOSTED_INTEGRATIONS],
+      subagents: getSubagents(),
+      tools,
+    };
+  }
+
+  // Specialist agents: only show MCP servers they've been granted access to
+  const allMcp = [...readMcpServers(), ...HOSTED_INTEGRATIONS];
+  const agentMcpNames = agent?.mcpServers;
+  const filteredMcp = agentMcpNames
+    ? allMcp.filter((s) => agentMcpNames.includes(s.name))
+    : [];
+
+  return {
+    skills: [],
+    commands: [],
+    mcpServers: filteredMcp,
+    subagents: [],
+    tools,
+  };
+}

package/templates/app/src/lib/line-diff.ts

@@ -0,0 +1,96 @@
+/**
+ * Lightweight line-level diff using LCS (longest common subsequence).
+ * No external dependencies. Designed for CLAUDE.md files (~50-300 lines).
+ */
+
+export type DiffOp =
+  | { type: "keep"; text: string }
+  | { type: "delete"; text: string }
+  | { type: "insert"; text: string }
+  | { type: "replace"; oldText: string; newText: string };
+
+export function computeLineDiff(oldText: string, newText: string): DiffOp[] {
+  const oldLines = oldText.split("\n");
+  const newLines = newText.split("\n");
+  const n = oldLines.length;
+  const m = newLines.length;
+
+  // Build LCS table
+  const dp: number[][] = Array.from({ length: n + 1 }, () => new Array(m + 1).fill(0));
+  for (let i = 1; i <= n; i++) {
+    for (let j = 1; j <= m; j++) {
+      if (oldLines[i - 1] === newLines[j - 1]) {
+        dp[i][j] = dp[i - 1][j - 1] + 1;
+      } else {
+        dp[i][j] = Math.max(dp[i - 1][j], dp[i][j - 1]);
+      }
+    }
+  }
+
+  // Backtrack to produce raw ops
+  const raw: { type: "keep" | "delete" | "insert"; line: string }[] = [];
+  let i = n;
+  let j = m;
+  while (i > 0 || j > 0) {
+    if (i > 0 && j > 0 && oldLines[i - 1] === newLines[j - 1]) {
+      raw.push({ type: "keep", line: oldLines[i - 1] });
+      i--;
+      j--;
+    } else if (j > 0 && (i === 0 || dp[i][j - 1] >= dp[i - 1][j])) {
+      raw.push({ type: "insert", line: newLines[j - 1] });
+      j--;
+    } else {
+      raw.push({ type: "delete", line: oldLines[i - 1] });
+      i--;
+    }
+  }
+  raw.reverse();
+
+  // Merge consecutive ops of the same type, then collapse adjacent delete+insert into replace
+  const merged: DiffOp[] = [];
+  let idx = 0;
+  while (idx < raw.length) {
+    const op = raw[idx];
+
+    if (op.type === "keep") {
+      // Collect consecutive keeps
+      const lines: string[] = [op.line];
+      idx++;
+      while (idx < raw.length && raw[idx].type === "keep") {
+        lines.push(raw[idx].line);
+        idx++;
+      }
+      merged.push({ type: "keep", text: lines.join("\n") });
+    } else if (op.type === "delete") {
+      // Collect consecutive deletes
+      const delLines: string[] = [op.line];
+      idx++;
+      while (idx < raw.length && raw[idx].type === "delete") {
+        delLines.push(raw[idx].line);
+        idx++;
+      }
+      // Check if followed by inserts → replace
+      if (idx < raw.length && raw[idx].type === "insert") {
+        const insLines: string[] = [];
+        while (idx < raw.length && raw[idx].type === "insert") {
+          insLines.push(raw[idx].line);
+          idx++;
+        }
+        merged.push({ type: "replace", oldText: delLines.join("\n"), newText: insLines.join("\n") });
+      } else {
+        merged.push({ type: "delete", text: delLines.join("\n") });
+      }
+    } else {
+      // insert (not preceded by delete)
+      const lines: string[] = [op.line];
+      idx++;
+      while (idx < raw.length && raw[idx].type === "insert") {
+        lines.push(raw[idx].line);
+        idx++;
+      }
+      merged.push({ type: "insert", text: lines.join("\n") });
+    }
+  }
+
+  return merged;
+}

package/templates/app/src/lib/queue.ts

@@ -0,0 +1,22 @@
+import { Queue } from "bullmq";
+import { getRedisConfig } from "./redis";
+
+const QUEUE_NAME = "agent-runs";
+
+let instance: Queue | null = null;
+
+export function getQueue(): Queue {
+  if (!instance) {
+    instance = new Queue(QUEUE_NAME, {
+      connection: getRedisConfig(),
+      defaultJobOptions: {
+        attempts: 1,
+        removeOnComplete: { count: 200, age: 86400 },
+        removeOnFail: { count: 500, age: 604800 },
+      },
+    });
+  }
+  return instance;
+}
+
+export { QUEUE_NAME };

package/templates/app/src/lib/redis.ts

@@ -0,0 +1,12 @@
+// Connection config for BullMQ — uses URL string parsed into host/port
+const REDIS_URL = process.env.REDIS_URL || "redis://localhost:6379";
+
+export function getRedisConfig() {
+  const url = new URL(REDIS_URL);
+  return {
+    host: url.hostname,
+    port: parseInt(url.port || "6379", 10),
+    password: url.password || undefined,
+    maxRetriesPerRequest: null as null, // required for BullMQ workers
+  };
+}

package/templates/app/src/lib/role-permissions.ts

@@ -0,0 +1,166 @@
+// Role-based file/command permissions for agent execution.
+// Operators get the same tools as admin, but a canUseTool wrapper blocks
+// writes to protected paths and dangerous Bash commands.
+
+import path from "path";
+import type { Role } from "./auth-guard";
+
+const PROJECT_ROOT = process.env.PROJECT_ROOT || "/mnt/c/Users/Admin/Documents/PersonalAIssistant";
+
+// ---------------------------------------------------------------------------
+// Protected paths — operators cannot write/edit these (relative to project root)
+// ---------------------------------------------------------------------------
+
+export const PROTECTED_PATHS = [
+  "package.json",
+  "package-lock.json",
+  "tsconfig.json",
+  ".mcp.json",
+  ".env",
+  "CLAUDE.md",
+  "MEMORY.md",
+  "personal-assistant-app/src/",
+  "personal-assistant-app/worker/",
+  ".claude/agents/",
+  ".claude/skills/",
+  ".claude/settings",
+  "next.config",
+  "middleware.ts",
+];
+
+// ---------------------------------------------------------------------------
+// Blocked Bash command patterns
+// ---------------------------------------------------------------------------
+
+export const BLOCKED_COMMANDS: { pattern: RegExp; reason: string }[] = [
+  { pattern: /\bnpm\s+(install|ci|uninstall|remove)\b/, reason: "npm install/uninstall is not allowed for operators" },
+  { pattern: /\bpip3?\s+install\b/, reason: "pip install is not allowed for operators" },
+  { pattern: /\brm\s+-rf\b/, reason: "rm -rf is not allowed for operators" },
+  { pattern: /\bgit\s+push\b/, reason: "git push is not allowed for operators" },
+  { pattern: /\bgit\s+reset\s+--hard\b/, reason: "git reset --hard is not allowed for operators" },
+  { pattern: /\bgit\s+checkout\s+--\b/, reason: "git checkout -- is not allowed for operators" },
+  { pattern: /\bgit\s+clean\b/, reason: "git clean is not allowed for operators" },
+];
+
+// ---------------------------------------------------------------------------
+// Path helpers
+// ---------------------------------------------------------------------------
+
+/** Resolve an absolute or relative path to project-relative. Returns null if outside project. */
+export function relativeToProject(filePath: string): string | null {
+  const abs = path.isAbsolute(filePath) ? filePath : path.resolve(PROJECT_ROOT, filePath);
+  const normalized = path.normalize(abs);
+  if (!normalized.startsWith(PROJECT_ROOT)) return null;
+  return path.relative(PROJECT_ROOT, normalized);
+}
+
+/** Check if a project-relative path matches any protected prefix. */
+export function isProtectedPath(relPath: string): boolean {
+  return PROTECTED_PATHS.some((p) => {
+    if (p.endsWith("/")) {
+      return relPath.startsWith(p) || relPath === p.slice(0, -1);
+    }
+    return relPath === p || relPath.startsWith(p + "/");
+  });
+}
+
+// ---------------------------------------------------------------------------
+// Bash command checking
+// ---------------------------------------------------------------------------
+
+/** Check a Bash command for blocked patterns and redirects to protected paths. Returns denial reason or null. */
+export function checkBashCommand(command: string): string | null {
+  // Check blocked command patterns
+  for (const { pattern, reason } of BLOCKED_COMMANDS) {
+    if (pattern.test(command)) {
+      return reason;
+    }
+  }
+
+  // Check redirect operators targeting protected paths
+  // Matches: > file, >> file, tee file, tee -a file
+  const redirectPattern = /(?:>{1,2}|tee(?:\s+-a)?)\s+["']?([^\s;"'|&]+)/g;
+  let match;
+  while ((match = redirectPattern.exec(command)) !== null) {
+    const target = match[1];
+    const rel = relativeToProject(target);
+    if (rel !== null && isProtectedPath(rel)) {
+      return `Redirect to protected path: ${rel}`;
+    }
+  }
+
+  return null;
+}
+
+// ---------------------------------------------------------------------------
+// canUseTool wrapper factory
+// ---------------------------------------------------------------------------
+
+type CanUseToolFn = (
+  toolName: string,
+  input: Record<string, unknown>,
+  options: { signal: AbortSignal; toolUseID: string }
+) => Promise<{ behavior: "allow" } | { behavior: "deny"; message: string }>;
+
+/**
+ * Build a canUseTool function that wraps existing MCP approval logic
+ * with role-based blocking.
+ *
+ * - admin: returns base canUseTool unchanged (no extra restrictions)
+ * - operator: checks Write/Edit file paths and Bash commands before delegating to base
+ * - viewer: returns undefined (viewer uses restricted allowedTools only)
+ */
+export function buildCanUseTool(
+  role: Role,
+  baseCanUseTool?: CanUseToolFn
+): CanUseToolFn | undefined {
+  if (role === "admin") return baseCanUseTool;
+  if (role === "viewer") return undefined;
+
+  // Operator: wrap with path/command checks
+  return async (toolName, input, options) => {
+    // Check Write/Edit file paths
+    if (toolName === "Write" || toolName === "Edit") {
+      const filePath = (input.file_path as string) || (input.filePath as string) || "";
+      if (filePath) {
+        const rel = relativeToProject(filePath);
+        if (rel !== null && isProtectedPath(rel)) {
+          return {
+            behavior: "deny" as const,
+            message: `Operators cannot modify protected file: ${rel}`,
+          };
+        }
+      }
+    }
+
+    // Check Bash commands
+    if (toolName === "Bash") {
+      const command = (input.command as string) || "";
+      const denial = checkBashCommand(command);
+      if (denial) {
+        return { behavior: "deny" as const, message: denial };
+      }
+    }
+
+    // Delegate to base canUseTool (MCP approval logic) if present
+    if (baseCanUseTool) {
+      return baseCanUseTool(toolName, input, options);
+    }
+
+    return { behavior: "allow" as const };
+  };
+}
+
+// ---------------------------------------------------------------------------
+// Allowed tools per role
+// ---------------------------------------------------------------------------
+
+const DEFAULT_TOOLS = ["Read", "Write", "Edit", "Bash", "Glob", "Grep", "WebSearch", "WebFetch", "Agent", "Mcp", "Task", "NotebookEdit", "AskUserQuestion"];
+const VIEWER_TOOLS = ["Read", "Glob", "Grep"];
+
+/** Return the tool list for a given role. */
+export function getAllowedToolsForRole(role: Role, agentTools?: string[]): string[] {
+  if (role === "viewer") return VIEWER_TOOLS;
+  // Operator and admin get the agent's configured tools or the full default set
+  return agentTools && agentTools.length > 0 ? agentTools : DEFAULT_TOOLS;
+}