@marktoflow/gui 2.0.0-alpha.1 → 2.0.0-alpha.2

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

@@ -0,0 +1,398 @@
+/**
+ * OpenAI Codex AI agent provider
+ * Uses the @openai/codex-sdk for AI capabilities
+ */
+
+import { parse as yamlParse } from 'yaml';
+import type {
+  AgentProvider,
+  AgentCapabilities,
+  AgentConfig,
+  PromptResult,
+  Workflow,
+} from './types.js';
+import { buildPrompt, generateSuggestions } from './prompts.js';
+
+// Dynamic import types for Codex SDK
+interface CodexSDK {
+  Codex: new (options?: CodexOptions) => CodexInstance;
+}
+
+interface CodexOptions {
+  codexPathOverride?: string;
+  baseUrl?: string;
+  apiKey?: string;
+  env?: Record<string, string>;
+}
+
+interface ThreadOptions {
+  model?: string;
+  sandboxMode?: 'read-only' | 'workspace-write' | 'danger-full-access';
+  workingDirectory?: string;
+  skipGitRepoCheck?: boolean;
+  modelReasoningEffort?: 'minimal' | 'low' | 'medium' | 'high' | 'xhigh';
+  networkAccessEnabled?: boolean;
+  webSearchMode?: 'disabled' | 'cached' | 'live';
+  approvalPolicy?: 'never' | 'on-request' | 'on-failure' | 'untrusted';
+  additionalDirectories?: string[];
+}
+
+interface ThreadItem {
+  id: string;
+  type: string;
+  text?: string;
+  command?: string;
+  aggregated_output?: string;
+  status?: string;
+  changes?: unknown[];
+}
+
+interface Usage {
+  input_tokens: number;
+  cached_input_tokens: number;
+  output_tokens: number;
+}
+
+interface TurnResult {
+  items: ThreadItem[];
+  finalResponse: string;
+  usage: Usage | null;
+}
+
+interface ThreadEvent {
+  type: string;
+  thread_id?: string;
+  item?: ThreadItem;
+  usage?: Usage;
+  message?: string;
+  error?: { message: string };
+}
+
+interface StreamedTurnResult {
+  events: AsyncGenerator<ThreadEvent>;
+}
+
+interface Thread {
+  id: string | null;
+  run(input: string, options?: unknown): Promise<TurnResult>;
+  runStreamed(input: string, options?: unknown): Promise<StreamedTurnResult>;
+}
+
+interface CodexInstance {
+  startThread(options?: ThreadOptions): Thread;
+  resumeThread(id: string, options?: ThreadOptions): Thread;
+}
+
+export class CodexProvider implements AgentProvider {
+  readonly id = 'codex';
+  readonly name = 'OpenAI Codex';
+  readonly capabilities: AgentCapabilities = {
+    streaming: true,
+    toolUse: true,
+    codeExecution: true,
+    systemPrompts: true,
+    models: [
+      'codex-1',
+      'o3',
+      'o3-mini',
+      'o4-mini',
+      'gpt-4.1',
+    ],
+  };
+
+  private codex: CodexInstance | null = null;
+  private model: string = 'codex-1';
+  private ready: boolean = false;
+  private error: string | undefined;
+  private workingDirectory: string = process.cwd();
+  private lastThreadId: string | null = null;
+
+  async initialize(config: AgentConfig): Promise<void> {
+    try {
+      // Try to import the Codex SDK (dynamic import with webpackIgnore to avoid bundling issues)
+      const sdkModule = (await import(
+        /* webpackIgnore: true */ '@openai/codex-sdk'
+      ).catch(() => null)) as CodexSDK | null;
+
+      if (!sdkModule || !sdkModule.Codex) {
+        this.ready = false;
+        this.error = 'OpenAI Codex SDK not installed. Run: npm install @openai/codex-sdk';
+        return;
+      }
+
+      const { Codex } = sdkModule;
+
+      const codexOptions: CodexOptions = {};
+
+      // API key from config or environment
+      if (config.apiKey) {
+        codexOptions.apiKey = config.apiKey;
+      } else if (process.env.OPENAI_API_KEY) {
+        codexOptions.apiKey = process.env.OPENAI_API_KEY;
+      }
+
+      // Base URL
+      if (config.baseUrl) {
+        codexOptions.baseUrl = config.baseUrl;
+      }
+
+      // Codex path override
+      if (config.options?.codexPath) {
+        codexOptions.codexPathOverride = config.options.codexPath as string;
+      }
+
+      // Environment variables
+      if (config.options?.env) {
+        codexOptions.env = config.options.env as Record<string, string>;
+      }
+
+      this.codex = new Codex(codexOptions);
+
+      if (config.model) {
+        this.model = config.model;
+      }
+
+      // Working directory
+      if (config.options?.workingDirectory) {
+        this.workingDirectory = config.options.workingDirectory as string;
+      } else if (config.options?.cwd) {
+        this.workingDirectory = config.options.cwd as string;
+      }
+
+      // Test connectivity by starting a simple thread
+      try {
+        const thread = this.codex.startThread({
+          skipGitRepoCheck: true,
+          sandboxMode: 'read-only',
+          workingDirectory: this.workingDirectory,
+        });
+        // Just verify it can be created
+        if (thread) {
+          this.ready = true;
+          this.error = undefined;
+        }
+      } catch (testError) {
+        this.ready = false;
+        this.error = `Cannot initialize Codex: ${testError instanceof Error ? testError.message : 'Unknown error'}`;
+      }
+    } catch (err) {
+      this.ready = false;
+      this.error = err instanceof Error ? err.message : 'Unknown error initializing Codex';
+    }
+  }
+
+  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.codex || !this.ready) {
+      return {
+        explanation: 'OpenAI Codex provider not available.',
+        error: this.error || 'Provider not initialized',
+      };
+    }
+
+    try {
+      // Build context-aware prompts
+      const { systemPrompt, userPrompt } = buildPrompt(prompt, workflow, context);
+
+      // Combine system and user prompts for Codex
+      const fullPrompt = `${systemPrompt}\n\n---\n\n${userPrompt}`;
+
+      const thread = this.codex.startThread({
+        model: this.model,
+        skipGitRepoCheck: true,
+        sandboxMode: 'read-only', // Safe for workflow modifications
+        workingDirectory: this.workingDirectory,
+        modelReasoningEffort: 'medium',
+      });
+
+      const result = await thread.run(fullPrompt);
+      this.lastThreadId = thread.id;
+
+      // Extract the response text
+      const responseText = result.finalResponse ||
+        result.items.find((item) => item.type === 'agent_message')?.text || '';
+
+      return this.parseAIResponse(responseText, workflow);
+    } 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.codex || !this.ready) {
+      return this.processPrompt(prompt, workflow, context);
+    }
+
+    const { systemPrompt, userPrompt } = buildPrompt(prompt, workflow, context);
+    const fullPrompt = `${systemPrompt}\n\n---\n\n${userPrompt}`;
+    let fullResponse = '';
+
+    try {
+      const thread = this.codex.startThread({
+        model: this.model,
+        skipGitRepoCheck: true,
+        sandboxMode: 'read-only',
+        workingDirectory: this.workingDirectory,
+        modelReasoningEffort: 'medium',
+      });
+
+      const streamResult = await thread.runStreamed(fullPrompt);
+
+      for await (const event of streamResult.events) {
+        if (event.type === 'thread.started') {
+          this.lastThreadId = event.thread_id || null;
+        } else if (event.type === 'item.completed' && event.item?.type === 'agent_message') {
+          const text = event.item.text || '';
+          fullResponse = text;
+          onChunk(text);
+        } else if (event.type === 'error') {
+          throw new Error(event.message || 'Stream error');
+        } else if (event.type === 'turn.failed') {
+          throw new Error(event.error?.message || 'Turn failed');
+        }
+      }
+
+      return this.parseAIResponse(fullResponse, workflow);
+    } catch (err) {
+      return {
+        explanation: '',
+        error: err instanceof Error ? err.message : 'Unknown error',
+      };
+    }
+  }
+
+  async cancel(): Promise<void> {
+    // Codex SDK doesn't have explicit cancellation, but we can reset state
+    this.lastThreadId = null;
+  }
+
+  /**
+   * Get the last thread ID for resumption
+   */
+  getLastThreadId(): string | null {
+    return this.lastThreadId;
+  }
+
+  /**
+   * Resume a previous thread
+   */
+  async resumePrompt(
+    threadId: string,
+    prompt: string,
+    workflow: Workflow,
+    context?: { selectedStepId?: string; recentHistory?: string[] }
+  ): Promise<PromptResult> {
+    if (!this.codex || !this.ready) {
+      return {
+        explanation: 'OpenAI Codex provider not available.',
+        error: this.error || 'Provider not initialized',
+      };
+    }
+
+    try {
+      const { systemPrompt, userPrompt } = buildPrompt(prompt, workflow, context);
+      const fullPrompt = `${systemPrompt}\n\n---\n\n${userPrompt}`;
+
+      const thread = this.codex.resumeThread(threadId, {
+        model: this.model,
+        skipGitRepoCheck: true,
+        sandboxMode: 'read-only',
+        workingDirectory: this.workingDirectory,
+      });
+
+      const result = await thread.run(fullPrompt);
+      this.lastThreadId = thread.id;
+
+      const responseText = result.finalResponse ||
+        result.items.find((item) => item.type === 'agent_message')?.text || '';
+
+      return this.parseAIResponse(responseText, workflow);
+    } catch (err) {
+      return {
+        explanation: '',
+        error: err instanceof Error ? err.message : 'Unknown error',
+      };
+    }
+  }
+
+  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 createCodexProvider(config?: AgentConfig): CodexProvider {
+  const provider = new CodexProvider();
+  if (config) {
+    provider.initialize(config);
+  }
+  return provider;
+}

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

@@ -142,6 +142,33 @@ export const AVAILABLE_SERVICES = {
     description: 'Local Ollama LLM for AI tasks',
     commonActions: ['generate', 'chat', 'embeddings'],
   },
+  codex: {
+    sdk: '@openai/codex-sdk',
+    description: 'OpenAI Codex for AI-powered coding workflows',
+    commonActions: [
+      'chat',
+      'codeModify',
+      'codeAnalyze',
+      'codeReview',
+      'webSearch',
+      'execute',
+      'structured',
+      'resume',
+      'withImages',
+    ],
+  },
+  copilot: {
+    sdk: '@github/copilot-sdk',
+    description: 'GitHub Copilot for AI code assistance',
+    commonActions: [
+      'chat',
+      'codeReview',
+      'codeModify',
+      'withTools',
+      'withAgents',
+      'withMcp',
+    ],
+  },
 } as const;
 
 // Base system prompt with comprehensive context

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

@@ -14,6 +14,7 @@ import type {
 import { createClaudeProvider } from './claude-provider.js';
 import { createClaudeCodeProvider } from './claude-code-provider.js';
 import { createCopilotProvider } from './copilot-provider.js';
+import { createCodexProvider } from './codex-provider.js';
 import { createDemoProvider } from './demo-provider.js';
 import { createOllamaProvider } from './ollama-provider.js';
 
@@ -38,6 +39,11 @@ export class AgentRegistry {
       name: 'GitHub Copilot (SDK)',
       factory: createCopilotProvider,
     });
+    this.registerProvider({
+      id: 'codex',
+      name: 'OpenAI Codex (SDK)',
+      factory: createCodexProvider,
+    });
     // API key-based providers
     this.registerProvider({
       id: 'claude',
@@ -153,6 +159,21 @@ export class AgentRegistry {
       }
     }
 
+    // Try OpenAI Codex SDK (uses OPENAI_API_KEY)
+    const codexProvider = this.providers.get('codex');
+    if (codexProvider) {
+      await codexProvider.initialize({
+        apiKey: process.env.OPENAI_API_KEY,
+        options: {
+          cwd: process.cwd(),
+        },
+      });
+      if (codexProvider.isReady()) {
+        this.activeProviderId = 'codex';
+        return 'codex';
+      }
+    }
+
     // Try Claude with API key (requires ANTHROPIC_API_KEY)
     const claudeProvider = this.providers.get('claude');
     if (claudeProvider) {

package/tailwind.config.ts

@@ -6,7 +6,7 @@ const config: Config = {
   theme: {
     extend: {
       colors: {
-        // n8n-inspired color palette
+        // Primary color palette
         primary: {
           DEFAULT: '#ff6d5a',
           light: '#ff8a7a',

package/tests/integration/api.test.ts

@@ -12,7 +12,7 @@ describe('API Integration Tests', () => {
       expect(response.status).toBe(200);
       expect(response.body).toEqual({
         status: 'ok',
-        version: '2.0.0-alpha.1',
+        version: '2.0.0-alpha.2',
       });
     });
   });
@@ -57,6 +57,90 @@ describe('API Integration Tests', () => {
         expect(githubTool.name).toBe('GitHub');
         expect(githubTool.sdk).toBe('@octokit/rest');
       });
+
+      it('should include all new payment integrations', async () => {
+        const response = await request(app).get('/api/tools');
+        const stripeTool = response.body.tools.find((t: { id: string }) => t.id === 'stripe');
+
+        expect(stripeTool).toBeDefined();
+        expect(stripeTool.name).toBe('Stripe');
+        expect(stripeTool.category).toBe('Payments');
+        expect(stripeTool.sdk).toBe('stripe');
+      });
+
+      it('should include all new communication integrations', async () => {
+        const response = await request(app).get('/api/tools');
+
+        const twilioTool = response.body.tools.find((t: { id: string }) => t.id === 'twilio');
+        expect(twilioTool).toBeDefined();
+        expect(twilioTool.name).toBe('Twilio');
+        expect(twilioTool.category).toBe('Communication');
+
+        const sendgridTool = response.body.tools.find((t: { id: string }) => t.id === 'sendgrid');
+        expect(sendgridTool).toBeDefined();
+        expect(sendgridTool.name).toBe('SendGrid');
+
+        const teamsTool = response.body.tools.find((t: { id: string }) => t.id === 'teams');
+        expect(teamsTool).toBeDefined();
+        expect(teamsTool.name).toBe('Microsoft Teams');
+      });
+
+      it('should include all new e-commerce integrations', async () => {
+        const response = await request(app).get('/api/tools');
+        const shopifyTool = response.body.tools.find((t: { id: string }) => t.id === 'shopify');
+
+        expect(shopifyTool).toBeDefined();
+        expect(shopifyTool.name).toBe('Shopify');
+        expect(shopifyTool.category).toBe('E-commerce');
+        expect(shopifyTool.sdk).toBe('@shopify/shopify-api');
+      });
+
+      it('should include all new support integrations', async () => {
+        const response = await request(app).get('/api/tools');
+        const zendeskTool = response.body.tools.find((t: { id: string }) => t.id === 'zendesk');
+
+        expect(zendeskTool).toBeDefined();
+        expect(zendeskTool.name).toBe('Zendesk');
+        expect(zendeskTool.category).toBe('Support');
+        expect(zendeskTool.sdk).toBe('node-zendesk');
+      });
+
+      it('should include all new marketing integrations', async () => {
+        const response = await request(app).get('/api/tools');
+        const mailchimpTool = response.body.tools.find((t: { id: string }) => t.id === 'mailchimp');
+
+        expect(mailchimpTool).toBeDefined();
+        expect(mailchimpTool.name).toBe('Mailchimp');
+        expect(mailchimpTool.category).toBe('Marketing');
+        expect(mailchimpTool.sdk).toBe('@mailchimp/mailchimp_marketing');
+      });
+
+      it('should include all new project management integrations', async () => {
+        const response = await request(app).get('/api/tools');
+
+        const asanaTool = response.body.tools.find((t: { id: string }) => t.id === 'asana');
+        expect(asanaTool).toBeDefined();
+        expect(asanaTool.name).toBe('Asana');
+        expect(asanaTool.category).toBe('Project Management');
+
+        const trelloTool = response.body.tools.find((t: { id: string }) => t.id === 'trello');
+        expect(trelloTool).toBeDefined();
+        expect(trelloTool.name).toBe('Trello');
+      });
+
+      it('should include all new storage integrations', async () => {
+        const response = await request(app).get('/api/tools');
+
+        const dropboxTool = response.body.tools.find((t: { id: string }) => t.id === 'dropbox');
+        expect(dropboxTool).toBeDefined();
+        expect(dropboxTool.name).toBe('Dropbox');
+        expect(dropboxTool.category).toBe('Storage');
+
+        const s3Tool = response.body.tools.find((t: { id: string }) => t.id === 'aws-s3');
+        expect(s3Tool).toBeDefined();
+        expect(s3Tool.name).toBe('AWS S3');
+        expect(s3Tool.category).toBe('Storage');
+      });
     });
 
     describe('GET /api/tools/:toolId', () => {
@@ -91,6 +175,124 @@ describe('API Integration Tests', () => {
       });
     });
 
+    describe('GET /api/tools/:toolId - New Integrations', () => {
+      it('should return stripe tool with payment actions', async () => {
+        const response = await request(app).get('/api/tools/stripe');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('stripe');
+        expect(response.body.tool.actions).toBeDefined();
+
+        const createCustomer = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'customers.create'
+        );
+        expect(createCustomer).toBeDefined();
+        expect(createCustomer.name).toBe('Create Customer');
+
+        const createPaymentIntent = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'paymentIntents.create'
+        );
+        expect(createPaymentIntent).toBeDefined();
+      });
+
+      it('should return twilio tool with messaging actions', async () => {
+        const response = await request(app).get('/api/tools/twilio');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('twilio');
+
+        const sendSMS = response.body.tool.actions.find((a: { id: string }) => a.id === 'sendSMS');
+        expect(sendSMS).toBeDefined();
+        expect(sendSMS.name).toBe('Send SMS');
+
+        const sendWhatsApp = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'sendWhatsApp'
+        );
+        expect(sendWhatsApp).toBeDefined();
+      });
+
+      it('should return shopify tool with e-commerce actions', async () => {
+        const response = await request(app).get('/api/tools/shopify');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('shopify');
+
+        const createProduct = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'createProduct'
+        );
+        expect(createProduct).toBeDefined();
+
+        const createOrder = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'createOrder'
+        );
+        expect(createOrder).toBeDefined();
+      });
+
+      it('should return zendesk tool with support actions', async () => {
+        const response = await request(app).get('/api/tools/zendesk');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('zendesk');
+
+        const createTicket = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'createTicket'
+        );
+        expect(createTicket).toBeDefined();
+        expect(createTicket.name).toBe('Create Ticket');
+      });
+
+      it('should return asana tool with project management actions', async () => {
+        const response = await request(app).get('/api/tools/asana');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('asana');
+
+        const createTask = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'createTask'
+        );
+        expect(createTask).toBeDefined();
+
+        const createProject = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'createProject'
+        );
+        expect(createProject).toBeDefined();
+      });
+
+      it('should return dropbox tool with storage actions', async () => {
+        const response = await request(app).get('/api/tools/dropbox');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('dropbox');
+
+        const uploadFile = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'uploadFile'
+        );
+        expect(uploadFile).toBeDefined();
+
+        const createSharedLink = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'createSharedLink'
+        );
+        expect(createSharedLink).toBeDefined();
+      });
+
+      it('should return aws-s3 tool with object storage actions', async () => {
+        const response = await request(app).get('/api/tools/aws-s3');
+
+        expect(response.status).toBe(200);
+        expect(response.body.tool.id).toBe('aws-s3');
+
+        const uploadObject = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'uploadObject'
+        );
+        expect(uploadObject).toBeDefined();
+
+        const listObjects = response.body.tool.actions.find(
+          (a: { id: string }) => a.id === 'listObjects'
+        );
+        expect(listObjects).toBeDefined();
+      });
+    });
+
     describe('GET /api/tools/:toolId/actions/:actionId', () => {
       it('should return action details', async () => {
         const response = await request(app).get('/api/tools/github/actions/pulls.get');