@startsimpli/funnels 0.1.4 → 0.1.6

package/src/store/create-funnel-store.test.ts

@@ -0,0 +1,686 @@
+/**
+ * Tests for createFunnelStore
+ *
+ * Tests:
+ * - CRUD operations
+ * - Optimistic updates
+ * - Error handling with rollback
+ * - Dirty tracking
+ * - Selection state
+ * - Stage management
+ * - Run operations
+ */
+
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { createFunnelStore } from './create-funnel-store';
+import type { FunnelApiClient, PaginatedResponse } from '../api/client';
+import type {
+  Funnel,
+  FunnelStage,
+  FunnelRun,
+  CreateFunnelInput,
+} from '../types';
+
+// ============================================================================
+// Mock API Client
+// ============================================================================
+
+const createMockApiClient = (): FunnelApiClient => {
+  return {
+    listFunnels: vi.fn(),
+    getFunnel: vi.fn(),
+    createFunnel: vi.fn(),
+    updateFunnel: vi.fn(),
+    deleteFunnel: vi.fn(),
+    createStage: vi.fn(),
+    updateStage: vi.fn(),
+    deleteStage: vi.fn(),
+    runFunnel: vi.fn(),
+    getFunnelRuns: vi.fn(),
+    getFunnelRun: vi.fn(),
+    getFunnelResults: vi.fn(),
+    cancelFunnelRun: vi.fn(),
+    previewFunnel: vi.fn(),
+    previewFunnelServer: vi.fn(),
+  } as unknown as FunnelApiClient;
+};
+
+// ============================================================================
+// Test Data
+// ============================================================================
+
+const mockFunnel: Funnel = {
+  id: 'funnel-1',
+  name: 'Test Funnel',
+  description: 'Test description',
+  status: 'active',
+  input_type: 'contacts',
+  stages: [
+    {
+      id: 'stage-1',
+      order: 0,
+      name: 'Stage 1',
+      filter_logic: 'AND',
+      rules: [],
+      match_action: 'continue',
+      no_match_action: 'exclude',
+    },
+    {
+      id: 'stage-2',
+      order: 1,
+      name: 'Stage 2',
+      filter_logic: 'OR',
+      rules: [],
+      match_action: 'output',
+      no_match_action: 'exclude',
+    },
+  ],
+  created_at: new Date().toISOString(),
+  updated_at: new Date().toISOString(),
+};
+
+const mockFunnel2: Funnel = {
+  id: 'funnel-2',
+  name: 'Test Funnel 2',
+  status: 'draft',
+  input_type: 'organizations',
+  stages: [],
+  created_at: new Date().toISOString(),
+  updated_at: new Date().toISOString(),
+};
+
+const mockRun: FunnelRun = {
+  id: 'run-1',
+  funnel_id: 'funnel-1',
+  status: 'completed',
+  trigger_type: 'manual',
+  started_at: new Date().toISOString(),
+  completed_at: new Date().toISOString(),
+  total_input: 100,
+  total_matched: 75,
+  total_excluded: 25,
+  total_tagged: 50,
+  stage_stats: {},
+};
+
+// ============================================================================
+// Tests
+// ============================================================================
+
+describe('createFunnelStore', () => {
+  let apiClient: FunnelApiClient;
+  let useFunnelStore: ReturnType<typeof createFunnelStore>;
+
+  beforeEach(() => {
+    apiClient = createMockApiClient();
+    useFunnelStore = createFunnelStore(apiClient);
+  });
+
+  describe('Initial State', () => {
+    it('should initialize with empty state', () => {
+      const state = useFunnelStore.getState();
+
+      expect(state.funnels).toEqual([]);
+      expect(state.selectedFunnel).toBeNull();
+      expect(state.selectedStage).toBeNull();
+      expect(state.runs).toEqual([]);
+      expect(state.isLoading).toBe(false);
+      expect(state.error).toBeNull();
+      expect(state.isDirty).toBe(false);
+    });
+  });
+
+  describe('loadFunnels', () => {
+    it('should load funnels successfully', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 2,
+        next: null,
+        previous: null,
+        results: [mockFunnel, mockFunnel2],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const { loadFunnels } = useFunnelStore.getState();
+      await loadFunnels();
+
+      const state = useFunnelStore.getState();
+      expect(state.funnels).toHaveLength(2);
+      expect(state.funnels[0].id).toBe('funnel-1');
+      expect(state.pagination.count).toBe(2);
+      expect(state.isLoading).toBe(false);
+    });
+
+    it('should handle loading error', async () => {
+      const error = new Error('Network error');
+      vi.mocked(apiClient.listFunnels).mockRejectedValue(error);
+
+      const { loadFunnels } = useFunnelStore.getState();
+
+      await expect(loadFunnels()).rejects.toThrow('Network error');
+
+      const state = useFunnelStore.getState();
+      expect(state.error).toBe(error);
+      expect(state.isLoading).toBe(false);
+    });
+
+    it('should apply filters and pagination', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const { loadFunnels } = useFunnelStore.getState();
+      await loadFunnels({ status: 'active', page: 2, page_size: 10 });
+
+      expect(apiClient.listFunnels).toHaveBeenCalledWith({
+        status: 'active',
+        page: 2,
+        page_size: 10,
+      });
+
+      const state = useFunnelStore.getState();
+      expect(state.pagination.currentPage).toBe(2);
+      expect(state.pagination.pageSize).toBe(10);
+    });
+  });
+
+  describe('selectFunnel', () => {
+    it('should select funnel by id', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const { loadFunnels, selectFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+      selectFunnel('funnel-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel?.id).toBe('funnel-1');
+    });
+
+    it('should clear selection when id is null', () => {
+      const { selectFunnel } = useFunnelStore.getState();
+      selectFunnel(null);
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel).toBeNull();
+      expect(state.selectedStage).toBeNull();
+    });
+
+    it('should clear stage selection when changing funnels', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 2,
+        next: null,
+        previous: null,
+        results: [mockFunnel, mockFunnel2],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const { loadFunnels, selectFunnel, selectStage } = useFunnelStore.getState();
+      await loadFunnels();
+
+      selectFunnel('funnel-1');
+      selectStage('stage-1');
+
+      expect(useFunnelStore.getState().selectedStage?.id).toBe('stage-1');
+
+      selectFunnel('funnel-2');
+
+      expect(useFunnelStore.getState().selectedStage).toBeNull();
+    });
+  });
+
+  describe('createFunnel', () => {
+    it('should create funnel successfully', async () => {
+      vi.mocked(apiClient.createFunnel).mockResolvedValue(mockFunnel);
+
+      const { createFunnel } = useFunnelStore.getState();
+      const input: CreateFunnelInput = {
+        name: 'Test Funnel',
+        status: 'active',
+        input_type: 'contacts',
+        stages: [],
+      };
+
+      const result = await createFunnel(input);
+
+      expect(result).toEqual(mockFunnel);
+      expect(useFunnelStore.getState().funnels).toHaveLength(1);
+      expect(useFunnelStore.getState().pagination.count).toBe(1);
+    });
+
+    it('should handle creation error', async () => {
+      const error = new Error('Validation error');
+      vi.mocked(apiClient.createFunnel).mockRejectedValue(error);
+
+      const { createFunnel } = useFunnelStore.getState();
+      const input: CreateFunnelInput = {
+        name: '',
+        status: 'active',
+        input_type: 'contacts',
+        stages: [],
+      };
+
+      await expect(createFunnel(input)).rejects.toThrow('Validation error');
+
+      const state = useFunnelStore.getState();
+      expect(state.error).toBe(error);
+      expect(state.funnels).toHaveLength(0);
+    });
+  });
+
+  describe('updateFunnel - Optimistic Updates', () => {
+    it('should update funnel optimistically', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const updatedFunnel = { ...mockFunnel, name: 'Updated Name' };
+      vi.mocked(apiClient.updateFunnel).mockResolvedValue(updatedFunnel);
+
+      const { loadFunnels, updateFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+
+      // Update immediately reflects in store
+      const updatePromise = updateFunnel('funnel-1', { name: 'Updated Name' });
+
+      // Check optimistic update
+      let state = useFunnelStore.getState();
+      expect(state.funnels[0].name).toBe('Updated Name');
+
+      await updatePromise;
+
+      // Check final state
+      state = useFunnelStore.getState();
+      expect(state.funnels[0].name).toBe('Updated Name');
+      expect(state.isDirty).toBe(false);
+    });
+
+    it('should rollback on update error', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const error = new Error('Update failed');
+      vi.mocked(apiClient.updateFunnel).mockRejectedValue(error);
+
+      const { loadFunnels, updateFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+
+      const originalName = mockFunnel.name;
+
+      await expect(updateFunnel('funnel-1', { name: 'New Name' })).rejects.toThrow(
+        'Update failed'
+      );
+
+      // Should rollback to original
+      const state = useFunnelStore.getState();
+      expect(state.funnels[0].name).toBe(originalName);
+      expect(state.error?.message).toBe('Update failed');
+    });
+
+    it('should update selectedFunnel when updated', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const updatedFunnel = { ...mockFunnel, name: 'Updated Name' };
+      vi.mocked(apiClient.updateFunnel).mockResolvedValue(updatedFunnel);
+
+      const { loadFunnels, selectFunnel, updateFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+      selectFunnel('funnel-1');
+
+      await updateFunnel('funnel-1', { name: 'Updated Name' });
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel?.name).toBe('Updated Name');
+    });
+  });
+
+  describe('deleteFunnel - Optimistic Updates', () => {
+    it('should delete funnel optimistically', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 2,
+        next: null,
+        previous: null,
+        results: [mockFunnel, mockFunnel2],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+      vi.mocked(apiClient.deleteFunnel).mockResolvedValue();
+
+      const { loadFunnels, deleteFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+
+      await deleteFunnel('funnel-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.funnels).toHaveLength(1);
+      expect(state.funnels[0].id).toBe('funnel-2');
+      expect(state.pagination.count).toBe(1);
+    });
+
+    it('should rollback on delete error', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const error = new Error('Delete failed');
+      vi.mocked(apiClient.deleteFunnel).mockRejectedValue(error);
+
+      const { loadFunnels, deleteFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+
+      await expect(deleteFunnel('funnel-1')).rejects.toThrow('Delete failed');
+
+      const state = useFunnelStore.getState();
+      expect(state.funnels).toHaveLength(1);
+      expect(state.funnels[0].id).toBe('funnel-1');
+      expect(state.error?.message).toBe('Delete failed');
+    });
+
+    it('should clear selectedFunnel when deleting selected funnel', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+      vi.mocked(apiClient.deleteFunnel).mockResolvedValue();
+
+      const { loadFunnels, selectFunnel, deleteFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+      selectFunnel('funnel-1');
+
+      await deleteFunnel('funnel-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel).toBeNull();
+    });
+  });
+
+  describe('duplicateFunnel', () => {
+    it('should duplicate funnel with new name', async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const duplicated = {
+        ...mockFunnel,
+        id: 'funnel-3',
+        name: 'Test Funnel (Copy)',
+        status: 'draft' as const,
+      };
+      vi.mocked(apiClient.createFunnel).mockResolvedValue(duplicated);
+
+      const { loadFunnels, duplicateFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+
+      const result = await duplicateFunnel('funnel-1');
+
+      expect(result.name).toBe('Test Funnel (Copy)');
+      expect(result.status).toBe('draft');
+      expect(apiClient.createFunnel).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: 'Test Funnel (Copy)',
+          status: 'draft',
+        })
+      );
+    });
+
+    it('should throw if funnel not found', async () => {
+      const { duplicateFunnel } = useFunnelStore.getState();
+
+      await expect(duplicateFunnel('nonexistent')).rejects.toThrow(
+        'Funnel nonexistent not found'
+      );
+    });
+  });
+
+  describe('Stage Management', () => {
+    beforeEach(async () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const { loadFunnels, selectFunnel } = useFunnelStore.getState();
+      await loadFunnels();
+      selectFunnel('funnel-1');
+    });
+
+    it('should select stage', () => {
+      const { selectStage } = useFunnelStore.getState();
+      selectStage('stage-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedStage?.id).toBe('stage-1');
+    });
+
+    it('should create stage', async () => {
+      const newStage: FunnelStage = {
+        id: 'stage-3',
+        order: 2,
+        name: 'Stage 3',
+        filter_logic: 'AND',
+        rules: [],
+        match_action: 'continue',
+        no_match_action: 'exclude',
+      };
+
+      vi.mocked(apiClient.createStage).mockResolvedValue(newStage);
+
+      const { createStage } = useFunnelStore.getState();
+      await createStage('funnel-1', {
+        order: 2,
+        name: 'Stage 3',
+        filter_logic: 'AND',
+        rules: [],
+        match_action: 'continue',
+        no_match_action: 'exclude',
+      });
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel?.stages).toHaveLength(3);
+      expect(state.selectedFunnel?.stages[2].id).toBe('stage-3');
+    });
+
+    it('should update stage optimistically', async () => {
+      const updatedStage = { ...mockFunnel.stages[0], name: 'Updated Stage' };
+      vi.mocked(apiClient.updateStage).mockResolvedValue(updatedStage);
+
+      const { updateStage } = useFunnelStore.getState();
+      await updateStage('funnel-1', 'stage-1', { name: 'Updated Stage' });
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel?.stages[0].name).toBe('Updated Stage');
+    });
+
+    it('should delete stage optimistically', async () => {
+      vi.mocked(apiClient.deleteStage).mockResolvedValue();
+
+      const { deleteStage } = useFunnelStore.getState();
+      await deleteStage('funnel-1', 'stage-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel?.stages).toHaveLength(1);
+      expect(state.selectedFunnel?.stages[0].id).toBe('stage-2');
+    });
+
+    it('should reorder stages', async () => {
+      const updatedStage1 = { ...mockFunnel.stages[0], order: 1 };
+      const updatedStage2 = { ...mockFunnel.stages[1], order: 0 };
+
+      vi.mocked(apiClient.updateStage)
+        .mockResolvedValueOnce(updatedStage2)
+        .mockResolvedValueOnce(updatedStage1);
+
+      const { reorderStages } = useFunnelStore.getState();
+      await reorderStages('funnel-1', ['stage-2', 'stage-1']);
+
+      const state = useFunnelStore.getState();
+      expect(state.selectedFunnel?.stages[0].id).toBe('stage-2');
+      expect(state.selectedFunnel?.stages[0].order).toBe(0);
+      expect(state.selectedFunnel?.stages[1].id).toBe('stage-1');
+      expect(state.selectedFunnel?.stages[1].order).toBe(1);
+    });
+  });
+
+  describe('Run Operations', () => {
+    it('should run funnel', async () => {
+      vi.mocked(apiClient.runFunnel).mockResolvedValue(mockRun);
+
+      const { runFunnel } = useFunnelStore.getState();
+      const result = await runFunnel('funnel-1', { trigger_type: 'manual' });
+
+      expect(result).toEqual(mockRun);
+      expect(useFunnelStore.getState().runs).toHaveLength(1);
+    });
+
+    it('should load runs', async () => {
+      const mockResponse: PaginatedResponse<FunnelRun> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockRun],
+      };
+
+      vi.mocked(apiClient.getFunnelRuns).mockResolvedValue(mockResponse);
+
+      const { loadRuns } = useFunnelStore.getState();
+      await loadRuns('funnel-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.runs).toHaveLength(1);
+      expect(state.runs[0].id).toBe('run-1');
+    });
+
+    it('should cancel run', async () => {
+      const cancelledRun = { ...mockRun, status: 'cancelled' as const };
+      vi.mocked(apiClient.cancelFunnelRun).mockResolvedValue(cancelledRun);
+
+      const mockResponse: PaginatedResponse<FunnelRun> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockRun],
+      };
+
+      vi.mocked(apiClient.getFunnelRuns).mockResolvedValue(mockResponse);
+
+      const { loadRuns, cancelRun } = useFunnelStore.getState();
+      await loadRuns('funnel-1');
+
+      await cancelRun('run-1');
+
+      const state = useFunnelStore.getState();
+      expect(state.runs[0].status).toBe('cancelled');
+    });
+  });
+
+  describe('UI State Management', () => {
+    it('should set dirty flag', () => {
+      const { setDirty } = useFunnelStore.getState();
+      setDirty(true);
+
+      expect(useFunnelStore.getState().isDirty).toBe(true);
+
+      setDirty(false);
+
+      expect(useFunnelStore.getState().isDirty).toBe(false);
+    });
+
+    it('should clear error', () => {
+      const { clearError } = useFunnelStore.getState();
+
+      useFunnelStore.setState({ error: new Error('Test error') });
+      expect(useFunnelStore.getState().error).not.toBeNull();
+
+      clearError();
+
+      expect(useFunnelStore.getState().error).toBeNull();
+    });
+
+    it('should reset store', () => {
+      const mockResponse: PaginatedResponse<Funnel> = {
+        count: 1,
+        next: null,
+        previous: null,
+        results: [mockFunnel],
+      };
+
+      vi.mocked(apiClient.listFunnels).mockResolvedValue(mockResponse);
+
+      const { loadFunnels, reset } = useFunnelStore.getState();
+      loadFunnels();
+
+      reset();
+
+      const state = useFunnelStore.getState();
+      expect(state.funnels).toEqual([]);
+      expect(state.selectedFunnel).toBeNull();
+      expect(state.runs).toEqual([]);
+      expect(state.error).toBeNull();
+    });
+  });
+
+  describe('Factory Pattern', () => {
+    it('should create isolated store instances', () => {
+      const apiClient1 = createMockApiClient();
+      const apiClient2 = createMockApiClient();
+
+      const store1 = createFunnelStore(apiClient1);
+      const store2 = createFunnelStore(apiClient2);
+
+      // Modify store1
+      store1.setState({ isDirty: true });
+
+      // store2 should be independent
+      expect(store1.getState().isDirty).toBe(true);
+      expect(store2.getState().isDirty).toBe(false);
+    });
+  });
+});