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

package/tests/unit/themeStore.test.ts

@@ -1,141 +0,0 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { useThemeStore } from '../../src/client/stores/themeStore';
-
-// Mock localStorage
-const localStorageMock = (() => {
-  let store: Record<string, string> = {};
-  return {
-    getItem: (key: string) => store[key] || null,
-    setItem: (key: string, value: string) => { store[key] = value; },
-    removeItem: (key: string) => { delete store[key]; },
-    clear: () => { store = {}; },
-  };
-})();
-
-Object.defineProperty(window, 'localStorage', { value: localStorageMock });
-
-// Mock matchMedia
-Object.defineProperty(window, 'matchMedia', {
-  value: vi.fn().mockImplementation(query => ({
-    matches: query === '(prefers-color-scheme: dark)',
-    media: query,
-    onchange: null,
-    addListener: vi.fn(),
-    removeListener: vi.fn(),
-    addEventListener: vi.fn(),
-    removeEventListener: vi.fn(),
-    dispatchEvent: vi.fn(),
-  })),
-});
-
-describe('themeStore', () => {
-  beforeEach(() => {
-    // Reset store state
-    useThemeStore.setState({
-      theme: 'dark',
-      resolvedTheme: 'dark',
-    });
-    localStorageMock.clear();
-
-    // Reset document classes
-    document.documentElement.classList.remove('dark', 'light');
-  });
-
-  describe('initial state', () => {
-    it('should default to dark theme', () => {
-      const state = useThemeStore.getState();
-      expect(state.theme).toBe('dark');
-      expect(state.resolvedTheme).toBe('dark');
-    });
-  });
-
-  describe('setTheme', () => {
-    it('should set theme to light', () => {
-      const { setTheme } = useThemeStore.getState();
-
-      setTheme('light');
-
-      const state = useThemeStore.getState();
-      expect(state.theme).toBe('light');
-      expect(state.resolvedTheme).toBe('light');
-    });
-
-    it('should set theme to dark', () => {
-      const { setTheme } = useThemeStore.getState();
-
-      setTheme('light');
-      setTheme('dark');
-
-      const state = useThemeStore.getState();
-      expect(state.theme).toBe('dark');
-      expect(state.resolvedTheme).toBe('dark');
-    });
-
-    it('should resolve system theme', () => {
-      const { setTheme } = useThemeStore.getState();
-
-      setTheme('system');
-
-      const state = useThemeStore.getState();
-      expect(state.theme).toBe('system');
-      // Our mock returns dark for prefers-color-scheme: dark
-      expect(state.resolvedTheme).toBe('dark');
-    });
-
-    it('should apply dark class to document', () => {
-      const { setTheme } = useThemeStore.getState();
-
-      setTheme('dark');
-
-      expect(document.documentElement.classList.contains('dark')).toBe(true);
-      expect(document.documentElement.classList.contains('light')).toBe(false);
-    });
-
-    it('should apply light class to document', () => {
-      const { setTheme } = useThemeStore.getState();
-
-      setTheme('light');
-
-      expect(document.documentElement.classList.contains('light')).toBe(true);
-      expect(document.documentElement.classList.contains('dark')).toBe(false);
-    });
-  });
-
-  describe('toggleTheme', () => {
-    it('should toggle from dark to light', () => {
-      const { toggleTheme } = useThemeStore.getState();
-
-      toggleTheme();
-
-      const state = useThemeStore.getState();
-      expect(state.theme).toBe('light');
-      expect(state.resolvedTheme).toBe('light');
-    });
-
-    it('should toggle from light to dark', () => {
-      const { setTheme, toggleTheme } = useThemeStore.getState();
-
-      setTheme('light');
-      toggleTheme();
-
-      const state = useThemeStore.getState();
-      expect(state.theme).toBe('dark');
-      expect(state.resolvedTheme).toBe('dark');
-    });
-
-    it('should apply correct classes on toggle', () => {
-      const { setTheme, toggleTheme } = useThemeStore.getState();
-
-      setTheme('dark');
-      expect(document.documentElement.classList.contains('dark')).toBe(true);
-
-      toggleTheme();
-      expect(document.documentElement.classList.contains('light')).toBe(true);
-      expect(document.documentElement.classList.contains('dark')).toBe(false);
-
-      toggleTheme();
-      expect(document.documentElement.classList.contains('dark')).toBe(true);
-      expect(document.documentElement.classList.contains('light')).toBe(false);
-    });
-  });
-});

package/tests/unit/workflowToGraph.test.ts

@@ -1,289 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { workflowToGraph, graphToWorkflow } from '../../src/client/utils/workflowToGraph';
-
-describe('workflowToGraph', () => {
-  describe('basic conversion', () => {
-    it('should convert a simple workflow to nodes and edges', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', name: 'Step 1', action: 'http.get', inputs: {} },
-          { id: 'step-2', name: 'Step 2', action: 'http.post', inputs: {} },
-        ],
-      };
-
-      const { nodes, edges } = workflowToGraph(workflow);
-
-      // Should have 2 step nodes + 1 output node
-      expect(nodes).toHaveLength(3);
-      expect(nodes[0].id).toBe('step-1');
-      expect(nodes[0].type).toBe('step');
-      expect(nodes[1].id).toBe('step-2');
-      expect(nodes[1].type).toBe('step');
-      expect(nodes[2].type).toBe('output');
-
-      // Should have edge between steps and to output
-      expect(edges.length).toBeGreaterThanOrEqual(2);
-      expect(edges.find(e => e.source === 'step-1' && e.target === 'step-2')).toBeDefined();
-    });
-
-    it('should create nodes with correct data', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          {
-            id: 'fetch',
-            name: 'Fetch Data',
-            action: 'github.pulls.get',
-            inputs: { owner: 'test' },
-            outputVariable: 'pr_data',
-          },
-        ],
-      };
-
-      const { nodes } = workflowToGraph(workflow);
-      const stepNode = nodes.find(n => n.id === 'fetch');
-
-      expect(stepNode?.data.id).toBe('fetch');
-      expect(stepNode?.data.name).toBe('Fetch Data');
-      expect(stepNode?.data.action).toBe('github.pulls.get');
-      expect(stepNode?.data.status).toBe('pending');
-    });
-  });
-
-  describe('trigger nodes', () => {
-    it('should add a trigger node when triggers are defined', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [{ id: 'step-1', action: 'http.get', inputs: {} }],
-        triggers: [{ type: 'webhook' as const, path: '/api/trigger' }],
-      };
-
-      const { nodes, edges } = workflowToGraph(workflow);
-
-      const triggerNode = nodes.find(n => n.type === 'trigger');
-      expect(triggerNode).toBeDefined();
-      expect(triggerNode?.data.type).toBe('webhook');
-      expect(triggerNode?.data.path).toBe('/api/trigger');
-
-      // Should have edge from trigger to first step
-      const triggerEdge = edges.find(e => e.source === triggerNode?.id && e.target === 'step-1');
-      expect(triggerEdge).toBeDefined();
-    });
-
-    it('should handle schedule trigger with cron', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [{ id: 'step-1', action: 'http.get', inputs: {} }],
-        triggers: [{ type: 'schedule' as const, cron: '0 9 * * *' }],
-      };
-
-      const { nodes } = workflowToGraph(workflow);
-      const triggerNode = nodes.find(n => n.type === 'trigger');
-
-      expect(triggerNode?.data.type).toBe('schedule');
-      expect(triggerNode?.data.cron).toBe('0 9 * * *');
-    });
-  });
-
-  describe('sub-workflow nodes', () => {
-    it('should create subworkflow nodes for steps with workflow property', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', action: 'http.get', inputs: {} },
-          { id: 'sub-1', name: 'Sub Process', workflow: '/workflows/sub.md', inputs: {} },
-        ],
-      };
-
-      const { nodes } = workflowToGraph(workflow);
-      const subNode = nodes.find(n => n.id === 'sub-1');
-
-      expect(subNode?.type).toBe('subworkflow');
-      expect(subNode?.data.workflowPath).toBe('/workflows/sub.md');
-    });
-  });
-
-  describe('output nodes', () => {
-    it('should add output node at the end', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', action: 'http.get', inputs: {}, outputVariable: 'result1' },
-          { id: 'step-2', action: 'http.post', inputs: {}, outputVariable: 'result2' },
-        ],
-      };
-
-      const { nodes, edges } = workflowToGraph(workflow);
-      const outputNode = nodes.find(n => n.type === 'output');
-
-      expect(outputNode).toBeDefined();
-      expect(outputNode?.data.variables).toEqual(['result1', 'result2']);
-
-      // Should have edge from last step to output
-      const outputEdge = edges.find(e => e.source === 'step-2' && e.target === outputNode?.id);
-      expect(outputEdge).toBeDefined();
-    });
-  });
-
-  describe('variable dependency edges', () => {
-    it('should create data flow edges for variable references', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', action: 'http.get', inputs: {}, outputVariable: 'response' },
-          { id: 'step-2', action: 'process', inputs: { data: '{{ response.body }}' } },
-        ],
-      };
-
-      const { edges } = workflowToGraph(workflow);
-      const dataEdge = edges.find(e => e.id.startsWith('data-') && e.source === 'step-1' && e.target === 'step-2');
-
-      expect(dataEdge).toBeDefined();
-      expect(dataEdge?.label).toBe('response');
-      expect(dataEdge?.animated).toBe(true);
-    });
-
-    it('should not create edges for inputs references', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', action: 'http.get', inputs: { url: '{{ inputs.url }}' } },
-        ],
-      };
-
-      const { edges } = workflowToGraph(workflow);
-      const dataEdges = edges.filter(e => e.id.startsWith('data-'));
-
-      expect(dataEdges).toHaveLength(0);
-    });
-  });
-
-  describe('conditional edges', () => {
-    it('should label conditional edges', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', action: 'check', inputs: {} },
-          { id: 'step-2', action: 'process', inputs: {}, conditions: ['result.success == true'] },
-        ],
-      };
-
-      const { edges } = workflowToGraph(workflow);
-      const conditionalEdge = edges.find(e => e.source === 'step-1' && e.target === 'step-2');
-
-      expect(conditionalEdge?.label).toBe('conditional');
-    });
-  });
-
-  describe('node positioning', () => {
-    it('should position nodes vertically', () => {
-      const workflow = {
-        metadata: { id: 'test-1', name: 'Test Workflow' },
-        steps: [
-          { id: 'step-1', action: 'a', inputs: {} },
-          { id: 'step-2', action: 'b', inputs: {} },
-          { id: 'step-3', action: 'c', inputs: {} },
-        ],
-      };
-
-      const { nodes } = workflowToGraph(workflow);
-      const stepNodes = nodes.filter(n => n.type === 'step');
-
-      // Each step should be below the previous one
-      expect(stepNodes[1].position.y).toBeGreaterThan(stepNodes[0].position.y);
-      expect(stepNodes[2].position.y).toBeGreaterThan(stepNodes[1].position.y);
-    });
-  });
-});
-
-describe('graphToWorkflow', () => {
-  it('should convert nodes back to workflow steps', () => {
-    const nodes = [
-      {
-        id: 'step-1',
-        type: 'step',
-        position: { x: 250, y: 0 },
-        data: { id: 'step-1', name: 'Step 1', action: 'http.get', inputs: {} },
-      },
-      {
-        id: 'step-2',
-        type: 'step',
-        position: { x: 250, y: 120 },
-        data: { id: 'step-2', name: 'Step 2', action: 'http.post', inputs: {}, outputVariable: 'result' },
-      },
-    ];
-
-    const edges = [{ id: 'e-1-2', source: 'step-1', target: 'step-2' }];
-    const metadata = { id: 'test', name: 'Test Workflow' };
-
-    const workflow = graphToWorkflow(nodes, edges, metadata);
-
-    expect(workflow.metadata).toEqual(metadata);
-    expect(workflow.steps).toHaveLength(2);
-    expect(workflow.steps[0].id).toBe('step-1');
-    expect(workflow.steps[0].action).toBe('http.get');
-    expect(workflow.steps[1].outputVariable).toBe('result');
-  });
-
-  it('should filter out trigger and output nodes', () => {
-    const nodes = [
-      { id: 'trigger-1', type: 'trigger', position: { x: 250, y: 0 }, data: { type: 'manual' } },
-      { id: 'step-1', type: 'step', position: { x: 250, y: 120 }, data: { id: 'step-1', action: 'test', inputs: {} } },
-      { id: 'output-1', type: 'output', position: { x: 250, y: 240 }, data: { variables: [] } },
-    ];
-
-    const workflow = graphToWorkflow(nodes, [], { id: 'test', name: 'Test' });
-
-    expect(workflow.steps).toHaveLength(1);
-    expect(workflow.steps[0].id).toBe('step-1');
-  });
-
-  it('should extract trigger info', () => {
-    const nodes = [
-      {
-        id: 'trigger-1',
-        type: 'trigger',
-        position: { x: 250, y: 0 },
-        data: { type: 'webhook', path: '/api/hook' },
-      },
-      { id: 'step-1', type: 'step', position: { x: 250, y: 120 }, data: { id: 'step-1', inputs: {} } },
-    ];
-
-    const workflow = graphToWorkflow(nodes, [], { id: 'test', name: 'Test' });
-
-    expect(workflow.triggers).toHaveLength(1);
-    expect(workflow.triggers?.[0].type).toBe('webhook');
-    expect(workflow.triggers?.[0].path).toBe('/api/hook');
-  });
-
-  it('should sort steps by vertical position', () => {
-    const nodes = [
-      { id: 'step-3', type: 'step', position: { x: 250, y: 240 }, data: { id: 'step-3', inputs: {} } },
-      { id: 'step-1', type: 'step', position: { x: 250, y: 0 }, data: { id: 'step-1', inputs: {} } },
-      { id: 'step-2', type: 'step', position: { x: 250, y: 120 }, data: { id: 'step-2', inputs: {} } },
-    ];
-
-    const workflow = graphToWorkflow(nodes, [], { id: 'test', name: 'Test' });
-
-    expect(workflow.steps[0].id).toBe('step-1');
-    expect(workflow.steps[1].id).toBe('step-2');
-    expect(workflow.steps[2].id).toBe('step-3');
-  });
-
-  it('should handle sub-workflow nodes', () => {
-    const nodes = [
-      {
-        id: 'sub-1',
-        type: 'subworkflow',
-        position: { x: 250, y: 0 },
-        data: { id: 'sub-1', name: 'Sub Workflow', workflowPath: '/sub.md', inputs: {} },
-      },
-    ];
-
-    const workflow = graphToWorkflow(nodes, [], { id: 'test', name: 'Test' });
-
-    expect(workflow.steps).toHaveLength(1);
-    expect(workflow.steps[0].workflow).toBe('/sub.md');
-  });
-});

package/tsconfig.json

@@ -1,29 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2022",
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "react-jsx",
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true,
-    "declaration": true,
-    "declarationMap": true,
-    "sourceMap": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/client/*"],
-      "@shared/*": ["./src/shared/*"]
-    }
-  },
-  "include": ["src/client/**/*", "src/shared/**/*"],
-  "exclude": ["node_modules", "dist"]
-}

package/tsconfig.server.json

@@ -1,28 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2022",
-    "lib": ["ES2022"],
-    "module": "NodeNext",
-    "moduleResolution": "NodeNext",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true,
-    "declaration": false,
-    "sourceMap": true,
-    "outDir": "./dist/server",
-    "rootDir": "./src",
-    "baseUrl": ".",
-    "paths": {
-      "@shared/*": ["./src/shared/*"]
-    }
-  },
-  "include": ["src/server/**/*", "src/shared/**/*"],
-  "exclude": ["node_modules", "dist"]
-}

package/vite.config.ts

@@ -1,31 +0,0 @@
-import { defineConfig } from 'vite';
-import react from '@vitejs/plugin-react';
-import path from 'path';
-
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src/client'),
-      '@shared': path.resolve(__dirname, './src/shared'),
-    },
-  },
-  server: {
-    port: 5173,
-    proxy: {
-      '/api': {
-        target: 'http://localhost:3001',
-        changeOrigin: true,
-      },
-      '/socket.io': {
-        target: 'http://localhost:3001',
-        changeOrigin: true,
-        ws: true,
-      },
-    },
-  },
-  build: {
-    outDir: 'dist/client',
-    sourcemap: true,
-  },
-});

package/vitest.config.ts

@@ -1,26 +0,0 @@
-import { defineConfig } from 'vitest/config';
-import react from '@vitejs/plugin-react';
-import path from 'path';
-
-export default defineConfig({
-  plugins: [react()],
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src/client'),
-      '@shared': path.resolve(__dirname, './src/shared'),
-    },
-  },
-  test: {
-    globals: true,
-    environment: 'jsdom',
-    setupFiles: ['./tests/setup.ts'],
-    include: ['tests/**/*.test.{ts,tsx}'],
-    exclude: ['tests/e2e/**'],
-    coverage: {
-      provider: 'v8',
-      reporter: ['text', 'json', 'html'],
-      include: ['src/**/*.{ts,tsx}'],
-      exclude: ['src/**/*.d.ts', 'src/server/**'],
-    },
-  },
-});