@startsimpli/funnels 0.4.14 → 0.4.16

package/src/page/FunnelsPage.test.tsx

@@ -0,0 +1,383 @@
+/**
+ * The FunnelsPage composer's contract (bd startsim-em5mn).
+ *
+ * These assert the three things that make it a SHARED page rather than one
+ * app's screen, and the three the bead names as acceptance:
+ *
+ *   1. every list is paged BY THE SERVER (repo rule #8) — a page change is a
+ *      new request, never a slice of rows already in the browser;
+ *   2. the rule builder's vocabulary arrives from an INJECTED fields client,
+ *      so the surface that mounts it decides where `/fields/` lives;
+ *   3. nothing on this page evaluates the corpus in the browser.
+ *
+ * `@startsimpli/ui/table` is stubbed, so what is asserted is the CONFIG the
+ * composer hands UnifiedTable (`serverSide`, `totalCount`, `onPageChange`)
+ * rather than the shared table's own rendering, which has its own suite.
+ */
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { render, screen, waitFor, fireEvent } from '@testing-library/react';
+import { readFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+import * as React from 'react';
+
+/** The composer's own source — vitest runs with cwd at the package root. */
+const composerSource = () =>
+  readFileSync(resolve(process.cwd(), 'src/page/FunnelsPage.tsx'), 'utf8');
+
+const tableProps: any[] = [];
+
+vi.mock('@startsimpli/ui/table', () => ({
+  UnifiedTable: (props: any) => {
+    tableProps.push(props);
+    return (
+      <div data-testid={`table-${props.tableId}`}>
+        <span data-testid={`table-${props.tableId}-count`}>
+          {props.pagination?.totalCount ?? 0}
+        </span>
+        <button
+          type="button"
+          data-testid={`table-${props.tableId}-next`}
+          onClick={() => props.pagination?.onPageChange(props.pagination.currentPage + 1)}
+        >
+          next
+        </button>
+        {props.data.map((row: any) => (
+          <button
+            type="button"
+            key={props.getRowId(row)}
+            data-testid={`row-${props.getRowId(row)}`}
+            onClick={() => props.onRowClick?.(row)}
+          >
+            {props.columns.map((c: any) => (
+              <span key={c.id}>{c.cell ? c.cell(row) : String(row[c.accessorKey ?? c.id] ?? '')}</span>
+            ))}
+          </button>
+        ))}
+      </div>
+    );
+  },
+}));
+
+import { FunnelsPage } from './FunnelsPage';
+import { FunnelApiClient } from '../api/client';
+import { foundryTenantFunnelPaths, centralFunnelPaths } from '../api/paths';
+import type { ApiAdapter } from '../api/adapter';
+
+interface Call {
+  method: string;
+  url: string;
+  params?: Record<string, any>;
+  body?: any;
+}
+
+/** An adapter that records every call and answers from a routing table. */
+function recorder(routes: Array<[RegExp, (call: Call) => any]>) {
+  const calls: Call[] = [];
+  const answer = (call: Call) => {
+    calls.push(call);
+    for (const [pattern, handler] of routes) {
+      if (pattern.test(call.url)) return Promise.resolve(handler(call));
+    }
+    return Promise.reject(new Error(`no stub for ${call.method} ${call.url}`));
+  };
+  const adapter: ApiAdapter = {
+    get: (url, params) => answer({ method: 'GET', url, params }),
+    post: (url, body) => answer({ method: 'POST', url, body }),
+    patch: (url, body) => answer({ method: 'PATCH', url, body }),
+    delete: (url) => answer({ method: 'DELETE', url }),
+  };
+  return { adapter, calls };
+}
+
+const page = (results: any[], count = results.length) => ({
+  results,
+  count,
+  next: null,
+  previous: null,
+});
+
+const FUNNEL = {
+  id: 'f-1',
+  name: 'Seed-stage investors',
+  status: 'active',
+  entityType: 'investor',
+  stageCount: 2,
+  totalRuns: 3,
+  lastRunAt: '2026-09-18T10:00:00Z',
+  lastRunId: 'r-1',
+  lastRunMatched: 12,
+  tags: [],
+  stages: [
+    {
+      id: 's-1',
+      order: 0,
+      name: 'Has a check size',
+      filterLogic: 'AND',
+      rules: [],
+      matchAction: 'continue',
+      noMatchAction: 'exclude',
+    },
+  ],
+  createdAt: '2026-09-01T00:00:00Z',
+  updatedAt: '2026-09-18T10:00:00Z',
+};
+
+const RUN = {
+  id: 'r-1',
+  funnel: 'f-1',
+  status: 'completed',
+  triggerType: 'manual',
+  startedAt: '2026-09-18T10:00:00Z',
+  completedAt: '2026-09-18T10:00:30Z',
+  totalInput: 208_000,
+  totalMatched: 12,
+  totalExcluded: 207_988,
+  totalTagged: 0,
+  stageStats: {},
+  stageBreakdown: [],
+};
+
+const FIELDS = {
+  entity_type: null,
+  fields: [
+    {
+      key: 'contact.name',
+      label: 'Name',
+      category: 'Contact',
+      value_type: 'string',
+      enum_values: [],
+      allowed_operators: ['eq', 'contains'],
+    },
+  ],
+};
+
+function build(overrides: Array<[RegExp, (call: Call) => any]> = []) {
+  const { adapter, calls } = recorder([
+    ...overrides,
+    [/\/api\/v1\/funnels\/fields\/$/, () => FIELDS],
+    [/funnels\/f-1\/runs\/$/, (c) => (c.method === 'POST' ? { ...RUN, id: 'r-2', status: 'pending' } : page([RUN]))],
+    [/funnel-runs\/[^/]+\/results\/$/, () => page([
+      {
+        id: 'res-1',
+        entityId: 'e-1',
+        entityType: 'investor',
+        matched: true,
+        excludedAtStage: null,
+        stageReached: { id: 's-1', name: 'Has a check size', order: 0 },
+        exclusionReason: '',
+        context: {},
+        accumulatedTags: ['warm'],
+        createdAt: '2026-09-18T10:00:30Z',
+      },
+    ], 40)],
+    [/funnels\/f-1\/$/, () => FUNNEL],
+    [/funnels\/$/, (c) => (c.method === 'POST' ? { ...FUNNEL, id: 'f-new' } : page([FUNNEL], 40))],
+  ]);
+  const client = new FunnelApiClient(adapter, '', foundryTenantFunnelPaths('qafoundry'));
+  const fieldsClient = new FunnelApiClient(adapter, '', centralFunnelPaths);
+  return { client, fieldsClient, calls };
+}
+
+beforeEach(() => {
+  tableProps.length = 0;
+});
+
+describe('the funnel list is paged by the server (repo rule #8)', () => {
+  it('asks the injected client for one page, and tells the table so', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+
+    await screen.findByTestId('row-f-1');
+
+    const list = calls.find((c) => c.method === 'GET' && /tenants\/qafoundry\/funnels\/$/.test(c.url));
+    expect(list).toBeTruthy();
+    expect(list!.params).toMatchObject({ page: 1 });
+    expect(list!.params!.pageSize).toBeGreaterThan(0);
+
+    const cfg = tableProps.at(-1)!.pagination;
+    expect(cfg.serverSide).toBe(true);
+    // The count is the SERVER's, not the number of rows in the browser.
+    expect(cfg.totalCount).toBe(40);
+    expect(tableProps.at(-1)!.data).toHaveLength(1);
+  });
+
+  it('turning the page issues a new request rather than slicing what it holds', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+
+    const before = calls.filter((c) => /tenants\/qafoundry\/funnels\/$/.test(c.url)).length;
+    fireEvent.click(screen.getByTestId('table-funnels-next'));
+
+    await waitFor(() => {
+      const listCalls = calls.filter((c) => /tenants\/qafoundry\/funnels\/$/.test(c.url));
+      expect(listCalls.length).toBe(before + 1);
+      expect(listCalls.at(-1)!.params).toMatchObject({ page: 2 });
+    });
+  });
+
+  it('narrows by status and search ON THE SERVER, not in the browser', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+
+    fireEvent.change(screen.getByLabelText('Status'), { target: { value: 'active' } });
+    await waitFor(() => {
+      const last = calls.filter((c) => /tenants\/qafoundry\/funnels\/$/.test(c.url)).at(-1);
+      expect(last!.params).toMatchObject({ status: 'active', page: 1 });
+    });
+  });
+});
+
+describe('the builder is fed by the injected fields client', () => {
+  it('reads the vocabulary from the fields client, never the funnel path family', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+    fireEvent.click(screen.getByTestId('row-f-1'));
+
+    await waitFor(() => {
+      expect(calls.some((c) => c.url === '/api/v1/funnels/fields/')).toBe(true);
+    });
+    // The control plane does not mount funnels/fields/ — it is shadowed by the
+    // funnels/<funnel_id>/ action and 404s. Asking for it would be a bug.
+    expect(calls.some((c) => /tenants\/qafoundry\/funnels\/fields\//.test(c.url))).toBe(false);
+  });
+
+  it('hand-writes no field list of its own', () => {
+    const src = composerSource();
+    expect(src).not.toMatch(/allowedOperators:\s*\[/);
+    expect(src).toMatch(/getFields\(/);
+  });
+});
+
+describe('running a funnel', () => {
+  it('"Run now" POSTs to the funnel\'s runs collection and adopts the returned id', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+    fireEvent.click(screen.getByTestId('row-f-1'));
+
+    const runNow = await screen.findByRole('button', { name: /run now/i });
+    fireEvent.click(runNow);
+
+    await waitFor(() => {
+      const post = calls.find((c) => c.method === 'POST' && /funnels\/f-1\/runs\/$/.test(c.url));
+      expect(post).toBeTruthy();
+    });
+    // The id the POST returned is the id that completes (bd startsim-qv6pk).
+    expect(await screen.findByText(/r-2/)).toBeTruthy();
+  });
+
+  it('hides the write controls when the viewer cannot manage funnels', async () => {
+    const { client, fieldsClient } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage={false} />);
+    await screen.findByTestId('row-f-1');
+    expect(screen.queryByRole('button', { name: /new funnel/i })).toBeNull();
+  });
+});
+
+describe('results are filtered where the rows are', () => {
+  it('sends stage-reached and outcome to the server as query params', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+    fireEvent.click(screen.getByTestId('row-f-1'));
+
+    fireEvent.click(await screen.findByRole('tab', { name: /results/i }));
+    await screen.findByTestId('table-funnel-results');
+
+    fireEvent.change(screen.getByLabelText('Stage reached'), { target: { value: 's-1' } });
+    await waitFor(() => {
+      const last = calls.filter((c) => /results\/$/.test(c.url)).at(-1);
+      expect(last!.params).toMatchObject({ stage: 's-1' });
+    });
+
+    fireEvent.change(screen.getByLabelText('Outcome'), { target: { value: 'true' } });
+    await waitFor(() => {
+      const last = calls.filter((c) => /results\/$/.test(c.url)).at(-1);
+      expect(last!.params).toMatchObject({ matched: true });
+    });
+  });
+
+  it('pages the results on the server too', async () => {
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+    fireEvent.click(screen.getByTestId('row-f-1'));
+    fireEvent.click(await screen.findByRole('tab', { name: /results/i }));
+    await screen.findByTestId('table-funnel-results');
+
+    const cfg = tableProps.filter((p) => p.tableId === 'funnel-results').at(-1)!.pagination;
+    expect(cfg.serverSide).toBe(true);
+    expect(cfg.totalCount).toBe(40);
+
+    const before = calls.filter((c) => /results\/$/.test(c.url)).length;
+    fireEvent.click(screen.getByTestId('table-funnel-results-next'));
+    await waitFor(() => {
+      expect(calls.filter((c) => /results\/$/.test(c.url)).length).toBe(before + 1);
+    });
+  });
+});
+
+describe('the corpus never reaches the browser', () => {
+  it('drives no in-memory evaluation and asks for no preview', () => {
+    const src = composerSource();
+    // core/engine.ts evaluates an in-memory array; the corpus is ~208k rows.
+    expect(src).not.toMatch(/FunnelEngine|filterEntities|evaluateRules/);
+    // Neither preview path exists on the control plane (no `preview` action on
+    // FoundryViewSet), and previewFunnelServer would make the CALLER ship the
+    // entities. The run is the preview.
+    expect(src).not.toMatch(/previewFunnel/);
+  });
+});
+
+describe('saving a funnel', () => {
+  it('drops a stage id the builder minted, and keeps one the server assigned', async () => {
+    // FunnelStageBuilder mints `stage-<ts>-<rand>` for a newly added stage so
+    // its list has a stable React key. FunnelStageSerializer.id is a UUIDField,
+    // so sending it back is a 400 — verified against a live control plane
+    // 2026-09-18. A server-assigned UUID must survive, because the reconciler
+    // keys stage identity on it (stage_stats, reached_stage_id).
+    const { client, fieldsClient, calls } = build();
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+    fireEvent.click(screen.getByTestId('row-f-1'));
+    await screen.findByTestId('funnel-detail');
+
+    fireEvent.click(screen.getByRole('button', { name: /^save$/i }));
+
+    await waitFor(() => {
+      const patch = calls.find((c) => c.method === 'PATCH');
+      expect(patch).toBeTruthy();
+    });
+    const patch = calls.find((c) => c.method === 'PATCH')!;
+    // s-1 is not a UUID -> dropped, so the server creates the stage instead of
+    // rejecting the whole payload.
+    expect(patch.body.stages[0]).not.toHaveProperty('id');
+    expect(patch.body.stages[0].name).toBe('Has a check size');
+  });
+
+  it('keeps a real UUID stage id', async () => {
+    const uuid = '3f1b0c7e-9a2d-4c51-8e6f-1a2b3c4d5e6f';
+    const { adapter, calls } = recorder([
+      [/\/api\/v1\/funnels\/fields\/$/, () => FIELDS],
+      [/funnels\/f-1\/$/, () => ({
+        ...FUNNEL,
+        stages: [{ ...FUNNEL.stages[0], id: uuid }],
+      })],
+      [/funnels\/$/, () => page([FUNNEL], 1)],
+    ]);
+    const client = new FunnelApiClient(adapter, '', foundryTenantFunnelPaths('qafoundry'));
+    const fieldsClient = new FunnelApiClient(adapter, '', centralFunnelPaths);
+
+    render(<FunnelsPage client={client} fieldsClient={fieldsClient} canManage />);
+    await screen.findByTestId('row-f-1');
+    fireEvent.click(screen.getByTestId('row-f-1'));
+    await screen.findByTestId('funnel-detail');
+    fireEvent.click(screen.getByRole('button', { name: /^save$/i }));
+
+    await waitFor(() => expect(calls.some((c) => c.method === 'PATCH')).toBe(true));
+    expect(calls.find((c) => c.method === 'PATCH')!.body.stages[0].id).toBe(uuid);
+  });
+});