cursedbelt 2.7.0 → 3.0.0

package/src/react/studios/detailSurfaces.spec.tsx

@@ -1,558 +0,0 @@
-/**
- * The six detail surfaces (03 §1e) — the reachability assertions.
- *
- * Each pins a way the near side can look right and be wrong, which is the only
- * kind of defect worth a test on a screen this simple:
- *
- *   * a detail view that reads the LISTING instead of its subject shows whatever
- *     happens to be on page 1 — plausible, and never the thing you asked for;
- *   * a detail view that reports "not found" while it is still loading makes
- *     every navigation flash an error;
- *   * an editor picker that does not filter by kind offers a PDF to a video
- *     trimmer;
- *   * a trim plan with the wrong window produces a perfectly valid video of the
- *     wrong seconds, which "the upload succeeded" never catches;
- *   * a derived upload that posts a JSON envelope, or an unencoded name, is the
- *     03 §1c footgun in a second place;
- *   * a note editor that re-seeds its draft from every refetch loses the sentence
- *     you are typing the moment another tab writes.
- *
- * Every manifest is derived through `verifyAppConfig` (Law #4 / the
- * `manifestFidelity` gate): these views must be reachable in an app the PIPELINE
- * would produce, not in one a test hand-built.
- */
-import { afterEach, describe, expect, test } from 'bun:test';
-import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { createCcRouter, type HistoryLike } from '../../client/router';
-import type { EngineId } from '../../config/appConfig';
-import type { MediaItemView, RecordDetailView } from '../../server/mixins/services';
-import { ApiError } from '../../shared/errors';
-import type { EffectiveManifest } from '../../verify/types';
-import { verifyAppConfig } from '../../verify/pipeline';
-import { EngineDataProvider } from '../data/EngineDataProvider';
-import type { EngineClient, EngineRequestInit } from '../data/engineClient';
-import { CCAppShell } from '../shell/CCAppShell';
-import { CCPortalProvider } from '../portal/CCPortalProvider';
-import { buildTrimPlan, uploadDerivedAsset } from './BoundAssetDetails';
-import { AssetStudioView, KnowledgeStudioView } from './BoundStudios';
-import { ImageStudioShell, VideoEditorShell, toPlayableVideo } from './AssetDetailShells';
-import type { StudioInstance } from './types';
-
-afterEach(cleanup);
-
-const present = (selector: string): boolean => document.querySelector(selector) !== null;
-const all = (selector: string): Element[] => [...document.querySelectorAll(selector)];
-
-const FULL_CAPS = {
-  ffmpeg: true,
-  wasm: true,
-  shell: true,
-  aiProvider: true,
-  diskIndex: true,
-  network: true,
-  ocrRuntime: true,
-  git: true,
-};
-
-const derive = async (config: unknown): Promise<EffectiveManifest> => {
-  const result = await verifyAppConfig({ config, moment: 'ci', capabilities: FULL_CAPS });
-  expect(result.ok, `config must verify: ${JSON.stringify(result.diagnostics)}`).toBe(true);
-  if (!result.manifest) throw new Error('pipeline produced no manifest');
-  return result.manifest;
-};
-
-const memoryHistory = (path: string): HistoryLike => ({
-  path,
-  push: () => undefined,
-  replace: () => undefined,
-  listen: () => () => undefined,
-});
-
-interface Call {
-  path: string;
-  init?: EngineRequestInit;
-}
-
-/** A client that records every call and answers from a path→body table. */
-const recordingClient = (
-  answer: (path: string, init?: EngineRequestInit) => unknown,
-): { client: EngineClient; calls: Call[] } => {
-  const calls: Call[] = [];
-  return {
-    calls,
-    client: {
-      url: (path: string) => path,
-      request: async <T,>(path: string, init?: EngineRequestInit) => {
-        calls.push({ path, init });
-        return answer(path, init) as T;
-      },
-    } as EngineClient,
-  };
-};
-
-/**
- * Render one bound engine view through the real router.
- *
- * `route.path` is the TEMPLATE (`/note/:noteId`) and `at` is where the browser
- * is (`/note/note_1`) — keeping them separate is the point: a param-bearing view
- * is only reachable if the router extracted the param, and a test that registered
- * the concrete path as its template would prove nothing about that.
- */
-const renderView = async (
-  manifest: EffectiveManifest,
-  client: EngineClient,
-  route: { path: string; instanceId: string; engine: EngineId; view: string; params: string[] },
-  at: string,
-  node: React.ReactElement,
-  settled: string,
-) => {
-  const router = createCcRouter({
-    routes: [{ ...route, load: () => Promise.resolve({ default: () => null }) }],
-    manifest,
-    tenantId: 't_local',
-    history: memoryHistory(at),
-  });
-  await router.start();
-  const view = render(
-    <CCAppShell manifest={manifest} router={router} claims={null}>
-      <EngineDataProvider client={client} hub={null} overlay={null}>
-        {node}
-      </EngineDataProvider>
-    </CCAppShell>,
-  );
-  await waitFor(() => expect(present(settled)).toBe(true));
-  return view;
-};
-
-/* ------------------------------------------------------------- asset */
-
-/**
- * A media app with all three detail views on.
- *
- * The second instance is not decoration: `editor` makes the asset engine's
- * `video-in` port REQUIRED (an editor with no source of clips is a dead pane), so
- * a single-instance config is refused by V3. Wiring a video feed's
- * `selection-out` into it is exactly the shape a real editor app has.
- */
-const assetConfig = {
-  configVersion: 1,
-  app: { id: 'media-app', title: 'Media' },
-  engines: ['asset'],
-  instances: [
-    {
-      engine: 'asset',
-      id: 'feed',
-      features: { video: true },
-      routes: [{ path: '/feed', view: 'video-feed' }],
-    },
-    {
-      engine: 'asset',
-      id: 'lib',
-      features: { gallery: true, video: true, hls: true, editor: true, imageStudio: true },
-      routes: [
-        { path: '/gallery', view: 'gallery' },
-        { path: '/video/:videoId', view: 'video-detail' },
-        { path: '/edit', view: 'video-editor' },
-      ],
-    },
-  ],
-  connections: [{ from: 'feed:selection-out', to: 'lib:video-in' }],
-};
-
-const videoRoute = {
-  path: '/video/:videoId',
-  instanceId: 'lib',
-  engine: 'asset' as EngineId,
-  view: 'video-detail',
-  params: ['videoId'],
-};
-
-const item = (over: Partial<MediaItemView> = {}): MediaItemView => ({
-  id: 'itm_1',
-  kind: 'video',
-  title: 'Holiday.mp4',
-  streamUrl: '/api/asset/items/itm_1/bytes',
-  ...over,
-});
-
-describe('video-detail (03 §1e)', () => {
-  test('reads the ROUTE PARAM’s item, not the listing, and plays it', async () => {
-    const { client, calls } = recordingClient(() => ({ item: item({ hlsUrl: '/hls/itm_1.m3u8' }) }));
-    const manifest = await derive(assetConfig);
-    await renderView(
-      manifest,
-      client,
-      videoRoute,
-      '/video/itm_1',
-      <AssetStudioView />,
-      '[data-cc-view="video-detail"]',
-    );
-
-    // The subject came from the URL the router matched.
-    expect(calls.map((call) => call.path)).toEqual(['/api/asset/items/itm_1']);
-    // …and the catalogue listing was NOT fetched underneath a detail screen.
-    expect(calls.some((call) => call.path === '/api/asset/items')).toBe(false);
-    expect(document.querySelector('[data-cc-item]')?.getAttribute('data-cc-item')).toBe('itm_1');
-    // An HLS ladder exists, so the surface says so — "why is this buffering" is
-    // answerable from the screen.
-    expect(screen.getByText('adaptive')).toBeDefined();
-  });
-
-  test('a settled-empty read is "no longer available" — and loading is NOT', async () => {
-    const { client } = recordingClient(() => ({}));
-    const manifest = await derive(assetConfig);
-    await renderView(
-      manifest,
-      client,
-      videoRoute,
-      '/video/gone',
-      <AssetStudioView />,
-      '[data-cc-view="video-detail"]',
-    );
-    await waitFor(() => expect(screen.getByText(/no longer available/)).toBeDefined());
-    // The three states stay three: nothing rendered as the item.
-    expect(present('[data-cc-item]')).toBe(false);
-  });
-
-  test('a still renders as an image and a plain file as a download, never a broken player', async () => {
-    const { client } = recordingClient(() => ({ item: item({ id: 'itm_pdf', kind: 'file', title: 'notes.pdf' }) }));
-    const manifest = await derive(assetConfig);
-    await renderView(
-      manifest,
-      client,
-      videoRoute,
-      '/video/itm_pdf',
-      <AssetStudioView />,
-      '[data-cc-view="video-detail"]',
-    );
-    await waitFor(() => expect(present('[data-cc-download]')).toBe(true));
-    expect(present('[data-testid="video-player"]')).toBe(false);
-  });
-
-  test('the player unit carries the SERVER’s urls verbatim', () => {
-    expect(
-      toPlayableVideo({ id: 'a', name: 'A', kind: 'video', streamUrl: '/s', hlsUrl: '/h' }),
-    ).toEqual({ id: 'a', name: 'A', streamUrl: '/s', hlsUrl: '/h' });
-  });
-});
-
-/* ------------------------------------------------ editors (asset) */
-
-const instance: StudioInstance = {
-  id: 'lib',
-  engine: 'asset',
-  effective: { gallery: true, video: true, editor: true, imageStudio: true },
-  effectiveFeaturesHash: 'h1',
-};
-
-const wrap = (node: React.ReactElement) => render(<CCPortalProvider>{node}</CCPortalProvider>);
-
-describe('video-editor / image-studio pickers (03 §1e)', () => {
-  test('the video picker offers only the videos it was given', async () => {
-    const { client } = recordingClient((path) =>
-      path === '/api/asset/items'
-        ? {
-            items: [
-              item({ id: 'v1', kind: 'video', title: 'One.mp4' }),
-              item({ id: 'p1', kind: 'photo', title: 'Snap.jpg' }),
-              item({ id: 'f1', kind: 'file', title: 'notes.pdf' }),
-            ],
-          }
-        : {},
-    );
-    const manifest = await derive(assetConfig);
-    await renderView(
-      manifest,
-      client,
-      { path: '/edit', instanceId: 'lib', engine: 'asset' as EngineId, view: 'video-editor', params: [] },
-      '/edit',
-      <AssetStudioView />,
-      '[data-cc-view="video-editor"]',
-    );
-    await waitFor(() => expect(all('[data-cc-picker="video"] [data-cc-row]').length).toBe(1));
-    expect(all('[data-cc-picker="video"] [data-cc-row]')[0]?.getAttribute('data-cc-row')).toBe('v1');
-  });
-
-  test('an editor with nothing to edit asks for a pick instead of opening', () => {
-    wrap(<VideoEditorShell instance={instance} videos={[]} />);
-    expect(screen.getByText('Pick a video to trim.')).toBeDefined();
-    expect(present('[data-cc-open-trimmer]')).toBe(false);
-  });
-
-  test('the image studio reports a save failure ON the control', () => {
-    wrap(
-      <ImageStudioShell
-        instance={instance}
-        images={[{ id: 'p1', name: 'Snap.jpg', url: '/bytes/p1' }]}
-        activeId='p1'
-        error='Storage limit reached.'
-      />,
-    );
-    expect(document.querySelector('[data-cc-save-error]')?.textContent).toContain('Storage limit reached.');
-  });
-});
-
-describe('the trim plan (03 §1e)', () => {
-  test('compiles the CHOSEN window, names a derived output and maps the source file', () => {
-    const { plan, sourceName, outputName } = buildTrimPlan(
-      { id: 'v1', name: 'Holiday.mp4' },
-      { startSeconds: 12, endSeconds: 20, format: 'mp4', quality: 'medium' },
-    );
-    expect(outputName).toBe('Holiday-trim.mp4');
-    expect(sourceName).toBe('source.mp4');
-    // The executor materializes the bytes under the name the plan expects.
-    expect(plan.requiredAssetIds).toEqual(['v1']);
-    // The window is the user's, in seconds, on the first command.
-    const first = plan.commands[0]?.args.join(' ') ?? '';
-    expect(first).toContain('-ss 12');
-    expect(first).toContain('-to 20');
-    expect(plan.outputName).toBe('Holiday-trim.mp4');
-  });
-
-  test('a webm export names a webm source and output — never a mislabeled container', () => {
-    const { sourceName, outputName } = buildTrimPlan(
-      { id: 'v1', name: 'clip.mov' },
-      { startSeconds: 0, endSeconds: 1, format: 'webm', quality: 'low' },
-    );
-    expect(sourceName).toBe('source.webm');
-    expect(outputName).toBe('clip-trim.webm');
-  });
-});
-
-describe('the derived-asset upload (03 §1e)', () => {
-  test('streams the blob as the RAW body with a percent-encoded name', async () => {
-    const { client, calls } = recordingClient(() => ({ id: 'itm_new' }));
-    const blob = new Blob(['bytes'], { type: 'video/mp4' });
-
-    await uploadDerivedAsset(client, blob, 'café-trim.mp4');
-
-    expect(calls).toHaveLength(1);
-    expect(calls[0]?.path).toBe('/api/asset/upload');
-    expect(calls[0]?.init?.method).toBe('POST');
-    expect(calls[0]?.init?.rawBody).toBe(blob);
-    expect(calls[0]?.init?.body).toBeUndefined();
-    expect(calls[0]?.init?.headers?.['x-cc-filename']).toBe('caf%C3%A9-trim.mp4');
-    expect(calls[0]?.init?.headers?.['content-type']).toBe('video/mp4');
-  });
-
-  test('a typeless blob still declares a content type the server can store', async () => {
-    const { client, calls } = recordingClient(() => ({ id: 'itm_new' }));
-    await uploadDerivedAsset(client, new Blob(['x']), 'x.bin');
-    expect(calls[0]?.init?.headers?.['content-type']).toBe('application/octet-stream');
-  });
-});
-
-/* --------------------------------------------------------- knowledge */
-
-const knowledgeConfig = {
-  configVersion: 1,
-  app: { id: 'notes-app', title: 'Notes' },
-  engines: ['knowledge'],
-  instances: [
-    {
-      engine: 'knowledge',
-      id: 'kn',
-      features: { notes: true, todos: true, ragChat: true, textCompare: true },
-      routes: [
-        { path: '/notes', view: 'notes' },
-        { path: '/note/:noteId', view: 'note' },
-        { path: '/chat/:conversationId', view: 'conversation' },
-        { path: '/compare', view: 'text-compare' },
-      ],
-    },
-  ],
-};
-
-const noteRoute = {
-  path: '/note/:noteId',
-  instanceId: 'kn',
-  engine: 'knowledge' as EngineId,
-  view: 'note',
-  params: ['noteId'],
-};
-const conversationRoute = {
-  path: '/chat/:conversationId',
-  instanceId: 'kn',
-  engine: 'knowledge' as EngineId,
-  view: 'conversation',
-  params: ['conversationId'],
-};
-
-const record = (over: Partial<RecordDetailView> = {}): RecordDetailView => ({
-  id: 'note_1',
-  type: 'note',
-  title: 'Groceries',
-  bodyMd: 'milk\neggs',
-  pinned: false,
-  archived: false,
-  tenantId: 't_local',
-  updatedAt: '2026-07-25T00:00:00.000Z',
-  ...over,
-});
-
-describe('note (03 §1e)', () => {
-  test('renders the BODY and the satellite the listing projection drops', async () => {
-    const { client, calls } = recordingClient(() => ({
-      entity: record({
-        type: 'todo',
-        todo: { status: 'open', priority: 2, dueAt: '2026-08-01T00:00:00.000Z', position: 1 },
-      }),
-    }));
-    const manifest = await derive(knowledgeConfig);
-    await renderView(
-      manifest,
-      client,
-      noteRoute,
-      '/note/note_1',
-      <KnowledgeStudioView />,
-      '[data-cc-view="note"]',
-    );
-
-    expect(calls.map((call) => call.path)).toEqual(['/api/knowledge/entity/note_1']);
-    // The spine listing is not read on a detail screen.
-    expect(calls.some((call) => call.path === '/api/knowledge/records')).toBe(false);
-    expect((document.querySelector('[data-cc-note-body]') as HTMLTextAreaElement).value).toBe('milk\neggs');
-    // The satellite — the whole reason `getRecordFull` was wired to the wire.
-    expect(document.querySelector('[data-cc-satellite]')?.textContent).toContain('open');
-  });
-
-  test('save is armed only by a real edit, and PATCHes the route', async () => {
-    const { client, calls } = recordingClient(() => ({ entity: record() }));
-    const manifest = await derive(knowledgeConfig);
-    await renderView(
-      manifest,
-      client,
-      noteRoute,
-      '/note/note_1',
-      <KnowledgeStudioView />,
-      '[data-cc-view="note"]',
-    );
-    await waitFor(() => expect(present('[data-cc-note-save]')).toBe(true));
-
-    // Untouched ⇒ disabled: a save that always fires writes a no-op row, and a
-    // no-op row is a CDC frame every other tab re-pulls for.
-    expect((document.querySelector('[data-cc-note-save]') as HTMLButtonElement).disabled).toBe(true);
-
-    fireEvent.change(document.querySelector('[data-cc-note-body]') as Element, {
-      target: { value: 'milk\neggs\nbread' },
-    });
-    fireEvent.click(document.querySelector('[data-cc-note-save]') as Element);
-
-    await waitFor(() => expect(calls.some((call) => call.init?.method === 'PATCH')).toBe(true));
-    const patch = calls.find((call) => call.init?.method === 'PATCH');
-    expect(patch?.path).toBe('/api/knowledge/entity/note_1');
-    expect(patch?.init?.body).toEqual({ title: 'Groceries', bodyMd: 'milk\neggs\nbread' });
-    // A save failure belongs on the form, not in the app-error overlay.
-    expect(patch?.init?.silent).toBe(true);
-  });
-
-  test('a background re-read does NOT overwrite the draft you are typing', async () => {
-    let body = 'milk';
-    const { client } = recordingClient(() => ({ entity: record({ bodyMd: body }) }));
-    const manifest = await derive(knowledgeConfig);
-    await renderView(
-      manifest,
-      client,
-      noteRoute,
-      '/note/note_1',
-      <KnowledgeStudioView />,
-      '[data-cc-view="note"]',
-    );
-    await waitFor(() =>
-      expect((document.querySelector('[data-cc-note-body]') as HTMLTextAreaElement).value).toBe('milk'),
-    );
-
-    fireEvent.change(document.querySelector('[data-cc-note-body]') as Element, {
-      target: { value: 'milk and honey' },
-    });
-    // Someone else writes; the resource re-pulls the same record with new text.
-    body = 'milk, eggs';
-    fireEvent.change(document.querySelector('[data-cc-note-title]') as Element, {
-      target: { value: 'Groceries!' },
-    });
-
-    expect((document.querySelector('[data-cc-note-body]') as HTMLTextAreaElement).value).toBe('milk and honey');
-  });
-});
-
-describe('conversation (03 §1e)', () => {
-  test('an ask hits the SEARCH route and keeps the answer on its own turn', async () => {
-    const { client, calls } = recordingClient(() => ({ items: [record({ id: 'note_hit', title: 'Milk' })] }));
-    const manifest = await derive(knowledgeConfig);
-    await renderView(
-      manifest,
-      client,
-      conversationRoute,
-      '/chat/conv_1',
-      <KnowledgeStudioView />,
-      '[data-cc-view="conversation"]',
-    );
-
-    // Nothing is read until a question is asked — a conversation is not a listing.
-    expect(calls).toHaveLength(0);
-    expect(document.querySelector('[data-cc-conversation]')?.getAttribute('data-cc-conversation')).toBe('conv_1');
-
-    fireEvent.change(document.querySelector('[data-cc-ask-input]') as Element, { target: { value: 'where is the milk' } });
-    fireEvent.click(document.querySelector('[data-cc-ask]') as Element);
-
-    await waitFor(() => expect(present('[data-cc-hit="note_hit"]')).toBe(true));
-    expect(calls[0]?.path).toBe('/api/knowledge/search');
-    expect(calls[0]?.init?.query).toEqual({ q: 'where is the milk' });
-    expect(screen.getByText('where is the milk')).toBeDefined();
-  });
-
-  test('a failed turn keeps its question and names the failure on that turn', async () => {
-    const { client } = recordingClient(() => {
-      throw new ApiError(503, 'The AI provider is unavailable.', { code: 'AI_DRIVER_UNAVAILABLE' });
-    });
-    const manifest = await derive(knowledgeConfig);
-    await renderView(
-      manifest,
-      client,
-      conversationRoute,
-      '/chat/conv_1',
-      <KnowledgeStudioView />,
-      '[data-cc-view="conversation"]',
-    );
-
-    fireEvent.change(document.querySelector('[data-cc-ask-input]') as Element, { target: { value: 'anything' } });
-    fireEvent.click(document.querySelector('[data-cc-ask]') as Element);
-
-    await waitFor(() => expect(present('[data-cc-turn-error]')).toBe(true));
-    // The question survives the failure — a transcript that eats it is unreadable.
-    expect(screen.getByText('anything')).toBeDefined();
-    expect(document.querySelector('[data-cc-turn-error]')?.textContent).toContain('unavailable');
-  });
-});
-
-describe('text-compare (03 §1e)', () => {
-  test('diffs the two panes and needs no route of its own', async () => {
-    const { client, calls } = recordingClient((path) =>
-      path === '/api/knowledge/records' ? { items: [record()] } : { entity: record() },
-    );
-    const manifest = await derive(knowledgeConfig);
-    await renderView(
-      manifest,
-      client,
-      { path: '/compare', instanceId: 'kn', engine: 'knowledge' as EngineId, view: 'text-compare', params: [] },
-      '/compare',
-      <KnowledgeStudioView />,
-      '[data-cc-view="text-compare"]',
-    );
-
-    fireEvent.change(document.querySelector('[data-cc-pane-text="left"]') as Element, {
-      target: { value: 'a\nb\nc' },
-    });
-    fireEvent.change(document.querySelector('[data-cc-pane-text="right"]') as Element, {
-      target: { value: 'a\nB\nc' },
-    });
-
-    await waitFor(() =>
-      expect(document.querySelector('[data-cc-diff-summary]')?.getAttribute('data-cc-diff-summary')).toBe('1/1/2'),
-    );
-    expect(all('[data-cc-diff-op="removed"]')).toHaveLength(1);
-    expect(all('[data-cc-diff-op="added"]')).toHaveLength(1);
-    // The only reads are the records list (for the pickers) — no compare route exists.
-    expect(calls.every((call) => call.path === '/api/knowledge/records')).toBe(true);
-  });
-});