@codewithdan/zingit 0.0.1

package/server/dist/agents/copilot.js

@@ -0,0 +1,168 @@
+// server/src/agents/copilot.ts
+// Agent that uses GitHub Copilot SDK
+import { CopilotClient } from '@github/copilot-sdk';
+import { BaseAgent } from './base.js';
+import { promises as fs } from 'fs';
+import * as path from 'path';
+import * as os from 'os';
+import { randomUUID } from 'crypto';
+export class CopilotAgent extends BaseAgent {
+    name = 'copilot';
+    model;
+    client = null;
+    constructor() {
+        super();
+        this.model = process.env.COPILOT_MODEL || 'claude-sonnet-4-20250514';
+    }
+    async start() {
+        // Initialize the Copilot client
+        this.client = new CopilotClient({
+            logLevel: 'info',
+            autoRestart: true,
+        });
+        await this.client.start();
+        console.log(`✓ Copilot SDK initialized (model: ${this.model})`);
+    }
+    async stop() {
+        if (this.client) {
+            await this.client.stop();
+            this.client = null;
+        }
+    }
+    async createSession(ws, projectDir) {
+        if (!this.client) {
+            throw new Error('Copilot client not initialized');
+        }
+        const send = (data) => {
+            if (ws.readyState === ws.OPEN) {
+                ws.send(JSON.stringify(data));
+            }
+        };
+        // Create a Copilot session with streaming enabled
+        // Note: Copilot SDK doesn't support cwd in session config, so we include it in the system message
+        const session = await this.client.createSession({
+            model: this.model,
+            streaming: true,
+            systemMessage: {
+                mode: 'append',
+                content: `
+<context>
+You are a UI debugging assistant working in the project directory: ${projectDir}
+
+When given annotations about UI elements:
+1. Search for the corresponding code using the selectors and HTML context provided
+2. Make the requested changes in the project at ${projectDir}
+3. Be thorough in finding the right files and making precise edits
+
+When screenshots are provided, use them to:
+- Better understand the visual context and styling of the elements
+- Identify the exact appearance that needs to be changed
+- Verify you're targeting the correct element based on its visual representation
+
+IMPORTANT: Format all responses using markdown:
+- Use **bold** for emphasis on important points
+- Use numbered lists for sequential steps (1. 2. 3.)
+- Use bullet points for non-sequential items
+- Use code blocks with \`\`\`language syntax for code examples
+- Use inline \`code\` for file paths, selectors, and technical terms
+</context>
+`
+            },
+            onPermissionRequest: async (request) => {
+                // Auto-approve read/write operations for file edits
+                if (request.kind === 'read' || request.kind === 'write') {
+                    return { kind: 'approved' };
+                }
+                return { kind: 'approved' };
+            },
+        });
+        // Track temp files for cleanup on session destroy (prevents race condition)
+        const sessionTempFiles = [];
+        // Subscribe to streaming events and capture unsubscribe function
+        const unsubscribe = session.on((event) => {
+            switch (event.type) {
+                case 'assistant.message_delta':
+                    // Streaming chunk
+                    send({ type: 'delta', content: event.data.deltaContent });
+                    break;
+                case 'assistant.message':
+                    // Final message (we already sent deltas, so just log)
+                    break;
+                case 'tool.execution_start':
+                    send({ type: 'tool_start', tool: event.data.toolName });
+                    break;
+                case 'tool.execution_complete':
+                    send({ type: 'tool_end', tool: event.data.toolCallId });
+                    break;
+                case 'session.idle':
+                    send({ type: 'idle' });
+                    break;
+                case 'session.error':
+                    send({ type: 'error', message: event.data.message });
+                    break;
+            }
+        });
+        return {
+            send: async (msg) => {
+                try {
+                    // If images are provided, save them as temp files and attach them
+                    // Copilot SDK supports file attachments for images
+                    const attachments = [];
+                    if (msg.images && msg.images.length > 0) {
+                        const tempDir = os.tmpdir();
+                        for (let i = 0; i < msg.images.length; i++) {
+                            const img = msg.images[i];
+                            // Use UUID to avoid filename collisions
+                            const ext = img.mediaType.split('/')[1] || 'png';
+                            const tempPath = path.join(tempDir, `zingit-screenshot-${randomUUID()}.${ext}`);
+                            // Decode base64 to buffer with error handling
+                            let buffer;
+                            try {
+                                buffer = Buffer.from(img.base64, 'base64');
+                            }
+                            catch (decodeErr) {
+                                console.warn(`ZingIt: Failed to decode base64 for image ${i + 1}:`, decodeErr);
+                                continue; // Skip this image
+                            }
+                            // Save with restrictive permissions (owner read/write only)
+                            await fs.writeFile(tempPath, buffer, { mode: 0o600 });
+                            sessionTempFiles.push(tempPath);
+                            attachments.push({
+                                type: 'file',
+                                path: tempPath,
+                                displayName: img.label || `Screenshot ${i + 1}`
+                            });
+                        }
+                    }
+                    await session.sendAndWait({
+                        prompt: msg.prompt,
+                        attachments: attachments.length > 0 ? attachments : undefined
+                    });
+                }
+                catch (err) {
+                    send({ type: 'error', message: err.message });
+                }
+                // Note: Temp files cleaned up on session destroy to avoid race condition
+            },
+            destroy: async () => {
+                try {
+                    unsubscribe();
+                    await session.destroy();
+                }
+                finally {
+                    // Clean up all temp files even if destroy() fails
+                    for (const tempPath of sessionTempFiles) {
+                        try {
+                            await fs.unlink(tempPath);
+                        }
+                        catch (cleanupErr) {
+                            // Ignore errors (file may already be deleted)
+                            console.warn(`ZingIt: Failed to clean up temp file ${tempPath}:`, cleanupErr.message);
+                        }
+                    }
+                    sessionTempFiles.length = 0; // Clear the array
+                }
+            }
+        };
+    }
+}

package/server/dist/handlers/messageHandlers.d.ts

@@ -0,0 +1,57 @@
+import type { WebSocket } from 'ws';
+import type { Agent, WSIncomingMessage, WSOutgoingMessage } from '../types.js';
+import type { GitManager, GitManagerError as GitManagerErrorType } from '../services/git-manager.js';
+export { GitManagerError } from '../services/git-manager.js';
+export interface ConnectionState {
+    session: any | null;
+    agentName: string | null;
+    agent: Agent | null;
+    gitManager: GitManager | null;
+    currentCheckpointId: string | null;
+}
+export interface MessageHandlerDeps {
+    projectDir: string;
+    detectAgents: () => Promise<any[]>;
+    getAgent: (name: string) => Promise<Agent>;
+}
+export declare function sendMessage(ws: WebSocket, msg: WSOutgoingMessage): void;
+/**
+ * Handle get_agents message
+ */
+export declare function handleGetAgents(ws: WebSocket, deps: MessageHandlerDeps): Promise<void>;
+/**
+ * Handle select_agent message
+ */
+export declare function handleSelectAgent(ws: WebSocket, state: ConnectionState, msg: WSIncomingMessage, deps: MessageHandlerDeps): Promise<void>;
+/**
+ * Handle batch message
+ */
+export declare function handleBatch(ws: WebSocket, state: ConnectionState, msg: WSIncomingMessage, deps: MessageHandlerDeps): Promise<void>;
+/**
+ * Handle message (follow-up message to agent)
+ */
+export declare function handleMessage(ws: WebSocket, state: ConnectionState, msg: WSIncomingMessage): Promise<void>;
+/**
+ * Handle reset message
+ */
+export declare function handleReset(ws: WebSocket, state: ConnectionState): Promise<void>;
+/**
+ * Handle stop message
+ */
+export declare function handleStop(ws: WebSocket, state: ConnectionState): Promise<void>;
+/**
+ * Handle get_history message
+ */
+export declare function handleGetHistory(ws: WebSocket, state: ConnectionState): Promise<void>;
+/**
+ * Handle undo message
+ */
+export declare function handleUndo(ws: WebSocket, state: ConnectionState, GitManagerError: typeof GitManagerErrorType): Promise<void>;
+/**
+ * Handle revert_to message
+ */
+export declare function handleRevertTo(ws: WebSocket, state: ConnectionState, msg: WSIncomingMessage, GitManagerError: typeof GitManagerErrorType): Promise<void>;
+/**
+ * Handle clear_history message
+ */
+export declare function handleClearHistory(ws: WebSocket, state: ConnectionState): Promise<void>;

package/server/dist/handlers/messageHandlers.js

@@ -0,0 +1,329 @@
+// server/src/handlers/messageHandlers.ts
+import { validateBatchData } from '../validation/payload.js';
+// Re-export GitManagerError for instanceof checks
+export { GitManagerError } from '../services/git-manager.js';
+// Helper to send messages
+export function sendMessage(ws, msg) {
+    if (ws.readyState === ws.OPEN) {
+        ws.send(JSON.stringify(msg));
+    }
+}
+/**
+ * Handle get_agents message
+ */
+export async function handleGetAgents(ws, deps) {
+    const agents = await deps.detectAgents();
+    sendMessage(ws, { type: 'agents', agents });
+}
+/**
+ * Handle select_agent message
+ */
+export async function handleSelectAgent(ws, state, msg, deps) {
+    if (!msg.agent) {
+        sendMessage(ws, { type: 'agent_error', message: 'No agent specified' });
+        return;
+    }
+    // Check if agent is available
+    const agentInfo = (await deps.detectAgents()).find(a => a.name === msg.agent);
+    if (!agentInfo) {
+        sendMessage(ws, { type: 'agent_error', message: `Unknown agent: ${msg.agent}` });
+        return;
+    }
+    if (!agentInfo.available) {
+        sendMessage(ws, {
+            type: 'agent_error',
+            message: agentInfo.reason || `Agent ${msg.agent} is not available`,
+            agent: msg.agent
+        });
+        return;
+    }
+    // Destroy existing session if switching agents
+    if (state.session && state.agentName !== msg.agent) {
+        try {
+            await state.session.destroy();
+        }
+        catch (err) {
+            console.error('Error destroying session during agent switch:', err.message);
+        }
+        finally {
+            state.session = null;
+        }
+    }
+    // Initialize the agent
+    try {
+        state.agent = await deps.getAgent(msg.agent);
+        state.agentName = msg.agent;
+        sendMessage(ws, {
+            type: 'agent_selected',
+            agent: msg.agent,
+            model: state.agent.model,
+            projectDir: deps.projectDir
+        });
+    }
+    catch (err) {
+        sendMessage(ws, {
+            type: 'agent_error',
+            message: `Failed to initialize ${msg.agent}: ${err.message}`,
+            agent: msg.agent
+        });
+    }
+}
+/**
+ * Handle batch message
+ */
+export async function handleBatch(ws, state, msg, deps) {
+    if (!msg.data)
+        return;
+    // Validate batch data
+    const validation = validateBatchData(msg.data);
+    if (!validation.valid) {
+        sendMessage(ws, { type: 'error', message: validation.error || 'Invalid batch data' });
+        return;
+    }
+    // Use sanitized data
+    const batchData = validation.sanitizedData;
+    // Check if agent is selected
+    if (!state.agentName || !state.agent) {
+        // If agent specified in batch message, try to select it
+        if (msg.agent) {
+            const agentInfo = (await deps.detectAgents()).find(a => a.name === msg.agent);
+            if (!agentInfo?.available) {
+                sendMessage(ws, {
+                    type: 'agent_error',
+                    message: `Agent ${msg.agent} is not available. Please select a different agent.`
+                });
+                return;
+            }
+            try {
+                state.agent = await deps.getAgent(msg.agent);
+                state.agentName = msg.agent;
+            }
+            catch (err) {
+                sendMessage(ws, { type: 'error', message: err.message });
+                return;
+            }
+        }
+        else {
+            sendMessage(ws, { type: 'error', message: 'No agent selected. Please select an agent first.' });
+            return;
+        }
+    }
+    // Use client-specified projectDir, or fall back to server default
+    const projectDir = batchData.projectDir || deps.projectDir;
+    // Create a checkpoint before AI modifications (if git manager available)
+    if (state.gitManager) {
+        try {
+            const checkpoint = await state.gitManager.createCheckpoint({
+                annotations: batchData.annotations,
+                pageUrl: batchData.pageUrl,
+                pageTitle: batchData.pageTitle,
+                agentName: state.agentName,
+            });
+            state.currentCheckpointId = checkpoint.id;
+            sendMessage(ws, {
+                type: 'checkpoint_created',
+                checkpoint: {
+                    id: checkpoint.id,
+                    timestamp: checkpoint.timestamp,
+                    annotations: checkpoint.annotations,
+                    filesModified: 0,
+                    linesChanged: 0,
+                    agentName: checkpoint.agentName,
+                    pageUrl: checkpoint.pageUrl,
+                    status: 'pending',
+                    canUndo: false,
+                },
+            });
+        }
+        catch (err) {
+            // Log but don't block - checkpoint is optional
+            console.warn('Failed to create checkpoint:', err.message);
+        }
+    }
+    if (!state.session) {
+        state.session = await state.agent.createSession(ws, projectDir);
+    }
+    const prompt = state.agent.formatPrompt(batchData, projectDir);
+    const images = state.agent.extractImages(batchData);
+    sendMessage(ws, { type: 'processing' });
+    await state.session.send({ prompt, images: images.length > 0 ? images : undefined });
+    // Finalize checkpoint after processing
+    if (state.gitManager && state.currentCheckpointId) {
+        try {
+            await state.gitManager.finalizeCheckpoint(state.currentCheckpointId);
+            // Send updated checkpoint info
+            const checkpoints = await state.gitManager.getHistory();
+            const updatedCheckpoint = checkpoints.find((c) => c.id === state.currentCheckpointId);
+            if (updatedCheckpoint) {
+                sendMessage(ws, {
+                    type: 'checkpoint_created',
+                    checkpoint: updatedCheckpoint,
+                });
+            }
+        }
+        catch (err) {
+            console.warn('Failed to finalize checkpoint:', err.message);
+        }
+        state.currentCheckpointId = null;
+    }
+}
+/**
+ * Handle message (follow-up message to agent)
+ */
+export async function handleMessage(ws, state, msg) {
+    if (state.session && msg.content) {
+        try {
+            console.log(`[ZingIt] Sending follow-up message: "${msg.content.substring(0, 50)}..."`);
+            sendMessage(ws, { type: 'processing' });
+            // Add timeout to detect if SDK hangs
+            const timeoutMs = 120000; // 2 minutes
+            const sendPromise = state.session.send({ prompt: msg.content });
+            const timeoutPromise = new Promise((_, reject) => setTimeout(() => reject(new Error('Agent response timeout')), timeoutMs));
+            await Promise.race([sendPromise, timeoutPromise]);
+            console.log('[ZingIt] Follow-up message sent to agent');
+        }
+        catch (err) {
+            console.error('[ZingIt] Error sending follow-up message:', err.message);
+            sendMessage(ws, { type: 'error', message: `Failed to send message: ${err.message}` });
+        }
+    }
+    else if (!state.session) {
+        console.warn('[ZingIt] No active session for follow-up message');
+        sendMessage(ws, { type: 'error', message: 'No active session. Please create annotations first.' });
+    }
+}
+/**
+ * Handle reset message
+ */
+export async function handleReset(ws, state) {
+    if (state.session) {
+        try {
+            await state.session.destroy();
+        }
+        catch (err) {
+            console.error('Error destroying session during reset:', err.message);
+        }
+        finally {
+            state.session = null;
+        }
+    }
+    sendMessage(ws, { type: 'reset_complete' });
+}
+/**
+ * Handle stop message
+ */
+export async function handleStop(ws, state) {
+    // Stop current agent execution
+    if (state.session) {
+        console.log('Stopping agent execution...');
+        try {
+            await state.session.destroy();
+        }
+        catch (err) {
+            console.error('Error destroying session during stop:', err.message);
+        }
+        finally {
+            state.session = null;
+        }
+    }
+    sendMessage(ws, { type: 'idle' });
+}
+/**
+ * Handle get_history message
+ */
+export async function handleGetHistory(ws, state) {
+    if (!state.gitManager) {
+        sendMessage(ws, { type: 'error', message: 'Git manager not initialized' });
+        return;
+    }
+    try {
+        const checkpoints = await state.gitManager.getHistory();
+        sendMessage(ws, { type: 'history', checkpoints });
+    }
+    catch (err) {
+        sendMessage(ws, {
+            type: 'error',
+            message: `Failed to get history: ${err.message}`,
+        });
+    }
+}
+/**
+ * Handle undo message
+ */
+export async function handleUndo(ws, state, GitManagerError) {
+    if (!state.gitManager) {
+        sendMessage(ws, { type: 'error', message: 'Git manager not initialized' });
+        return;
+    }
+    try {
+        const result = await state.gitManager.undoLastCheckpoint();
+        state.currentCheckpointId = null;
+        sendMessage(ws, {
+            type: 'undo_complete',
+            checkpointId: result.checkpointId,
+            filesReverted: result.filesReverted,
+        });
+    }
+    catch (err) {
+        if (err instanceof GitManagerError) {
+            sendMessage(ws, { type: 'error', message: err.message });
+        }
+        else {
+            sendMessage(ws, {
+                type: 'error',
+                message: `Undo failed: ${err.message}`,
+            });
+        }
+    }
+}
+/**
+ * Handle revert_to message
+ */
+export async function handleRevertTo(ws, state, msg, GitManagerError) {
+    if (!state.gitManager) {
+        sendMessage(ws, { type: 'error', message: 'Git manager not initialized' });
+        return;
+    }
+    if (!msg.checkpointId) {
+        sendMessage(ws, { type: 'error', message: 'No checkpoint ID specified' });
+        return;
+    }
+    try {
+        const result = await state.gitManager.revertToCheckpoint(msg.checkpointId);
+        sendMessage(ws, {
+            type: 'revert_complete',
+            checkpointId: msg.checkpointId,
+            filesReverted: result.filesReverted,
+        });
+    }
+    catch (err) {
+        if (err instanceof GitManagerError) {
+            sendMessage(ws, { type: 'error', message: err.message });
+        }
+        else {
+            sendMessage(ws, {
+                type: 'error',
+                message: `Revert failed: ${err.message}`,
+            });
+        }
+    }
+}
+/**
+ * Handle clear_history message
+ */
+export async function handleClearHistory(ws, state) {
+    if (!state.gitManager) {
+        sendMessage(ws, { type: 'error', message: 'Git manager not initialized' });
+        return;
+    }
+    try {
+        await state.gitManager.clearHistory();
+        sendMessage(ws, { type: 'history_cleared' });
+    }
+    catch (err) {
+        sendMessage(ws, {
+            type: 'error',
+            message: `Failed to clear history: ${err.message}`,
+        });
+    }
+}

package/server/dist/index.d.ts

@@ -0,0 +1 @@
+export {};