@semiont/react-ui 0.2.33-build.81 → 0.2.33-build.83

package/src/features/resource-viewer/__tests__/AnnotationCreationPending.test.tsx

@@ -0,0 +1,312 @@
+/**
+ * Regression test: pendingAnnotation cleared after annotation:create succeeds
+ *
+ * Bug: handleAnnotationCreate in useDetectionFlow called the API and emitted
+ * annotation:created, but never called setPendingAnnotation(null). The pending
+ * creation form (e.g. "Create Reference", "Save" assessment) remained visible
+ * after the user clicked the confirm button.
+ *
+ * Fix: setPendingAnnotation(null) added in handleAnnotationCreate on success,
+ * before emitting annotation:created.
+ *
+ * This test covers all four motivations that have a pending form:
+ * - linking  (ReferencesPanel: "Create Reference" button)
+ * - assessing (AssessmentPanel: "Save" button)
+ * - commenting (CommentsPanel: "Save" button)
+ * - tagging   (TaggingPanel: category selection)
+ */
+
+import React from 'react';
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import { act } from 'react';
+import { useDetectionFlow } from '../../../hooks/useDetectionFlow';
+import { EventBusProvider, useEventBus, resetEventBusForTesting } from '../../../contexts/EventBusContext';
+import { ApiClientProvider } from '../../../contexts/ApiClientContext';
+import { AuthTokenProvider } from '../../../contexts/AuthTokenContext';
+import { SemiontApiClient } from '@semiont/api-client';
+import { resourceUri } from '@semiont/api-client';
+import type { Emitter } from 'mitt';
+import type { EventMap } from '../../../contexts/EventBusContext';
+import type { Motivation, Selector } from '@semiont/api-client';
+
+const TEST_URI = resourceUri('http://localhost:4000/resources/test-resource');
+
+const MOCK_ANNOTATION = {
+  id: 'http://localhost:4000/annotations/new-1',
+  type: 'Annotation',
+  motivation: 'linking' as Motivation,
+  target: { source: TEST_URI },
+  body: [],
+};
+
+const TEXT_SELECTOR: Selector = {
+  type: 'TextQuoteSelector',
+  exact: 'some selected text',
+};
+
+const SVG_SELECTOR: Selector = {
+  type: 'SvgSelector',
+  value: '<rect x="10" y="20" width="100" height="50"/>',
+};
+
+// ─── Helper ───────────────────────────────────────────────────────────────────
+
+function renderDetectionFlow(testUri: string) {
+  let eventBusInstance: Emitter<EventMap>;
+
+  function EventBusCapture() {
+    eventBusInstance = useEventBus();
+    return null;
+  }
+
+  function DetectionFlowHarness() {
+    const { pendingAnnotation } = useDetectionFlow(testUri as any);
+    return (
+      <div>
+        <div data-testid="pending-motivation">
+          {pendingAnnotation ? pendingAnnotation.motivation : 'none'}
+        </div>
+      </div>
+    );
+  }
+
+  render(
+    <EventBusProvider>
+      <AuthTokenProvider token={null}>
+        <ApiClientProvider baseUrl="http://localhost:4000">
+          <EventBusCapture />
+          <DetectionFlowHarness />
+        </ApiClientProvider>
+      </AuthTokenProvider>
+    </EventBusProvider>
+  );
+
+  return {
+    getEventBus: () => eventBusInstance,
+    emit: <K extends keyof EventMap>(event: K, payload: EventMap[K]) => {
+      eventBusInstance.emit(event, payload);
+    },
+  };
+}
+
+// ─── Tests ────────────────────────────────────────────────────────────────────
+
+describe('Annotation creation clears pendingAnnotation', () => {
+  let createAnnotationSpy: ReturnType<typeof vi.spyOn>;
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    resetEventBusForTesting();
+    createAnnotationSpy = vi
+      .spyOn(SemiontApiClient.prototype, 'createAnnotation')
+      .mockResolvedValue({ annotation: MOCK_ANNOTATION } as any);
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it('clears pendingAnnotation after creating a reference (linking)', async () => {
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    // Set a pending annotation
+    act(() => {
+      emit('annotation:requested', { selector: TEXT_SELECTOR, motivation: 'linking' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('linking');
+    });
+
+    // Emit annotation:create (what ReferencesPanel does when user clicks "Create Reference")
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'linking',
+        selector: TEXT_SELECTOR,
+        body: [{ type: 'TextualBody', value: 'Person', purpose: 'tagging' }],
+      });
+    });
+
+    // pendingAnnotation must be cleared
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('none');
+    });
+
+    expect(createAnnotationSpy).toHaveBeenCalledTimes(1);
+  });
+
+  it('clears pendingAnnotation after creating an assessment (assessing)', async () => {
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    act(() => {
+      emit('annotation:requested', { selector: SVG_SELECTOR, motivation: 'assessing' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('assessing');
+    });
+
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'assessing',
+        selector: SVG_SELECTOR,
+        body: [{ type: 'TextualBody', value: 'Looks good', purpose: 'assessing' }],
+      });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('none');
+    });
+  });
+
+  it('clears pendingAnnotation after creating an assessment with empty body (optional text)', async () => {
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    act(() => {
+      emit('annotation:requested', { selector: SVG_SELECTOR, motivation: 'assessing' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('assessing');
+    });
+
+    // Empty body is valid for assessments
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'assessing',
+        selector: SVG_SELECTOR,
+        body: [],
+      });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('none');
+    });
+  });
+
+  it('clears pendingAnnotation after creating a comment (commenting)', async () => {
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    act(() => {
+      emit('annotation:requested', { selector: TEXT_SELECTOR, motivation: 'commenting' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('commenting');
+    });
+
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'commenting',
+        selector: TEXT_SELECTOR,
+        body: [{ type: 'TextualBody', value: 'Great point', purpose: 'commenting' }],
+      });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('none');
+    });
+  });
+
+  it('clears pendingAnnotation after creating a tag (tagging)', async () => {
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    act(() => {
+      emit('annotation:requested', { selector: SVG_SELECTOR, motivation: 'tagging' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('tagging');
+    });
+
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'tagging',
+        selector: SVG_SELECTOR,
+        body: [{ type: 'TextualBody', value: 'concept:trust', purpose: 'tagging' }],
+      });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('none');
+    });
+  });
+
+  it('emits annotation:created after successful creation', async () => {
+    const { emit, getEventBus } = renderDetectionFlow(TEST_URI);
+
+    const createdListener = vi.fn();
+    // Set listener after first render so eventBus is captured
+    await waitFor(() => expect(getEventBus()).toBeDefined());
+    getEventBus().on('annotation:created', createdListener);
+
+    act(() => {
+      emit('annotation:requested', { selector: TEXT_SELECTOR, motivation: 'linking' });
+    });
+
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'linking',
+        selector: TEXT_SELECTOR,
+        body: [],
+      });
+    });
+
+    await waitFor(() => {
+      expect(createdListener).toHaveBeenCalledTimes(1);
+      expect(createdListener).toHaveBeenCalledWith({ annotation: MOCK_ANNOTATION });
+    });
+  });
+
+  it('does NOT clear pendingAnnotation if API call fails', async () => {
+    createAnnotationSpy.mockRejectedValueOnce(new Error('Network error'));
+
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    act(() => {
+      emit('annotation:requested', { selector: TEXT_SELECTOR, motivation: 'linking' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('linking');
+    });
+
+    await act(async () => {
+      emit('annotation:create', {
+        motivation: 'linking',
+        selector: TEXT_SELECTOR,
+        body: [],
+      });
+    });
+
+    // Give async rejection time to settle
+    await waitFor(() => {
+      // pending should remain — user can retry or cancel
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('linking');
+    });
+  });
+
+  it('clears pendingAnnotation on cancel (annotation:cancel-pending)', async () => {
+    const { emit } = renderDetectionFlow(TEST_URI);
+
+    act(() => {
+      emit('annotation:requested', { selector: TEXT_SELECTOR, motivation: 'assessing' });
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('assessing');
+    });
+
+    act(() => {
+      emit('annotation:cancel-pending', undefined);
+    });
+
+    await waitFor(() => {
+      expect(screen.getByTestId('pending-motivation')).toHaveTextContent('none');
+    });
+
+    // API should NOT have been called on cancel
+    expect(createAnnotationSpy).not.toHaveBeenCalled();
+  });
+});

package/src/features/resource-viewer/__tests__/GenerationFlowIntegration.test.tsx

@@ -23,11 +23,11 @@ import { render, screen, waitFor } from '@testing-library/react';
 import { act } from 'react';
 import { useGenerationFlow } from '../../../hooks/useGenerationFlow';
 import { EventBusProvider, useEventBus, resetEventBusForTesting } from '../../../contexts/EventBusContext';
-import { ApiClientProvider, useApiClient } from '../../../contexts/ApiClientContext';
+import { ApiClientProvider } from '../../../contexts/ApiClientContext';
 import { AuthTokenProvider } from '../../../contexts/AuthTokenContext';
-import { useResolutionFlow } from '../../../contexts/useResolutionFlow';
+import { useResolutionFlow } from '../../../hooks/useResolutionFlow';
 import { SSEClient } from '@semiont/api-client';
-import type { SemiontApiClient, ResourceUri, AnnotationUri } from '@semiont/api-client';
+import type { ResourceUri, AnnotationUri } from '@semiont/api-client';
 import { resourceUri, annotationUri } from '@semiont/api-client';
 import type { Emitter } from 'mitt';
 import type { EventMap } from '../../../contexts/EventBusContext';
@@ -415,13 +415,9 @@ function renderGenerationFlow(
   // Component to capture EventBus instance and set up event operations
   function EventBusCapture() {
     eventBusInstance = useEventBus();
-    const client = useApiClient();
 
     // Set up resolution flow (annotation:update-body, reference:link)
-    useResolutionFlow(eventBusInstance, {
-      client: client as SemiontApiClient,
-      resourceUri: testResourceUri,
-    });
+    useResolutionFlow(testResourceUri);
 
     return null;
   }

package/src/features/resource-viewer/__tests__/ResolutionFlowIntegration.test.tsx

@@ -0,0 +1,266 @@
+/**
+ * Layer 3: Feature Integration Test - Resolution Flow (search modal & body update)
+ *
+ * Tests the UNCOVERED half of useResolutionFlow:
+ * - reference:link → emits resolution:search-requested
+ * - resolution:search-requested → opens search modal with pendingReferenceId
+ * - onCloseSearchModal → closes modal
+ * - annotation:update-body → calls updateAnnotationBody API
+ * - annotation:update-body → emits annotation:body-updated on success
+ * - annotation:update-body → emits annotation:body-update-failed on error
+ * - auth token passed to updateAnnotationBody
+ *
+ * The deletion half of useResolutionFlow is covered by AnnotationDeletionIntegration.test.tsx.
+ *
+ * Uses real providers (EventBus, ApiClient, AuthToken) with mocked API boundary.
+ */
+
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { render, waitFor } from '@testing-library/react';
+import { act } from 'react';
+import { useResolutionFlow } from '../../../hooks/useResolutionFlow';
+import { EventBusProvider, useEventBus, resetEventBusForTesting } from '../../../contexts/EventBusContext';
+import { ApiClientProvider } from '../../../contexts/ApiClientContext';
+import { AuthTokenProvider } from '../../../contexts/AuthTokenContext';
+import { SemiontApiClient, resourceUri, accessToken } from '@semiont/api-client';
+
+describe('Resolution Flow - Search Modal & Body Update Integration', () => {
+  let updateAnnotationBodySpy: ReturnType<typeof vi.fn>;
+  const testUri = resourceUri('http://localhost:4000/resources/test-resource');
+  const testToken = 'test-resolution-token';
+  const testBaseUrl = 'http://localhost:4000';
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    resetEventBusForTesting();
+
+    updateAnnotationBodySpy = vi.fn().mockResolvedValue({ success: true });
+    vi.spyOn(SemiontApiClient.prototype, 'updateAnnotationBody').mockImplementation(updateAnnotationBodySpy);
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  // ─── Render helper ──────────────────────────────────────────────────────────
+
+  function renderResolutionFlow() {
+    let eventBusInstance: ReturnType<typeof useEventBus> | null = null;
+    let lastState: ReturnType<typeof useResolutionFlow> | null = null;
+
+    function TestComponent() {
+      eventBusInstance = useEventBus();
+      lastState = useResolutionFlow(testUri);
+      return null;
+    }
+
+    render(
+      <AuthTokenProvider token={testToken}>
+        <EventBusProvider>
+          <ApiClientProvider baseUrl={testBaseUrl}>
+            <TestComponent />
+          </ApiClientProvider>
+        </EventBusProvider>
+      </AuthTokenProvider>
+    );
+
+    return {
+      getState: () => lastState!,
+      emit: (event: Parameters<typeof eventBusInstance.emit>[0], payload: Parameters<typeof eventBusInstance.emit>[1]) => {
+        act(() => { eventBusInstance!.emit(event as any, payload as any); });
+      },
+      on: (event: Parameters<typeof eventBusInstance.on>[0], handler: (payload: any) => void) => {
+        eventBusInstance!.on(event as any, handler);
+      },
+      off: (event: Parameters<typeof eventBusInstance.off>[0], handler: (payload: any) => void) => {
+        eventBusInstance!.off(event as any, handler);
+      },
+    };
+  }
+
+  // ─── Initial state ──────────────────────────────────────────────────────────
+
+  it('starts with search modal closed and no pending reference', () => {
+    const { getState } = renderResolutionFlow();
+    expect(getState().searchModalOpen).toBe(false);
+    expect(getState().pendingReferenceId).toBeNull();
+  });
+
+  // ─── reference:link ─────────────────────────────────────────────────────────
+
+  it('reference:link emits resolution:search-requested with referenceId and searchTerm', () => {
+    const { emit, on, off } = renderResolutionFlow();
+    const searchRequestedSpy = vi.fn();
+
+    on('resolution:search-requested', searchRequestedSpy);
+    emit('reference:link', { annotationUri: 'ann-uri-123', searchTerm: 'climate change' });
+    off('resolution:search-requested', searchRequestedSpy);
+
+    expect(searchRequestedSpy).toHaveBeenCalledTimes(1);
+    expect(searchRequestedSpy).toHaveBeenCalledWith({
+      referenceId: 'ann-uri-123',
+      searchTerm: 'climate change',
+    });
+  });
+
+  // ─── resolution:search-requested ────────────────────────────────────────────
+
+  it('resolution:search-requested opens the search modal', async () => {
+    const { getState, emit } = renderResolutionFlow();
+
+    expect(getState().searchModalOpen).toBe(false);
+
+    emit('resolution:search-requested', { referenceId: 'ref-abc', searchTerm: 'oceans' });
+
+    await waitFor(() => {
+      expect(getState().searchModalOpen).toBe(true);
+    });
+  });
+
+  it('resolution:search-requested sets pendingReferenceId', async () => {
+    const { getState, emit } = renderResolutionFlow();
+
+    emit('resolution:search-requested', { referenceId: 'ref-xyz', searchTerm: 'forests' });
+
+    await waitFor(() => {
+      expect(getState().pendingReferenceId).toBe('ref-xyz');
+    });
+  });
+
+  it('reference:link → resolution:search-requested chain opens modal end-to-end', async () => {
+    const { getState, emit } = renderResolutionFlow();
+
+    // Simulate the full user journey: user clicks "Link Document" on a reference entry
+    emit('reference:link', { annotationUri: 'ann-full-chain', searchTerm: 'biodiversity' });
+
+    await waitFor(() => {
+      expect(getState().searchModalOpen).toBe(true);
+      expect(getState().pendingReferenceId).toBe('ann-full-chain');
+    });
+  });
+
+  // ─── onCloseSearchModal ──────────────────────────────────────────────────────
+
+  it('onCloseSearchModal closes the search modal', async () => {
+    const { getState, emit } = renderResolutionFlow();
+
+    emit('resolution:search-requested', { referenceId: 'ref-close', searchTerm: 'test' });
+
+    await waitFor(() => expect(getState().searchModalOpen).toBe(true));
+
+    act(() => { getState().onCloseSearchModal(); });
+
+    await waitFor(() => {
+      expect(getState().searchModalOpen).toBe(false);
+    });
+  });
+
+  it('onCloseSearchModal does not clear pendingReferenceId (preserves for re-open)', async () => {
+    const { getState, emit } = renderResolutionFlow();
+
+    emit('resolution:search-requested', { referenceId: 'ref-persist', searchTerm: 'test' });
+    await waitFor(() => expect(getState().searchModalOpen).toBe(true));
+
+    act(() => { getState().onCloseSearchModal(); });
+    await waitFor(() => expect(getState().searchModalOpen).toBe(false));
+
+    // pendingReferenceId remains — modal may reopen
+    expect(getState().pendingReferenceId).toBe('ref-persist');
+  });
+
+  // ─── annotation:update-body ──────────────────────────────────────────────────
+
+  it('annotation:update-body calls updateAnnotationBody API', async () => {
+    const { emit } = renderResolutionFlow();
+
+    emit('annotation:update-body', {
+      annotationUri: 'http://localhost:4000/resources/test-resource/annotations/ann-body-1',
+      resourceId: 'linked-resource-id',
+      operations: [{ op: 'add', item: { id: 'linked-resource-id' } }],
+    });
+
+    await waitFor(() => {
+      expect(updateAnnotationBodySpy).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  it('annotation:update-body passes auth token to API call', async () => {
+    const { emit } = renderResolutionFlow();
+
+    emit('annotation:update-body', {
+      annotationUri: 'http://localhost:4000/resources/test-resource/annotations/ann-auth',
+      resourceId: 'resource-id',
+      operations: [{ op: 'replace', newItem: { id: 'resource-id' } }],
+    });
+
+    await waitFor(() => {
+      expect(updateAnnotationBodySpy).toHaveBeenCalled();
+    });
+
+    const callArgs = updateAnnotationBodySpy.mock.calls[0];
+    expect(callArgs[2]).toHaveProperty('auth');
+    expect(callArgs[2].auth).toBe(accessToken(testToken));
+  });
+
+  it('annotation:update-body emits annotation:body-updated on success', async () => {
+    const { emit, on, off } = renderResolutionFlow();
+    const bodyUpdatedSpy = vi.fn();
+
+    on('annotation:body-updated', bodyUpdatedSpy);
+
+    emit('annotation:update-body', {
+      annotationUri: 'http://localhost:4000/resources/test-resource/annotations/ann-success',
+      resourceId: 'resource-id',
+      operations: [{ op: 'add', item: { id: 'resource-id' } }],
+    });
+
+    await waitFor(() => {
+      expect(bodyUpdatedSpy).toHaveBeenCalledTimes(1);
+    });
+
+    off('annotation:body-updated', bodyUpdatedSpy);
+
+    expect(bodyUpdatedSpy).toHaveBeenCalledWith({
+      annotationUri: 'http://localhost:4000/resources/test-resource/annotations/ann-success',
+    });
+  });
+
+  it('annotation:update-body emits annotation:body-update-failed on API error', async () => {
+    updateAnnotationBodySpy.mockRejectedValue(new Error('Update failed'));
+
+    const { emit, on, off } = renderResolutionFlow();
+    const bodyUpdateFailedSpy = vi.fn();
+
+    on('annotation:body-update-failed', bodyUpdateFailedSpy);
+
+    emit('annotation:update-body', {
+      annotationUri: 'http://localhost:4000/resources/test-resource/annotations/ann-fail',
+      resourceId: 'resource-id',
+      operations: [{ op: 'remove', item: { id: 'old-id' } }],
+    });
+
+    await waitFor(() => {
+      expect(bodyUpdateFailedSpy).toHaveBeenCalledTimes(1);
+    });
+
+    off('annotation:body-update-failed', bodyUpdateFailedSpy);
+
+    expect(bodyUpdateFailedSpy).toHaveBeenCalledWith({
+      error: expect.any(Error),
+    });
+  });
+
+  it('annotation:update-body called ONCE — no duplicate subscriptions', async () => {
+    const { emit } = renderResolutionFlow();
+
+    emit('annotation:update-body', {
+      annotationUri: 'http://localhost:4000/resources/test-resource/annotations/ann-dedup',
+      resourceId: 'resource-id',
+      operations: [{ op: 'add', item: { id: 'resource-id' } }],
+    });
+
+    await waitFor(() => {
+      expect(updateAnnotationBodySpy).toHaveBeenCalledTimes(1);
+    });
+  });
+});

package/src/features/resource-viewer/components/ResourceViewerPage.tsx

@@ -35,8 +35,9 @@ import { useEventBus } from '../../../contexts/EventBusContext';
 import { useEventSubscriptions } from '../../../contexts/useEventSubscription';
 import { useResourceAnnotations } from '../../../contexts/ResourceAnnotationsContext';
 import { useApiClient } from '../../../contexts/ApiClientContext';
-import { useResolutionFlow } from '../../../contexts/useResolutionFlow';
+import { useResolutionFlow } from '../../../hooks/useResolutionFlow';
 import { useDetectionFlow } from '../../../hooks/useDetectionFlow';
+import { useAttentionFlow } from '../../../hooks/useAttentionFlow';
 import { usePanelNavigation } from '../../../hooks/usePanelNavigation';
 import { useGenerationFlow } from '../../../hooks/useGenerationFlow';
 import { useContextRetrievalFlow } from '../../../hooks/useContextRetrievalFlow';
@@ -159,9 +160,10 @@ export function ResourceViewerPage({
   const allEntityTypes = (entityTypesData as { entityTypes: string[] } | undefined)?.entityTypes || [];
 
   // Flow state hooks (NO CONTAINERS)
-  const { detectingMotivation, detectionProgress, pendingAnnotation, hoveredAnnotationId } = useDetectionFlow(rUri);
+  const { hoveredAnnotationId } = useAttentionFlow();
+  const { detectingMotivation, detectionProgress, pendingAnnotation } = useDetectionFlow(rUri);
   const { activePanel, scrollToAnnotationId, panelInitialTab, onScrollCompleted } = usePanelNavigation();
-  const { searchModalOpen, pendingReferenceId, onCloseSearchModal } = useResolutionFlow(eventBus, { client, resourceUri: rUri });
+  const { searchModalOpen, pendingReferenceId, onCloseSearchModal } = useResolutionFlow(rUri);
   const {
     generationProgress,
     generationModalOpen,