@marktoflow/gui 2.0.0-alpha.1

package/src/server/services/agents/copilot-provider.ts

@@ -0,0 +1,311 @@
+/**
+ * GitHub Copilot AI agent provider
+ * Uses the @github/copilot-sdk for AI capabilities
+ */
+
+import { createRequire } from 'node:module';
+import { parse as yamlParse } from 'yaml';
+import type {
+  AgentProvider,
+  AgentCapabilities,
+  AgentConfig,
+  PromptResult,
+  Workflow,
+} from './types.js';
+import { buildPrompt, generateSuggestions } from './prompts.js';
+
+// Polyfill require for ESM environments (needed by Copilot SDK dependencies)
+if (typeof globalThis.require === 'undefined') {
+  (globalThis as unknown as { require: NodeRequire }).require = createRequire(import.meta.url);
+}
+
+// Dynamic import types for Copilot SDK
+// Using loose types to handle SDK version differences
+interface CopilotClientConfig {
+  cliPath?: string;
+  cliUrl?: string;
+  autoStart?: boolean;
+  logLevel?: 'error' | 'info' | 'none' | 'warning' | 'debug' | 'all';
+}
+
+interface CopilotSessionOptions {
+  model?: string;
+  streaming?: boolean;
+  systemMessage?: { content: string };
+}
+
+interface CopilotSessionResponse {
+  data?: {
+    content?: string;
+    messageId?: string;
+  };
+}
+
+interface SessionEvent {
+  type: string;
+  data: {
+    deltaContent?: string;
+    content?: string;
+    message?: string;
+  };
+}
+
+export class CopilotProvider implements AgentProvider {
+  readonly id = 'copilot';
+  readonly name = 'GitHub Copilot';
+  readonly capabilities: AgentCapabilities = {
+    streaming: true,
+    toolUse: true,
+    codeExecution: true,
+    systemPrompts: true,
+    models: [
+      'gpt-4.1',
+      'gpt-4o',
+      'gpt-4-turbo',
+      'claude-3.5-sonnet',
+    ],
+  };
+
+  // Using 'unknown' to handle SDK version differences
+  private client: unknown = null;
+  private model: string = 'gpt-4.1';
+  private ready: boolean = false;
+  private error: string | undefined;
+  private cliPath?: string;
+  private cliUrl?: string;
+
+  async initialize(config: AgentConfig): Promise<void> {
+    try {
+      // Try to import the Copilot SDK (dynamic import with webpackIgnore to avoid bundling issues)
+      const sdkModule = await import(/* webpackIgnore: true */ '@github/copilot-sdk').catch(
+        () => null
+      );
+      if (!sdkModule || !sdkModule.CopilotClient) {
+        this.ready = false;
+        this.error = 'GitHub Copilot SDK not installed. Run: npm install @github/copilot-sdk';
+        return;
+      }
+      const { CopilotClient } = sdkModule;
+
+      this.cliPath = config.options?.cliPath as string;
+      this.cliUrl = config.baseUrl || (config.options?.cliUrl as string);
+
+      const clientConfig: CopilotClientConfig = {
+        autoStart: true,
+        logLevel: 'error',
+      };
+
+      if (this.cliUrl) {
+        clientConfig.cliUrl = this.cliUrl;
+      } else {
+        clientConfig.cliPath = this.cliPath || 'copilot';
+      }
+
+      this.client = new CopilotClient(clientConfig);
+
+      if (config.model) {
+        this.model = config.model;
+      }
+
+      // Start the client and test connectivity
+      try {
+        if (this.client) {
+          // Some SDK versions have start(), some don't (auto-start)
+          const client = this.client as { start?: () => Promise<void>; ping?: () => Promise<unknown> };
+          if (typeof client.start === 'function') {
+            await client.start();
+          }
+          if (typeof client.ping === 'function') {
+            await client.ping();
+          }
+          this.ready = true;
+          this.error = undefined;
+        }
+      } catch (pingError) {
+        this.ready = false;
+        this.error = `Cannot connect to GitHub Copilot CLI: ${pingError instanceof Error ? pingError.message : 'Unknown error'}`;
+      }
+    } catch (err) {
+      this.ready = false;
+      this.error = err instanceof Error ? err.message : 'Unknown error initializing Copilot';
+    }
+  }
+
+  isReady(): boolean {
+    return this.ready;
+  }
+
+  getStatus(): { ready: boolean; model?: string; error?: string } {
+    return {
+      ready: this.ready,
+      model: this.model,
+      error: this.error,
+    };
+  }
+
+  async processPrompt(
+    prompt: string,
+    workflow: Workflow,
+    context?: { selectedStepId?: string; recentHistory?: string[] }
+  ): Promise<PromptResult> {
+    if (!this.client || !this.ready) {
+      return {
+        explanation: 'GitHub Copilot provider not available.',
+        error: this.error || 'Provider not initialized',
+      };
+    }
+
+    try {
+      // Build context-aware prompts
+      const { systemPrompt, userPrompt } = buildPrompt(prompt, workflow, context);
+
+      const client = this.client as {
+        createSession: (opts: CopilotSessionOptions) => Promise<{
+          sendAndWait: (opts: { prompt: string }) => Promise<CopilotSessionResponse | null>;
+          destroy: () => Promise<void>;
+        }>;
+      };
+
+      const session = await client.createSession({
+        model: this.model,
+        systemMessage: { content: systemPrompt },
+      });
+
+      try {
+        const response = await session.sendAndWait({ prompt: userPrompt });
+        const responseText = response?.data?.content || '';
+        return this.parseAIResponse(responseText, workflow);
+      } finally {
+        await session.destroy();
+      }
+    } catch (err) {
+      return {
+        explanation: '',
+        error: err instanceof Error ? err.message : 'Unknown error',
+      };
+    }
+  }
+
+  async getSuggestions(workflow: Workflow, selectedStepId?: string): Promise<string[]> {
+    return generateSuggestions(workflow, selectedStepId);
+  }
+
+  async streamPrompt(
+    prompt: string,
+    workflow: Workflow,
+    onChunk: (chunk: string) => void,
+    context?: { selectedStepId?: string; recentHistory?: string[] }
+  ): Promise<PromptResult> {
+    if (!this.client || !this.ready) {
+      return this.processPrompt(prompt, workflow, context);
+    }
+
+    const { systemPrompt, userPrompt } = buildPrompt(prompt, workflow, context);
+    let fullResponse = '';
+
+    try {
+      const client = this.client as {
+        createSession: (opts: CopilotSessionOptions) => Promise<{
+          send: (opts: { prompt: string }) => Promise<void>;
+          on: (callback: (event: SessionEvent) => void) => void;
+          destroy: () => Promise<void>;
+        }>;
+      };
+
+      const session = await client.createSession({
+        model: this.model,
+        streaming: true,
+        systemMessage: { content: systemPrompt },
+      });
+
+      return new Promise((resolve, reject) => {
+        session.on((event: SessionEvent) => {
+          if (event.type === 'assistant.message_delta') {
+            const chunk = event.data.deltaContent || '';
+            fullResponse += chunk;
+            onChunk(chunk);
+          } else if (event.type === 'assistant.message') {
+            fullResponse = event.data.content || fullResponse;
+          } else if (event.type === 'session.idle') {
+            session
+              .destroy()
+              .then(() => resolve(this.parseAIResponse(fullResponse, workflow)))
+              .catch(reject);
+          } else if (event.type === 'session.error') {
+            reject(new Error(event.data.message || 'Session error'));
+          }
+        });
+
+        session.send({ prompt: userPrompt }).catch(reject);
+      });
+    } catch (err) {
+      return {
+        explanation: '',
+        error: err instanceof Error ? err.message : 'Unknown error',
+      };
+    }
+  }
+
+  async cancel(): Promise<void> {
+    if (this.client) {
+      const client = this.client as { stop?: () => Promise<unknown> };
+      if (typeof client.stop === 'function') {
+        await client.stop();
+      }
+    }
+  }
+
+  private parseAIResponse(responseText: string, originalWorkflow: Workflow): PromptResult {
+    const yamlMatch = responseText.match(/```yaml\n([\s\S]*?)\n```/);
+    let modifiedWorkflow: Workflow | undefined;
+    let explanation = responseText;
+
+    if (yamlMatch) {
+      try {
+        const parsedYaml = yamlParse(yamlMatch[1]);
+        if (parsedYaml && (parsedYaml.steps || parsedYaml.metadata)) {
+          modifiedWorkflow = parsedYaml as Workflow;
+          const explanationMatch = responseText.match(/^([\s\S]*?)```yaml/);
+          if (explanationMatch) {
+            explanation = explanationMatch[1].trim();
+          }
+        }
+      } catch {
+        // Failed to parse YAML
+      }
+    }
+
+    let diff: string | undefined;
+    if (modifiedWorkflow) {
+      diff = this.generateDiff(originalWorkflow, modifiedWorkflow);
+    }
+
+    return { explanation, workflow: modifiedWorkflow, diff };
+  }
+
+  private generateDiff(original: Workflow, modified: Workflow): string {
+    const originalStepIds = new Set(original.steps?.map((s) => s.id) || []);
+    const modifiedStepIds = new Set(modified.steps?.map((s) => s.id) || []);
+
+    const added = modified.steps?.filter((s) => !originalStepIds.has(s.id)) || [];
+    const removed = original.steps?.filter((s) => !modifiedStepIds.has(s.id)) || [];
+
+    let diff = '';
+    if (added.length > 0) {
+      diff += `+ Added ${added.length} step(s): ${added.map((s) => s.name || s.id).join(', ')}\n`;
+    }
+    if (removed.length > 0) {
+      diff += `- Removed ${removed.length} step(s): ${removed.map((s) => s.name || s.id).join(', ')}\n`;
+    }
+
+    return diff || 'No structural changes detected';
+  }
+}
+
+export function createCopilotProvider(config?: AgentConfig): CopilotProvider {
+  const provider = new CopilotProvider();
+  if (config) {
+    provider.initialize(config);
+  }
+  return provider;
+}

package/src/server/services/agents/demo-provider.ts

@@ -0,0 +1,184 @@
+/**
+ * Demo AI agent provider
+ * Provides simulated responses for testing without an API key
+ */
+
+import type {
+  AgentProvider,
+  AgentCapabilities,
+  AgentConfig,
+  PromptResult,
+  Workflow,
+} from './types.js';
+import { generateSuggestions, AVAILABLE_SERVICES } from './prompts.js';
+
+export class DemoProvider implements AgentProvider {
+  readonly id = 'demo';
+  readonly name = 'Demo Mode (No API)';
+  readonly capabilities: AgentCapabilities = {
+    streaming: false,
+    toolUse: false,
+    codeExecution: false,
+    systemPrompts: false,
+    models: ['demo'],
+  };
+
+  private ready: boolean = true;
+
+  async initialize(_config: AgentConfig): Promise<void> {
+    this.ready = true;
+  }
+
+  isReady(): boolean {
+    return this.ready;
+  }
+
+  getStatus(): { ready: boolean; model?: string; error?: string } {
+    return { ready: true, model: 'demo' };
+  }
+
+  async processPrompt(prompt: string, workflow: Workflow): Promise<PromptResult> {
+    const promptLower = prompt.toLowerCase();
+    let explanation = '';
+    const modifiedWorkflow = { ...workflow, steps: [...(workflow.steps || [])] };
+
+    // Detect which service is being requested
+    const serviceMatch = Object.keys(AVAILABLE_SERVICES).find((s) =>
+      promptLower.includes(s.toLowerCase())
+    );
+
+    // Simulate different responses based on prompt patterns
+    if (promptLower.includes('add') && serviceMatch) {
+      const service = AVAILABLE_SERVICES[serviceMatch as keyof typeof AVAILABLE_SERVICES];
+      const action = service.commonActions[0];
+      const stepId = `${serviceMatch}-${Date.now().toString(36)}`;
+
+      const newStep: any = {
+        id: stepId,
+        name: `${serviceMatch.charAt(0).toUpperCase() + serviceMatch.slice(1)} Action`,
+        action: `${serviceMatch}.${action}`,
+        inputs: this.generateDefaultInputs(serviceMatch, action),
+        outputVariable: `${serviceMatch}_result`,
+      };
+
+      modifiedWorkflow.steps.push(newStep);
+      explanation = `Added a ${serviceMatch} step using ${serviceMatch}.${action}. The step is configured with default inputs that you should customize.`;
+    } else if (promptLower.includes('error') || promptLower.includes('retry') || promptLower.includes('handling')) {
+      const maxRetries = promptLower.match(/(\d+)\s*(retry|retries|times)/)?.[1] || '3';
+      modifiedWorkflow.steps = modifiedWorkflow.steps.map((step) => ({
+        ...step,
+        errorHandling: {
+          action: 'retry' as const,
+          maxRetries: parseInt(maxRetries),
+          retryDelay: 1000,
+        },
+      }));
+      explanation = `Added error handling with ${maxRetries} retries to all ${modifiedWorkflow.steps.length} steps.`;
+    } else if (promptLower.includes('condition') || promptLower.includes('if') || promptLower.includes('when')) {
+      if (modifiedWorkflow.steps.length > 0) {
+        const condition = this.extractCondition(promptLower);
+        modifiedWorkflow.steps[modifiedWorkflow.steps.length - 1] = {
+          ...modifiedWorkflow.steps[modifiedWorkflow.steps.length - 1],
+          conditions: [condition],
+        };
+        explanation = `Added condition "${condition}" to the last step.`;
+      } else {
+        explanation = 'No steps to add conditions to. Please add some steps first.';
+      }
+    } else if (promptLower.includes('remove') || promptLower.includes('delete')) {
+      if (modifiedWorkflow.steps.length > 0) {
+        // Try to find a specific step to remove
+        const stepNameMatch = promptLower.match(/(?:remove|delete)\s+(?:the\s+)?["']?([^"']+)["']?\s+step/);
+        if (stepNameMatch) {
+          const targetName = stepNameMatch[1].toLowerCase();
+          const index = modifiedWorkflow.steps.findIndex(
+            (s) =>
+              s.id.toLowerCase().includes(targetName) ||
+              (s.name && s.name.toLowerCase().includes(targetName))
+          );
+          if (index >= 0) {
+            const removed = modifiedWorkflow.steps.splice(index, 1)[0];
+            explanation = `Removed step "${removed.name || removed.id}".`;
+          } else {
+            const removed = modifiedWorkflow.steps.pop();
+            explanation = `Could not find a step matching "${targetName}". Removed the last step "${removed?.name || removed?.id}" instead.`;
+          }
+        } else {
+          const removed = modifiedWorkflow.steps.pop();
+          explanation = `Removed the last step "${removed?.name || removed?.id}".`;
+        }
+      } else {
+        explanation = 'No steps to remove.';
+      }
+    } else if (promptLower.includes('notification') || promptLower.includes('notify')) {
+      modifiedWorkflow.steps.push({
+        id: `notify-${Date.now().toString(36)}`,
+        name: 'Send Notification',
+        action: 'slack.chat.postMessage',
+        inputs: {
+          channel: '#notifications',
+          text: 'Workflow "{{ workflow.name }}" completed successfully!',
+        },
+        outputVariable: 'notification_result',
+      });
+      explanation = 'Added a Slack notification step at the end of the workflow.';
+    } else if (promptLower.includes('http') || promptLower.includes('api') || promptLower.includes('request')) {
+      const method = promptLower.includes('post') ? 'POST' : promptLower.includes('put') ? 'PUT' : 'GET';
+      modifiedWorkflow.steps.push({
+        id: `http-${Date.now().toString(36)}`,
+        name: `HTTP ${method} Request`,
+        action: 'http.request',
+        inputs: {
+          method,
+          url: '{{ inputs.api_url }}',
+          headers: { 'Content-Type': 'application/json' },
+        },
+        outputVariable: 'api_response',
+      });
+      explanation = `Added an HTTP ${method} request step. Configure the URL and any required headers.`;
+    } else {
+      explanation = `Demo mode: I understood "${prompt}". In production mode with Claude or Ollama, this would intelligently analyze your request and modify the workflow accordingly. For now, try commands like:\n- "Add a Slack notification"\n- "Add error handling with 5 retries"\n- "Add a condition to run only on success"\n- "Remove the last step"`;
+    }
+
+    return {
+      explanation,
+      workflow: modifiedWorkflow,
+    };
+  }
+
+  async getSuggestions(workflow: Workflow, selectedStepId?: string): Promise<string[]> {
+    // Use the shared suggestions generator
+    return generateSuggestions(workflow, selectedStepId);
+  }
+
+  private generateDefaultInputs(service: string, _action: string): Record<string, unknown> {
+    const defaults: Record<string, Record<string, unknown>> = {
+      slack: { channel: '#general', text: 'Hello from Marktoflow!' },
+      github: { owner: '{{ inputs.owner }}', repo: '{{ inputs.repo }}' },
+      jira: { projectKey: '{{ inputs.project }}', summary: 'New Issue' },
+      gmail: { to: '{{ inputs.email }}', subject: 'Notification', body: 'Hello!' },
+      http: { method: 'GET', url: '{{ inputs.url }}' },
+      linear: { title: 'New Issue', teamId: '{{ inputs.team_id }}' },
+      notion: { parent: { database_id: '{{ inputs.database_id }}' } },
+    };
+    return defaults[service] || {};
+  }
+
+  private extractCondition(prompt: string): string {
+    // Try to extract a meaningful condition from the prompt
+    if (prompt.includes('success')) {
+      return '{{ previous_step.success === true }}';
+    }
+    if (prompt.includes('fail')) {
+      return '{{ previous_step.success === false }}';
+    }
+    if (prompt.includes('production')) {
+      return '{{ inputs.environment === "production" }}';
+    }
+    return '{{ previous_step.success === true }}';
+  }
+}
+
+export function createDemoProvider(): DemoProvider {
+  return new DemoProvider();
+}

package/src/server/services/agents/index.ts

@@ -0,0 +1,31 @@
+/**
+ * Agent Providers Module
+ *
+ * This module provides a unified interface for AI agent providers,
+ * allowing the GUI to work with different backends:
+ *
+ * - Claude (Anthropic) - Full-featured AI with streaming support
+ * - Ollama (Local) - Local LLM support via Ollama
+ * - Demo Mode - Simulated responses for testing
+ *
+ * Usage:
+ * ```typescript
+ * import { getAgentRegistry } from './agents';
+ *
+ * const registry = getAgentRegistry();
+ * await registry.autoDetectProvider();
+ *
+ * const result = await registry.processPrompt(
+ *   "Add a Slack notification step",
+ *   currentWorkflow
+ * );
+ * ```
+ */
+
+export * from './types.js';
+export * from './registry.js';
+export * from './prompts.js';
+export { ClaudeProvider, createClaudeProvider } from './claude-provider.js';
+export { CopilotProvider, createCopilotProvider } from './copilot-provider.js';
+export { DemoProvider, createDemoProvider } from './demo-provider.js';
+export { OllamaProvider, createOllamaProvider } from './ollama-provider.js';