@semiont/react-ui 0.5.22 → 0.5.23

package/src/features/resource-discovery/state/__tests__/discover-state-unit.test.ts

@@ -1,4 +1,6 @@
 import { describe, it, expect, vi } from 'vitest';
+import { asStates } from '../../../../__tests__/test-client';
+import { sessionOf } from '../../../../__tests__/test-client';
 import { BehaviorSubject, firstValueFrom } from 'rxjs';
 import { filter, skip, take, toArray } from 'rxjs/operators';
 import type { SemiontClient } from '@semiont/sdk';
@@ -34,9 +36,9 @@ function mockClient(overrides: {
     browse: {
       resources: (filters: BrowseFilters = {}) => {
         resourceCalls.push(filters);
-        return resourcesFn(filters).asObservable();
+        return asStates(resourcesFn(filters).asObservable());
       },
-      entityTypes: () => entityTypes$.asObservable(),
+      entityTypes: () => asStates(entityTypes$.asObservable()),
     },
   } as unknown as SemiontClient;
 
@@ -46,9 +48,9 @@ function mockClient(overrides: {
 describe('createDiscoverStateUnit', () => {
   it('exposes recent resources from browse namespace', async () => {
     const { client } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
-    const recent = await firstValueFrom(stateUnit.recentResources$);
+    const recent = await firstValueFrom(stateUnit.recent.value$);
     expect(recent).toEqual([{ '@id': 'r1' }]);
 
     stateUnit.dispose();
@@ -56,9 +58,9 @@ describe('createDiscoverStateUnit', () => {
 
   it('exposes entity types from browse namespace', async () => {
     const { client } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
-    const types = await firstValueFrom(stateUnit.entityTypes$);
+    const types = await firstValueFrom(stateUnit.entityTypes.value$);
     expect(types).toEqual(['Person']);
 
     stateUnit.dispose();
@@ -67,9 +69,9 @@ describe('createDiscoverStateUnit', () => {
   it('falls back to [] when entityTypes() emits undefined', async () => {
     const entityTypes$ = new BehaviorSubject<string[] | undefined>(undefined);
     const { client } = mockClient({ entityTypes$ });
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
-    const types = await firstValueFrom(stateUnit.entityTypes$);
+    const types = await firstValueFrom(stateUnit.entityTypes.value$);
     expect(types).toEqual([]);
 
     stateUnit.dispose();
@@ -78,13 +80,13 @@ describe('createDiscoverStateUnit', () => {
   it('reports loading when resources are undefined', async () => {
     const resources$ = new BehaviorSubject<unknown[] | undefined>(undefined);
     const { client } = mockClient({ resources$ });
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
-    const loading = await firstValueFrom(stateUnit.isLoadingRecent$);
+    const loading = await firstValueFrom(stateUnit.recent.loading$);
     expect(loading).toBe(true);
 
     resources$.next([]);
-    const loaded = await firstValueFrom(stateUnit.isLoadingRecent$.pipe(filter((l) => !l)));
+    const loaded = await firstValueFrom(stateUnit.recent.loading$.pipe(filter((l) => !l)));
     expect(loaded).toBe(false);
 
     stateUnit.dispose();
@@ -92,7 +94,7 @@ describe('createDiscoverStateUnit', () => {
 
   it('exposes a search pipeline', () => {
     const { client } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
     expect(stateUnit.search).toBeDefined();
     expect(typeof stateUnit.search.setQuery).toBe('function');
@@ -103,9 +105,9 @@ describe('createDiscoverStateUnit', () => {
 
   it('initial selectedEntityType$ is empty and recent fetch carries no entityType', async () => {
     const { client, resourceCalls } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
-    await firstValueFrom(stateUnit.recentResources$);
+    await firstValueFrom(stateUnit.recent.value$);
 
     expect(resourceCalls).toHaveLength(1);
     expect(resourceCalls[0]).toEqual({ limit: 10, archived: false });
@@ -116,10 +118,10 @@ describe('createDiscoverStateUnit', () => {
 
   it('setSelectedEntityType drives a refetch with the entityType filter', async () => {
     const { client, resourceCalls } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
     // Prime the first subscription so the switchMap is live.
-    const sub = stateUnit.recentResources$.subscribe();
+    const sub = stateUnit.recent.value$.subscribe();
 
     stateUnit.setSelectedEntityType('Person');
 
@@ -136,7 +138,7 @@ describe('createDiscoverStateUnit', () => {
     vi.useFakeTimers();
     try {
       const { client, resourceCalls } = mockClient();
-      const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+      const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
       const collected: Array<{ results: unknown[]; isSearching: boolean }> = [];
       const sub = stateUnit.search.state$.subscribe((s) => collected.push(s));
@@ -161,7 +163,7 @@ describe('createDiscoverStateUnit', () => {
       const { client, resourceCalls } = mockClient({
         resourcesFn: (filters) => (filters.search ? results$ : new BehaviorSubject<unknown[] | undefined>([])),
       });
-      const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+      const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
       const sub = stateUnit.search.state$.subscribe();
       stateUnit.setSelectedEntityType('Person');
@@ -191,7 +193,7 @@ describe('createDiscoverStateUnit', () => {
       const { client } = mockClient({
         resourcesFn: () => results$,
       });
-      const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+      const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
       const collected: Array<{ results: unknown[]; isSearching: boolean }> = [];
       const sub = stateUnit.search.state$.subscribe((s) => collected.push(s));
@@ -215,7 +217,7 @@ describe('createDiscoverStateUnit', () => {
       const { client } = mockClient({
         resourcesFn: () => inflight$,
       });
-      const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+      const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
       const collected: Array<{ results: unknown[]; isSearching: boolean }> = [];
       const sub = stateUnit.search.state$.subscribe((s) => collected.push(s));
@@ -234,7 +236,7 @@ describe('createDiscoverStateUnit', () => {
 
   it('search query observable echoes the latest setQuery value', async () => {
     const { client } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
     const queries = stateUnit.search.query$.pipe(skip(1), take(1), toArray()).toPromise();
     stateUnit.search.setQuery('alpha');
@@ -246,9 +248,9 @@ describe('createDiscoverStateUnit', () => {
 
   it('omits entityType from the filter when the empty sentinel is selected', async () => {
     const { client, resourceCalls } = mockClient();
-    const stateUnit = createDiscoverStateUnit(client, mockBrowse());
+    const stateUnit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
 
-    const sub = stateUnit.recentResources$.subscribe();
+    const sub = stateUnit.recent.value$.subscribe();
     stateUnit.setSelectedEntityType('Person');
     stateUnit.setSelectedEntityType('');
 
@@ -266,10 +268,73 @@ describe('DiscoverStateUnit — StateUnit axioms', () => {
       setup: () => {
         const browse = disposeProbe();
         const { client } = mockClient();
-        return { unit: createDiscoverStateUnit(client, browse as unknown as ShellStateUnit), passedIn: [browse] };
+        return { unit: createDiscoverStateUnit(sessionOf(client), browse as unknown as ShellStateUnit), passedIn: [browse] };
       },
       surfaces: (u) => [u.selectedEntityType$],
       invocations: (u) => [() => u.setSelectedEntityType('')],
     });
   });
 });
+
+describe('createDiscoverStateUnit — terminal load failure', () => {
+  // `isLoadingRecent$` was `recent$.pipe(map(r => r === undefined))`, so a
+  // terminally failed list (B15) — which has no value either — left
+  // /know/discover spinning for ever. Same defect as the References and
+  // History panels. See .plans/PANEL-FAILURE-STATES.md
+
+  it('recent: stops loading and surfaces the reason instead of spinning for ever', async () => {
+    const resources$ = new BehaviorSubject<unknown[] | undefined>(undefined);
+    const { client } = mockClient({ resources$ });
+    const unit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
+
+    expect(await firstValueFrom(unit.recent.loading$)).toBe(true);
+    resources$.next({ status: 'failed', error: new Error('Resource not found') } as never);
+
+    expect(await firstValueFrom(unit.recent.loading$)).toBe(false);
+    expect((await firstValueFrom(unit.recent.error$) as Error | null)?.message)
+      .toBe('Resource not found');
+
+    unit.dispose();
+  });
+
+  it('entityTypes: same, and keeps an empty list to render', async () => {
+    const entityTypes$ = new BehaviorSubject<string[] | undefined>(undefined);
+    const { client } = mockClient({ entityTypes$ });
+    const unit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
+
+    entityTypes$.next({ status: 'failed', error: new Error('boom') } as never);
+
+    expect(await firstValueFrom(unit.entityTypes.loading$)).toBe(false);
+    expect(await firstValueFrom(unit.entityTypes.error$)).not.toBeNull();
+    expect(await firstValueFrom(unit.entityTypes.value$)).toEqual([]);
+
+    unit.dispose();
+  });
+
+  it('recent.retry() re-issues the query and can recover', async () => {
+    // A fresh `observe()` is what clears the B15 marker, so retry must reach
+    // `browse.resources()` again rather than re-subscribing to a dead stream.
+    const attempts: BehaviorSubject<unknown[] | undefined>[] = [];
+    const { client } = mockClient({
+      resourcesFn: () => {
+        const s = new BehaviorSubject<unknown[] | undefined>(undefined);
+        attempts.push(s);
+        return s;
+      },
+    });
+    const unit = createDiscoverStateUnit(sessionOf(client), mockBrowse());
+
+    attempts[0]!.next({ status: 'failed', error: new Error('nope') } as never);
+    expect(await firstValueFrom(unit.recent.error$)).not.toBeNull();
+
+    unit.recent.retry();
+    expect(attempts.length).toBeGreaterThan(1);
+    expect(await firstValueFrom(unit.recent.error$)).toBeNull();
+
+    attempts[attempts.length - 1]!.next([{ '@id': 'r1' }]);
+    expect(await firstValueFrom(unit.recent.value$)).toHaveLength(1);
+    expect(await firstValueFrom(unit.recent.loading$)).toBe(false);
+
+    unit.dispose();
+  });
+});

package/src/features/resource-discovery/state/discover-state-unit.ts

@@ -1,10 +1,12 @@
 import { BehaviorSubject, Subject, combineLatest, of, type Observable } from 'rxjs';
+import { readyValue } from '@semiont/sdk';
 import { debounceTime, distinctUntilChanged, map, startWith, switchMap, shareReplay } from 'rxjs/operators';
 import type { ResourceDescriptor } from '@semiont/core';
-import type { SemiontClient } from '@semiont/sdk';
+import type { SemiontSession } from '@semiont/sdk';
 import type { StateUnit } from '@semiont/core';
 import { createDisposer } from '@semiont/sdk';
 import type { ShellStateUnit } from '../../../state/shell-state-unit';
+import { trackList, type ListState } from '../../../state/list-state';
 
 const RECENT_LIMIT = 10;
 const SEARCH_LIMIT = 20;
@@ -19,17 +21,17 @@ export interface DiscoverSearchPipeline {
 export interface DiscoverStateUnit extends StateUnit {
   browse: ShellStateUnit;
   search: DiscoverSearchPipeline;
-  recentResources$: Observable<ResourceDescriptor[]>;
-  entityTypes$: Observable<string[]>;
-  isLoadingRecent$: Observable<boolean>;
+  recent: ListState<ResourceDescriptor[]>;
+  entityTypes: ListState<string[]>;
   selectedEntityType$: Observable<string>;
   setSelectedEntityType(value: string): void;
 }
 
 export function createDiscoverStateUnit(
-  client: SemiontClient,
+  session: SemiontSession,
   browse: ShellStateUnit,
 ): DiscoverStateUnit {
+  const { client } = session;
   const disposer = createDisposer();
   // `browse` (ShellStateUnit) is a *passed-in* dependency owned by the caller
   // (`useShellStateUnit`), not this unit — do NOT add it to the disposer (it's the
@@ -44,28 +46,27 @@ export function createDiscoverStateUnit(
   const queryInput$ = new Subject<string>();
   disposer.add(() => queryInput$.complete());
 
-  const recent$ = selectedEntityType$.pipe(
-    switchMap((et) =>
-      client.browse.resources({
-        limit: RECENT_LIMIT,
-        archived: false,
-        ...(et ? { entityType: et } : {}),
-      }),
+  // `trackList` holds the single subscription and multicasts through its own
+  // subjects, so the previous `shareReplay` is unnecessary — and it would have
+  // been actively wrong here: a replayed ERROR cannot be retried away, and
+  // retry must reach `browse.resources()` again for B15 to clear the marker.
+  // The thunk therefore rebuilds the whole chain per attempt.
+  const recent = trackList<ResourceDescriptor[]>(
+    () => selectedEntityType$.pipe(
+      switchMap((et) =>
+        client.browse.resources({
+          limit: RECENT_LIMIT,
+          archived: false,
+          ...(et ? { entityType: et } : {}),
+        }),
+      ),
     ),
-    shareReplay({ bufferSize: 1, refCount: true }),
-  );
-
-  const recentResources$: Observable<ResourceDescriptor[]> = recent$.pipe(
-    map((r) => r ?? []),
+    [],
   );
+  disposer.add(recent.dispose);
 
-  const isLoadingRecent$: Observable<boolean> = recent$.pipe(
-    map((r) => r === undefined),
-  );
-
-  const entityTypes$: Observable<string[]> = client.browse.entityTypes().pipe(
-    map((e) => e ?? []),
-  );
+  const entityTypes = trackList<string[]>(() => client.browse.entityTypes(), []);
+  disposer.add(entityTypes.dispose);
 
   const debouncedQuery$ = queryInput$.pipe(
     startWith(''),
@@ -87,9 +88,9 @@ export function createDiscoverStateUnit(
             ...(et ? { entityType: et } : {}),
           })
           .pipe(
-            map((results) => ({
-              results: results ?? [],
-              isSearching: results === undefined,
+            map((st) => ({
+              results: readyValue(st) ?? [],
+              isSearching: st.status === 'pending',
             })),
             startWith({ results: [] as ResourceDescriptor[], isSearching: true }),
           );
@@ -106,9 +107,8 @@ export function createDiscoverStateUnit(
   return {
     browse,
     search,
-    recentResources$,
-    entityTypes$,
-    isLoadingRecent$,
+    recent: recent.state,
+    entityTypes: entityTypes.state,
     selectedEntityType$: selectedEntityType$.asObservable(),
     setSelectedEntityType: (value) => selectedEntityType$.next(value),
     dispose: () => disposer.dispose(),

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

@@ -57,6 +57,7 @@ const { stubBrowser } = vi.hoisted(() => {
     removeOpenResource: vi.fn(),
     updateOpenResourceName: vi.fn(),
     reorderOpenResources: vi.fn(),
+    setLastViewedResource: vi.fn(),
     emit: vi.fn(),
     on: vi.fn(() => () => {}),
     stream: vi.fn(() => ({ subscribe: () => ({ unsubscribe: () => {} }) })),

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

@@ -20,6 +20,7 @@ import { JsonLdPanel } from '@semiont/react-ui';
 import { Toolbar } from '@semiont/react-ui';
 import { useResourceLoadingAnnouncements } from '@semiont/react-ui';
 import { ResourceViewer } from '@semiont/react-ui';
+import type { BrowseMediaRenderers, AnnotateMediaRenderers } from '@semiont/react-ui';
 import { useObservable } from '@semiont/react-ui';
 import { useResourceContent } from '../../../hooks/useResourceContent';
 import { useMediaToken } from '../../../hooks/useMediaToken';
@@ -35,7 +36,7 @@ import { getSelectorType } from '../../../lib/media-shapes';
 import { useResourceAnnotations } from '../../../contexts/ResourceAnnotationsContext';
 import { useSemiont } from '../../../session/SemiontProvider';
 import { createResourceViewerPageStateUnit } from '../state/resource-viewer-page-state-unit';
-import { useStateUnit } from '../../../hooks/useStateUnit';
+import { useSessionStateUnit } from '../../../hooks/useSessionStateUnit';
 import { useShellStateUnit } from '../../../hooks/useShellStateUnit';
 import { useTranslations } from '../../../contexts/TranslationContext';
 import { ReferenceWizardModal } from '../../../components/modals/ReferenceWizardModal';
@@ -92,6 +93,14 @@ export interface ResourceViewerPageProps {
    * Name of the active knowledge base (for display in panels)
    */
   knowledgeBaseName?: string | undefined;
+
+  /**
+   * Media-renderer overrides, forwarded to `ResourceViewer`. Present at this
+   * tier too so a host embedding the whole page — not just the viewer — can
+   * still swap a renderer. See .plans/ANNOTATE-RENDERER-REGISTRY.md (D5)
+   */
+  browseRenderers?: BrowseMediaRenderers;
+  annotateRenderers?: AnnotateMediaRenderers;
 }
 
 /**
@@ -126,6 +135,8 @@ export function ResourceViewerPage({
   refetchDocument,
   streamStatus,
   knowledgeBaseName,
+  browseRenderers,
+  annotateRenderers,
 }: ResourceViewerPageProps) {
   // Translations
   const tw = useTranslations('ReferenceWizard');
@@ -185,27 +196,40 @@ export function ResourceViewerPage({
 
   // Composite state unit — owns all flow VMs, wizard state, annotations, entity types
   const browseStateUnit = useShellStateUnit();
-  const stateUnit = useStateUnit(() => createResourceViewerPageStateUnit(semiont!, rUri, locale, browseStateUnit));
-
-  const annotations = useObservable(stateUnit.annotations$) ?? [];
-  const groups = useObservable(stateUnit.annotationGroups$);
-  const allEntityTypes = useObservable(stateUnit.entityTypes$) ?? [];
-  const referencedByRaw = useObservable(stateUnit.referencedBy$);
-  const referencedBy = referencedByRaw ?? [];
-  const referencedByLoading = referencedByRaw === undefined;
-  const hoveredAnnotationId = useObservable(stateUnit.beckon.hoveredAnnotationId$) ?? null;
-  const pendingAnnotation = useObservable(stateUnit.mark.pendingAnnotation$) ?? null;
-  const assistingMotivation = useObservable(stateUnit.mark.assistingMotivation$) ?? null;
-  const progress = useObservable(stateUnit.mark.progress$) ?? null;
-  const activePanel = useObservable(stateUnit.browse.activePanel$) ?? null;
-  const scrollToAnnotationId = useObservable(stateUnit.browse.scrollToAnnotationId$) ?? null;
-  const panelInitialTab = useObservable(stateUnit.browse.panelInitialTab$) ?? null;
-  const onScrollCompleted = stateUnit.browse.onScrollCompleted;
-  const generationProgress = useObservable(stateUnit.yield.progress$) ?? null;
-  const gatherContext = useObservable(stateUnit.gather.context$) ?? null;
-  const gatherLoading = useObservable(stateUnit.gather.loading$) ?? false;
-  const gatherError = useObservable(stateUnit.gather.error$) ?? null;
-  const wizardState = useObservable(stateUnit.wizard$);
+  // Session-typed + session-keyed (SESSION-TYPED-FACTORIES.md): no `!`, no
+  // construction without a session, dispose-first rebuild on session swap.
+  const stateUnit = useSessionStateUnit(
+    session ?? undefined,
+    (s) => createResourceViewerPageStateUnit(s, rUri, locale, browseStateUnit),
+  );
+
+  const annotations = useObservable(stateUnit?.annotations.value$) ?? [];
+  const annotationsError = useObservable(stateUnit?.annotations.error$) ?? null;
+  const groups = useObservable(stateUnit?.annotationGroups$);
+  const allEntityTypes = useObservable(stateUnit?.entityTypes.value$) ?? [];
+  const entityTypesError = useObservable(stateUnit?.entityTypes.error$) ?? null;
+  // Three states, not two: a terminally failed list has no value EITHER, so
+  // deriving "loading" from `undefined` leaves a dead request spinning for
+  // ever. See .plans/PANEL-FAILURE-STATES.md
+  const referencedBy = useObservable(stateUnit?.referencedBy.value$) ?? [];
+  const referencedByLoading = useObservable(stateUnit?.referencedBy.loading$) ?? true;
+  const referencedByError = useObservable(stateUnit?.referencedBy.error$) ?? null;
+  const events = useObservable(stateUnit?.events.value$) ?? [];
+  const eventsLoading = useObservable(stateUnit?.events.loading$) ?? true;
+  const eventsError = useObservable(stateUnit?.events.error$) ?? null;
+  const hoveredAnnotationId = useObservable(stateUnit?.beckon.hoveredAnnotationId$) ?? null;
+  const pendingAnnotation = useObservable(stateUnit?.mark.pendingAnnotation$) ?? null;
+  const assistingMotivation = useObservable(stateUnit?.mark.assistingMotivation$) ?? null;
+  const progress = useObservable(stateUnit?.mark.progress$) ?? null;
+  const activePanel = useObservable(stateUnit?.browse.activePanel$) ?? null;
+  const scrollToAnnotationId = useObservable(stateUnit?.browse.scrollToAnnotationId$) ?? null;
+  const panelInitialTab = useObservable(stateUnit?.browse.panelInitialTab$) ?? null;
+  const onScrollCompleted = stateUnit?.browse.onScrollCompleted;
+  const generationProgress = useObservable(stateUnit?.yield.progress$) ?? null;
+  const gatherContext = useObservable(stateUnit?.gather.context$) ?? null;
+  const gatherLoading = useObservable(stateUnit?.gather.loading$) ?? false;
+  const gatherError = useObservable(stateUnit?.gather.error$) ?? null;
+  const wizardState = useObservable(stateUnit?.wizard$);
   const wizardOpen = wizardState?.open ?? false;
   const wizardAnnotationId = wizardState?.annotationId ?? null;
   const wizardResourceId = wizardState?.resourceId ?? null;
@@ -214,12 +238,12 @@ export function ResourceViewerPage({
   const [generateOpen, setGenerateOpen] = useState(false);
 
   const handleWizardClose = useCallback(() => {
-    stateUnit.closeWizard();
+    stateUnit?.closeWizard();
   }, [stateUnit]);
 
   const handleWizardGenerateSubmit = useCallback((referenceId: string, config: GenerationConfig) => {
     clearNewAnnotationId(annotationId(referenceId));
-    stateUnit.yield.generate(referenceId, {
+    stateUnit?.yield.generate(referenceId, {
       title: config.title,
       storageUri: config.storagePath,
       prompt: config.prompt,
@@ -239,7 +263,7 @@ export function ResourceViewerPage({
   // NOT a toast. `generateFromResource` is Phase 6 (the @semiont/sdk session);
   // this is declared RED until that method lands. Do not re-impl it here.
   const handleResourceGenerateSubmit = useCallback((_resourceId: string, config: GenerationConfig) => {
-    stateUnit.yield.generateFromResource({
+    stateUnit?.yield.generateFromResource({
       title: config.title,
       storageUri: config.storagePath,
       ...(config.prompt ? { prompt: config.prompt } : {}),
@@ -286,14 +310,15 @@ export function ResourceViewerPage({
     });
   }, [browser]);
 
-  // Add resource to open tabs when it loads
+  // Add resource to open tabs when it loads, and record it as this KB's
+  // last-viewed for the /know landing route to resume from. Both are per-KB
+  // state owned by the browser — a global last-viewed id sends that redirect
+  // into the previously active KB's resource after a switch.
   useEffect(() => {
     if (resource && rUri) {
       const mediaType = getPrimaryMediaType(resource);
       browser.addOpenResource(rUri, resource.name, mediaType || undefined, resource.storageUri);
-      if (typeof localStorage !== 'undefined') {
-        localStorage.setItem('lastViewedDocumentId', rUri);
-      }
+      browser.setLastViewedResource(rUri);
     }
   }, [resource, rUri, browser]);
 
@@ -503,6 +528,8 @@ export function ResourceViewerPage({
                   showLineNumbers={showLineNumbers}
                   hoverDelayMs={hoverDelayMs}
                   hoveredAnnotationId={hoveredAnnotationId}
+                  {...(browseRenderers && { browseRenderers })}
+                  {...(annotateRenderers && { annotateRenderers })}
                 />
               )}
             </ErrorBoundary>
@@ -543,9 +570,14 @@ export function ResourceViewerPage({
                 progress={progress}
                 pendingAnnotation={pendingAnnotation}
                 allEntityTypes={allEntityTypes}
+                annotationsError={annotationsError}
+                onRetryAnnotations={stateUnit?.annotations.retry}
+                entityTypesError={entityTypesError}
                 generatingReferenceId={generationProgress?.annotationId ?? null}
                 referencedBy={referencedBy}
                 referencedByLoading={referencedByLoading}
+                referencedByError={referencedByError}
+                onRetryReferencedBy={stateUnit?.referencedBy.retry}
                 resourceId={rUri}
                 locale={locale}
                 sourceLanguage={getLanguage(resource)}
@@ -562,7 +594,11 @@ export function ResourceViewerPage({
             {/* History Panel */}
             {activePanel === 'history' && (
               <AnnotationHistory
-                rUri={rUri}
+                events={events}
+                eventsLoading={eventsLoading}
+                eventsError={eventsError}
+                onRetryEvents={stateUnit?.events.retry}
+                annotations={annotations}
                 hoveredAnnotationId={hoveredAnnotationId}
                 onEventHover={handleEventHover}
                 onEventClick={handleEventClick}
@@ -676,6 +712,7 @@ export function ResourceViewerPage({
         resourceId={rUri}
         defaultTitle=""
         locale={locale}
+        entityTypeOptions={allEntityTypes}
         onGenerateSubmit={handleResourceGenerateSubmit}
         translations={{
           gatherTitle: tg('gatherTitle'),