pixelcrew 0.1.0

package/src/scaffold/templates.js

@@ -0,0 +1,384 @@
+/**
+ * Default templates for pixel-agents initialization (.pixel-agents/ and .pixel-dashboard/)
+ */
+
+export const DEFAULT_CONFIG = {
+  version: "0.1.0",
+  project: "my-orchestrated-app",
+  orchestrator: {
+    enabled: true,
+    maxConcurrentAgents: 4,
+    autoDecompose: true,
+    logEvents: true
+  },
+  agents: {
+    frontend: {
+      name: "Frontend Agent",
+      role: "UI/UX & Component Engineering",
+      sprite: "frontend",
+      color: "#00f0ff",
+      enabled: true,
+      maxTasks: 2,
+      skills: ["react", "nextjs", "tailwind", "ui-optimization"],
+      permissions: {
+        read: ["src/**", "components/**", "pages/**", "app/**", "public/**", "styles/**"],
+        write: ["src/components/**", "src/pages/**", "src/app/**", "src/styles/**"]
+      }
+    },
+    backend: {
+      name: "Backend Agent",
+      role: "API Architecture & Server Logic",
+      sprite: "backend",
+      color: "#ff007f",
+      enabled: true,
+      maxTasks: 2,
+      skills: ["api-architecture", "node", "express", "auth"],
+      permissions: {
+        read: ["src/api/**", "server/**", "routes/**", "controllers/**", "lib/**"],
+        write: ["src/api/**", "server/**", "routes/**", "controllers/**"]
+      }
+    },
+    database: {
+      name: "Database Agent",
+      role: "Data Modeling & Query Optimization",
+      sprite: "database",
+      color: "#ffd700",
+      enabled: true,
+      maxTasks: 1,
+      skills: ["postgresql", "prisma", "query-optimization", "indexing"],
+      permissions: {
+        read: ["prisma/**", "db/**", "migrations/**", "models/**"],
+        write: ["prisma/**", "db/**", "migrations/**"]
+      }
+    },
+    security: {
+      name: "Security Agent",
+      role: "Vulnerability Scanning & Hardening",
+      sprite: "security",
+      color: "#ff3344",
+      enabled: true,
+      maxTasks: 1,
+      skills: ["security-audit", "owasp", "auth-validation"],
+      permissions: {
+        read: ["**/*"],
+        write: ["security/**", ".env.example"]
+      }
+    },
+    performance: {
+      name: "Performance Agent",
+      role: "Speed Profiling & Core Web Vitals",
+      sprite: "performance",
+      color: "#39ff14",
+      enabled: true,
+      maxTasks: 1,
+      skills: ["performance-profiling", "lcp-optimization", "memory-profiling"],
+      permissions: {
+        read: ["**/*"],
+        write: ["src/**"]
+      }
+    },
+    qa: {
+      name: "QA Agent",
+      role: "End-to-End & Integration Testing",
+      sprite: "qa",
+      color: "#b026ff",
+      enabled: true,
+      maxTasks: 1,
+      dependsOn: ["frontend", "backend", "database"],
+      skills: ["testing", "e2e-testing", "regression-suite"],
+      permissions: {
+        read: ["**/*"],
+        write: ["tests/**", "__tests__/**", "cypress/**", "playwright/**"]
+      }
+    }
+  },
+  dashboard: {
+    enabled: true,
+    port: 4747,
+    theme: "pixel",
+    crtEffect: true,
+    soundEffects: true
+  }
+};
+
+export const INITIAL_STATE = {
+  status: "READY",
+  activeTask: "System initialized and waiting for commands",
+  startedAt: null,
+  completedAt: null,
+  orchestrator: {
+    state: "IDLE",
+    expression: "◉_◉",
+    activeSubtasks: 0,
+    totalSubtasks: 0,
+    progress: 0
+  },
+  agents: {
+    frontend: {
+      state: "IDLE",
+      expression: "●_●",
+      currentTask: "Awaiting tasks...",
+      progress: 0,
+      skillsStatus: {
+        "react": "idle",
+        "nextjs": "idle",
+        "tailwind": "idle",
+        "ui-optimization": "idle"
+      }
+    },
+    backend: {
+      state: "IDLE",
+      expression: "●_●",
+      currentTask: "Awaiting tasks...",
+      progress: 0,
+      skillsStatus: {
+        "api-architecture": "idle",
+        "node": "idle",
+        "express": "idle",
+        "auth": "idle"
+      }
+    },
+    database: {
+      state: "IDLE",
+      expression: "●_●",
+      currentTask: "Awaiting tasks...",
+      progress: 0,
+      skillsStatus: {
+        "postgresql": "idle",
+        "prisma": "idle",
+        "query-optimization": "idle",
+        "indexing": "idle"
+      }
+    },
+    security: {
+      state: "IDLE",
+      expression: "●_●",
+      currentTask: "Awaiting tasks...",
+      progress: 0,
+      skillsStatus: {
+        "security-audit": "idle",
+        "owasp": "idle",
+        "auth-validation": "idle"
+      }
+    },
+    performance: {
+      state: "IDLE",
+      expression: "●_●",
+      currentTask: "Awaiting tasks...",
+      progress: 0,
+      skillsStatus: {
+        "performance-profiling": "idle",
+        "lcp-optimization": "idle",
+        "memory-profiling": "idle"
+      }
+    },
+    qa: {
+      state: "IDLE",
+      expression: "●_●",
+      currentTask: "Awaiting tasks...",
+      progress: 0,
+      skillsStatus: {
+        "testing": "idle",
+        "e2e-testing": "idle",
+        "regression-suite": "idle"
+      }
+    }
+  }
+};
+
+export const AGENT_MARKDOWNS = {
+  "orchestrator.md": `---
+name: orchestrator
+role: Master Swarm Coordinator
+expression: ◉_◉
+description: Decomposes top-level goals into parallel subagent execution graphs, schedules tasks, and monitors state transitions.
+---
+
+# Orchestrator Agent
+
+## Core Directives
+1. Analyze top-level developer intent and decompose into directed acyclic graph (DAG) tasks.
+2. Delegate specialized subtasks to Frontend, Backend, Database, Security, Performance, and QA agents.
+3. Coordinate dependency resolution (e.g. Database schema before API controllers; API endpoints before UI binding; QA validation after UI/API completion).
+4. Stream structured \`AgentEvent\` logs in real-time to the pixel dashboard.
+`,
+
+  "frontend.md": `---
+name: frontend-agent
+role: Frontend Engineer
+sprite: frontend
+color: "#00f0ff"
+skills:
+  - react
+  - nextjs
+  - tailwind
+  - ui-optimization
+permissions:
+  read: ["src/**", "components/**", "pages/**", "app/**", "public/**", "styles/**"]
+  write: ["src/components/**", "src/pages/**", "src/app/**", "src/styles/**"]
+---
+
+# Frontend Agent
+
+Specialized in client-side architecture, modern UI design systems, responsive rendering, component refactoring, and state management.
+`,
+
+  "backend.md": `---
+name: backend-agent
+role: Backend & API Engineer
+sprite: backend
+color: "#ff007f"
+skills:
+  - api-architecture
+  - node
+  - express
+  - auth
+permissions:
+  read: ["src/api/**", "server/**", "routes/**", "controllers/**", "lib/**"]
+  write: ["src/api/**", "server/**", "routes/**", "controllers/**"]
+---
+
+# Backend Agent
+
+Specialized in REST/GraphQL/tRPC endpoints, middleware pipelines, authentication/authorization flows, and server-side business logic.
+`,
+
+  "database.md": `---
+name: database-agent
+role: Database & Data Architect
+sprite: database
+color: "#ffd700"
+skills:
+  - postgresql
+  - prisma
+  - query-optimization
+  - indexing
+permissions:
+  read: ["prisma/**", "db/**", "migrations/**", "models/**"]
+  write: ["prisma/**", "db/**", "migrations/**"]
+---
+
+# Database Agent
+
+Specialized in schema migrations, relational modeling, Prisma/SQL optimization, index creation, and transaction safety.
+`,
+
+  "security.md": `---
+name: security-agent
+role: Security & Hardening Sentinel
+sprite: security
+color: "#ff3344"
+skills:
+  - security-audit
+  - owasp
+  - auth-validation
+permissions:
+  read: ["**/*"]
+  write: ["security/**", ".env.example"]
+---
+
+# Security Agent
+
+Specialized in static vulnerability scanning, OWASP Top 10 mitigation, secret leakage checks, and cryptographic token verification.
+`,
+
+  "performance.md": `---
+name: performance-agent
+role: Performance & Profiling Engineer
+sprite: performance
+color: "#39ff14"
+skills:
+  - performance-profiling
+  - lcp-optimization
+  - memory-profiling
+permissions:
+  read: ["**/*"]
+  write: ["src/**"]
+---
+
+# Performance Agent
+
+Specialized in Core Web Vitals (LCP, INP, CLS), heap memory profiling, bundle size reduction, and asset caching strategies.
+`,
+
+  "qa.md": `---
+name: qa-agent
+role: QA & Testing Automation
+sprite: qa
+color: "#b026ff"
+dependsOn:
+  - frontend
+  - backend
+  - database
+skills:
+  - testing
+  - e22-testing
+  - regression-suite
+permissions:
+  read: ["**/*"]
+  write: ["tests/**", "__tests__/**", "cypress/**", "playwright/**"]
+---
+
+# QA Agent
+
+Specialized in integration testing, unit test coverage, end-to-end user journeys, and regression verification across all components.
+`
+};
+
+export const SKILL_MARKDOWNS = {
+  "codebase-intelligence.md": `# Codebase Intelligence & Context Adaptation Skill
+
+## Directives
+1. **Analyze First**: Inspect \`.pixel-agents/context.json\` and repository AST to understand existing dependencies, directory structure, and coding patterns.
+2. **Context-Aware Code Generation**: Adhere to existing naming conventions, TypeScript configs, ESLint rules, and import paths (e.g. \`@/components\` vs \`../components\`).
+3. **Cross-Agent Knowledge Sharing**: Share API schemas, database models, and route contracts across Frontend, Backend, and QA subagents.
+`,
+
+  "react.md": `# React Skill
+Techniques for component modularization, custom hooks, React Server Components (RSC), and concurrent rendering optimizations.
+`,
+
+  "nextjs.md": `# Next.js Skill
+App Router patterns, server actions, route handlers, metadata generation, and dynamic caching configurations.
+`,
+
+  "prisma.md": `# Prisma Skill
+Schema modeling, relation mappings, batch transaction queries, and efficient Prisma client lifecycle handling.
+`,
+
+  "postgresql.md": `# PostgreSQL Skill
+Index types (B-Tree, GIN, BRIN), EXPLAIN ANALYZE interpretation, connection pooling, and ACID constraint enforcement.
+`,
+
+  "drizzle.md": `# Drizzle ORM Skill
+Type-safe SQL schemas, relational queries, prepared statements, and zero-overhead database migrations.
+`,
+
+  "api-architecture.md": `# API Architecture Skill
+Standardized RESTful responses, idempotency keys, OpenAPI documentation, and rate-limiting middleware.
+`,
+
+  "query-optimization.md": `# Query Optimization Skill
+Elimination of N+1 query patterns, selective field projection, pagination with cursor indices, and subquery optimization.
+`,
+
+  "security-audit.md": `# Security Audit Skill
+Detection of SQL injection, XSS vectors, CSRF tokens, secure cookie headers, and RBAC permission checks.
+`,
+
+  "testing.md": `# Testing Skill
+Unit testing with Vitest/Jest, snapshot testing, mock boundaries, and deterministic assertion patterns.
+`,
+
+  "vitest.md": `# Vitest Skill
+High-performance unit and integration testing with ESM support, concurrent test suites, and in-source testing.
+`,
+
+  "playwright-e2e.md": `# Playwright E2E Skill
+End-to-end browser automation, trace recording, visual regression testing, and resilient locator strategies.
+`,
+
+  "performance-profiling.md": `# Performance Profiling Skill
+Flamegraph inspection, DOM layout thrashing identification, memory leak detection, and network payload minification.
+`
+};

package/src/server/server.js

@@ -0,0 +1,232 @@
+import http from 'node:http';
+import fs from 'node:fs/promises';
+import fsSync from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+export function createServer(engine, options = {}) {
+  const rootDir = engine.rootDir;
+  const dashboardDir = path.join(rootDir, '.pixel-dashboard');
+  const fallbackDashboardDir = fileURLToPath(new URL('../dashboard', import.meta.url));
+
+  const sseClients = new Set();
+
+  // Wire engine events to SSE clients
+  engine.on('agent_event', (event) => {
+    const payload = `event: agent_event\ndata: ${JSON.stringify(event)}\n\n`;
+    for (const client of sseClients) {
+      try {
+        client.write(payload);
+      } catch (err) {
+        sseClients.delete(client);
+      }
+    }
+  });
+
+  engine.on('state_change', (change) => {
+    const payload = `event: state_change\ndata: ${JSON.stringify(change)}\n\n`;
+    for (const client of sseClients) {
+      try {
+        client.write(payload);
+      } catch (err) {
+        sseClients.delete(client);
+      }
+    }
+  });
+
+  // Watch events.jsonl for direct external CLI writes (e.g. from Antigravity IDE)
+  let lastKnownEventCount = 0;
+  if (engine.eventsPath) {
+    try {
+      const initialContent = fsSync.readFileSync(engine.eventsPath, 'utf-8');
+      lastKnownEventCount = initialContent.trim().split('\n').filter(Boolean).length;
+    } catch {
+      lastKnownEventCount = 0;
+    }
+
+    fsSync.watchFile(engine.eventsPath, { interval: 300 }, async () => {
+      try {
+        const content = await fs.readFile(engine.eventsPath, 'utf-8');
+        const lines = content.trim().split('\n').filter(Boolean);
+        if (lines.length > lastKnownEventCount) {
+          const newLines = lines.slice(lastKnownEventCount);
+          lastKnownEventCount = lines.length;
+          for (const line of newLines) {
+            try {
+              const event = JSON.parse(line);
+              // Broadcast over SSE
+              const payload = `event: agent_event\ndata: ${JSON.stringify(event)}\n\n`;
+              for (const client of sseClients) {
+                try { client.write(payload); } catch {}
+              }
+            } catch {}
+          }
+        }
+      } catch {}
+    });
+  }
+
+  const server = http.createServer(async (req, res) => {
+    // Enable CORS
+    res.setHeader('Access-Control-Allow-Origin', '*');
+    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
+    res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
+
+    if (req.method === 'OPTIONS') {
+      res.writeHead(204);
+      res.end();
+      return;
+    }
+
+    const url = new URL(req.url, `http://${req.headers.host}`);
+    const pathname = url.pathname;
+
+    // Helper to send JSON
+    const sendJson = (statusCode, data) => {
+      res.writeHead(statusCode, { 'Content-Type': 'application/json' });
+      res.end(JSON.stringify(data));
+    };
+
+    // Helper to read request body
+    const readBody = () => {
+      return new Promise((resolve, reject) => {
+        let body = '';
+        req.on('data', (chunk) => {
+          body += chunk;
+          if (body.length > 1e6) {
+            req.destroy();
+            reject(new Error('Payload too large'));
+          }
+        });
+        req.on('end', () => {
+          try {
+            resolve(body ? JSON.parse(body) : {});
+          } catch (e) {
+            resolve({});
+          }
+        });
+        req.on('error', reject);
+      });
+    };
+
+    // API Routes
+    if (pathname === '/api/info' && req.method === 'GET') {
+      return sendJson(200, {
+        rootDir: engine.rootDir,
+        project: engine.getConfig()?.project || path.basename(engine.rootDir),
+        version: '0.1.0'
+      });
+    }
+
+    if (pathname === '/api/state' && req.method === 'GET') {
+      return sendJson(200, engine.getState());
+    }
+
+    if (pathname === '/api/config' && req.method === 'GET') {
+      return sendJson(200, engine.getConfig());
+    }
+
+    if (pathname === '/api/events' && req.method === 'GET') {
+      // Server-Sent Events stream
+      res.writeHead(200, {
+        'Content-Type': 'text/event-stream',
+        'Cache-Control': 'no-cache',
+        'Connection': 'keep-alive'
+      });
+
+      // Send initial history
+      const initialPayload = `event: init\ndata: ${JSON.stringify({
+        state: engine.getState(),
+        config: engine.getConfig(),
+        history: engine.getEvents()
+      })}\n\n`;
+      res.write(initialPayload);
+
+      sseClients.add(res);
+
+      req.on('close', () => {
+        sseClients.delete(res);
+      });
+      return;
+    }
+
+    if (pathname === '/api/task' && req.method === 'POST') {
+      const body = await readBody();
+      const prompt = body.prompt || body.task || 'Optimize application workflow';
+      // Asynchronously start task execution
+      engine.submitTask(prompt).catch(console.error);
+      return sendJson(200, { status: 'accepted', prompt });
+    }
+
+    if (pathname === '/api/emit' && req.method === 'POST') {
+      const body = await readBody();
+      const event = await engine.emitEvent(body);
+      return sendJson(200, { status: 'emitted', event });
+    }
+
+    if (pathname === '/api/reset' && req.method === 'POST') {
+      await engine.resetSwarm();
+      return sendJson(200, { status: 'reset' });
+    }
+
+    if (pathname === '/api/demo' && req.method === 'POST') {
+      const demoPrompt = 'Analyze CRM customer search bottlenecks & optimize Postgres Prisma queries with responsive UI';
+      engine.submitTask(demoPrompt).catch(console.error);
+      return sendJson(200, { status: 'demo_started', prompt: demoPrompt });
+    }
+
+    // Static Asset Serving
+    let filename = pathname === '/' ? 'index.html' : pathname.replace(/^\//, '');
+    let contentType = 'text/plain';
+
+    if (filename.endsWith('.html')) contentType = 'text/html; charset=utf-8';
+    else if (filename.endsWith('.css')) contentType = 'text/css; charset=utf-8';
+    else if (filename.endsWith('.js')) contentType = 'application/javascript; charset=utf-8';
+    else if (filename.endsWith('.json')) contentType = 'application/json';
+    else if (filename.endsWith('.png')) contentType = 'image/png';
+    else if (filename.endsWith('.svg')) contentType = 'image/svg+xml';
+    else if (filename.endsWith('.ico')) contentType = 'image/x-icon';
+
+    // Check project .pixel-dashboard first, then fallback to built-in
+    let filePath = path.join(dashboardDir, filename);
+    try {
+      await fs.access(filePath);
+    } catch {
+      filePath = path.join(fallbackDashboardDir, filename);
+      try {
+        await fs.access(filePath);
+      } catch {
+        res.writeHead(404, { 'Content-Type': 'text/plain' });
+        res.end('404 Not Found');
+        return;
+      }
+    }
+
+    try {
+      const fileData = await fs.readFile(filePath);
+      res.writeHead(200, { 'Content-Type': contentType });
+      res.end(fileData);
+    } catch (err) {
+      res.writeHead(500, { 'Content-Type': 'text/plain' });
+      res.end('500 Internal Server Error');
+    }
+  });
+
+  // Keep-alive heartbeat for SSE connections
+  const heartbeat = setInterval(() => {
+    for (const client of sseClients) {
+      try {
+        client.write(': keepalive\n\n');
+      } catch {
+        sseClients.delete(client);
+      }
+    }
+  }, 15000);
+  heartbeat.unref();
+
+  server.on('close', () => {
+    clearInterval(heartbeat);
+  });
+
+  return server;
+}