@assistant-ui/react 0.15.14 → 0.15.16

package/src/sandbox-host/SandboxHost.test.tsx

@@ -228,4 +228,94 @@ describe("SandboxHost", () => {
     expect(onError).toHaveBeenCalledTimes(1);
     expect(onError.mock.calls[0]![0].message).toBe("boom");
   });
+
+  it("does not report render failures after unmount", async () => {
+    let rejectRender!: (error: Error) => void;
+    renderHtmlMock.mockReturnValue(
+      new Promise((_, reject) => {
+        rejectRender = reject;
+      }),
+    );
+    const onError = vi.fn();
+
+    await act(async () => {
+      root.render(
+        <SandboxHost
+          content={{ html: "" }}
+          contentKey="k"
+          createBridge={() => ({ onMessage: vi.fn(), dispose: vi.fn() })}
+          onError={onError}
+        />,
+      );
+    });
+
+    await act(async () => {
+      root.unmount();
+    });
+    rejectRender(new Error("late failure"));
+    await flush();
+
+    expect(onError).not.toHaveBeenCalled();
+  });
+
+  it("contains failures thrown by onError", async () => {
+    const renderError = new Error("render failed");
+    const callbackError = new Error("error callback failed");
+    renderHtmlMock.mockRejectedValue(renderError);
+    const consoleError = vi
+      .spyOn(console, "error")
+      .mockImplementation(() => {});
+
+    try {
+      await act(async () => {
+        root.render(
+          <SandboxHost
+            content={{ html: "" }}
+            contentKey="k"
+            createBridge={() => ({ onMessage: vi.fn(), dispose: vi.fn() })}
+            onError={() => {
+              throw callbackError;
+            }}
+          />,
+        );
+      });
+      await flush();
+
+      expect(consoleError).toHaveBeenCalledWith(
+        "[assistant-ui] SandboxHost onError callback threw an error",
+        callbackError,
+      );
+    } finally {
+      consoleError.mockRestore();
+    }
+  });
+
+  it("disposes the rendered frame when bridge creation fails", async () => {
+    const rendered = fakeRendered();
+    renderHtmlMock.mockResolvedValue(rendered);
+    const error = new Error("bridge failed");
+    const onError = vi.fn();
+
+    await act(async () => {
+      root.render(
+        <SandboxHost
+          content={{ html: "" }}
+          contentKey="k"
+          createBridge={() => {
+            throw error;
+          }}
+          onError={onError}
+        />,
+      );
+    });
+    await flush();
+
+    expect(onError).toHaveBeenCalledWith(error);
+    expect(rendered.dispose).toHaveBeenCalledTimes(1);
+
+    await act(async () => {
+      root.unmount();
+    });
+    expect(rendered.dispose).toHaveBeenCalledTimes(1);
+  });
 });

package/src/sandbox-host/SandboxHost.tsx

@@ -6,6 +6,7 @@ import {
   SafeContentFrame,
   type SandboxOption,
 } from "safe-content-frame";
+import { invokeCallbackSafely } from "../utils/invokeCallbackSafely";
 
 const DEFAULT_PRODUCT = "assistant-ui-sandbox";
 const DEFAULT_MAX_HEIGHT = 800;
@@ -147,8 +148,13 @@ export function SandboxHost({
         window.addEventListener("message", onMessage);
       })
       .catch((err) => {
-        liveRef.current.onError?.(
-          err instanceof Error ? err : new Error(String(err)),
+        if (cancelled) return;
+        frame?.dispose();
+        frame = null;
+        const error = err instanceof Error ? err : new Error(String(err));
+        invokeCallbackSafely(
+          () => liveRef.current.onError?.(error),
+          "SandboxHost onError",
         );
       });
 

package/src/tests/RemoteThreadListRuntime.adapterProvider.test.tsx

@@ -26,9 +26,14 @@ const dummyHistory: ThreadHistoryAdapter = {
   append: async () => {},
 };
 
-const makeRuntimeHook = (capture: { adapters: CapturedAdapters }) =>
+const makeRuntimeHook = (capture: {
+  adapters: CapturedAdapters;
+  calls?: CapturedAdapters[];
+}) =>
   function useTestRuntimeHook() {
-    capture.adapters = useRuntimeAdapters();
+    const adapters = useRuntimeAdapters();
+    capture.calls?.push(adapters);
+    capture.adapters = adapters;
     return useLocalRuntime(noOpAdapter);
   };
 
@@ -68,12 +73,16 @@ const wrapInRuntimeAdapterProvider = (
 
 describe("RemoteThreadListAdapter.unstable_Provider", () => {
   it("makes Provider context visible to the runtime hook while preserving outer modelContext", async () => {
-    const capture: { adapters: CapturedAdapters } = { adapters: null };
+    const capture: { adapters: CapturedAdapters; calls: CapturedAdapters[] } = {
+      adapters: null,
+      calls: [],
+    };
     const adapter = makeAdapter({
       unstable_Provider: wrapInRuntimeAdapterProvider(dummyHistory),
     });
     await renderAndWaitForBinder(adapter, capture);
 
+    expect(capture.calls[0]?.history).toBe(dummyHistory);
     expect(capture.adapters?.history).toBe(dummyHistory);
     expect(capture.adapters?.modelContext).toBeDefined();
   });
@@ -86,6 +95,18 @@ describe("RemoteThreadListAdapter.unstable_Provider", () => {
     expect(capture.adapters?.history).toBeUndefined();
   });
 
+  it("makes useAdapters context visible when no Provider is supplied", async () => {
+    const capture: { adapters: CapturedAdapters } = { adapters: null };
+    const adapter = makeAdapter({
+      unstable_useAdapters: function useTestAdapters() {
+        return { history: dummyHistory };
+      },
+    });
+    await renderAndWaitForBinder(adapter, capture);
+
+    expect(capture.adapters?.history).toBe(dummyHistory);
+  });
+
   it("picks up a swapped Provider on re-render", async () => {
     const capture: { adapters: CapturedAdapters } = { adapters: null };
     const firstHistory: ThreadHistoryAdapter = {

package/src/tests/RemoteThreadListRuntime.reloadMainThread.test.tsx

@@ -86,8 +86,7 @@ describe("threads.reloadMainThread", () => {
       await runtime.threads.reloadMainThread();
     });
 
-    // the hook ran again, which is what re-runs the adapter's load()
-    await waitFor(() => expect(mounts.count).toBe(beforeReload + 1));
+    await waitFor(() => expect(mounts.count).toBeGreaterThan(beforeReload));
   });
 
   it("keeps a thread runtime readable across the remount", async () => {

package/src/tests/augmentations.test.ts

@@ -1,5 +1,11 @@
 import { describe, expectTypeOf, it } from "vitest";
 import type { UserCommands, UserExternalState } from "../augmentations";
+import type {
+  AssistantTransportCommand,
+  useAssistantTransportRuntime,
+  useAssistantTransportSendCommand,
+  useAssistantTransportState,
+} from "../index";
 
 declare module "../augmentations" {
   namespace Assistant {
@@ -36,4 +42,47 @@ describe("Assistant augmentations", () => {
     expectTypeOf<{ type: "core-command" }>().toExtend<UserCommands>();
     expectTypeOf<{ fromCore: boolean }>().toExtend<UserExternalState>();
   });
+
+  it("react-side contributions reach the public transport types", () => {
+    expectTypeOf<{
+      type: "react-command";
+      data: number;
+    }>().toExtend<AssistantTransportCommand>();
+    expectTypeOf<{ fromReact: boolean }>().toExtend<
+      ReturnType<typeof useAssistantTransportState>
+    >();
+    expectTypeOf<{
+      type: "react-command";
+      data: number;
+    }>().toExtend<
+      Parameters<ReturnType<typeof useAssistantTransportSendCommand>>[0]
+    >();
+    type RuntimeOptions = Parameters<typeof useAssistantTransportRuntime>[0];
+    expectTypeOf<{
+      type: "react-command";
+      data: number;
+    }>().toExtend<
+      Parameters<RuntimeOptions["converter"]>[1]["pendingCommands"][number]
+    >();
+    expectTypeOf<{
+      type: "react-command";
+      data: number;
+    }>().toExtend<
+      Parameters<NonNullable<RuntimeOptions["onError"]>>[1]["commands"][number]
+    >();
+    expectTypeOf<{
+      type: "react-command";
+      data: number;
+    }>().toExtend<
+      Parameters<NonNullable<RuntimeOptions["onCancel"]>>[0]["commands"][number]
+    >();
+    expectTypeOf<{
+      type: "react-command";
+      data: number;
+    }>().toExtend<
+      Parameters<
+        NonNullable<RuntimeOptions["prepareSendCommandsRequest"]>
+      >[0]["commands"][number]
+    >();
+  });
 });

package/src/tests/in-memory-thread-list.test.tsx

@@ -4,7 +4,7 @@ import { render, waitFor } from "@testing-library/react";
 import type { FC } from "react";
 import { describe, it, expect, vi } from "vitest";
 import { useAui, AuiProvider } from "@assistant-ui/store";
-import { InMemoryThreadList } from "../client/InMemoryThreadList";
+import { InMemoryThreadList } from "@assistant-ui/core/store";
 import { ExternalThread } from "../index";
 
 const renderThreads = () => {

package/src/tests/threadMessageById.test.tsx

@@ -3,6 +3,7 @@
 import { act, render, screen } from "@testing-library/react";
 import { useState, type FC, type PropsWithChildren } from "react";
 import { describe, expect, it } from "vitest";
+import { useAui } from "@assistant-ui/store";
 import {
   AssistantRuntimeProvider,
   useExternalStoreRuntime,
@@ -13,7 +14,11 @@ import * as ThreadPrimitive from "../primitives/thread";
 import * as MessagePrimitive from "../primitives/message";
 import * as MessagePartPrimitive from "../primitives/messagePart";
 
-type Msg = { id: string; role: "user" | "assistant"; text: string };
+type Msg = {
+  id: string;
+  role: "user" | "assistant" | "system";
+  text: string;
+};
 
 const convertMessage = (m: Msg): ThreadMessageLike => ({
   id: m.id,
@@ -39,6 +44,7 @@ const Provider: FC<PropsWithChildren<{ initial: Msg[] }>> = ({
     messages,
     convertMessage,
     onNew: async () => {},
+    onEdit: async () => {},
   });
   return (
     <AssistantRuntimeProvider runtime={runtime}>
@@ -47,6 +53,19 @@ const Provider: FC<PropsWithChildren<{ initial: Msg[] }>> = ({
   );
 };
 
+let beginEdit: (() => void) | undefined;
+
+const CaptureBeginEdit: FC = () => {
+  const aui = useAui();
+  beginEdit = () => aui.thread.message({ index: 0 }).composer().beginEdit();
+  return null;
+};
+
+const SYSTEM_COMPONENTS = {
+  UserMessage: () => <span>user</span>,
+  AssistantMessage: () => <span>assistant</span>,
+};
+
 let lastIds: readonly string[] | undefined;
 const idIdentities: (readonly string[])[] = [];
 
@@ -215,3 +234,44 @@ describe("ThreadPrimitive.Unstable_MessageById", () => {
     expect(screen.getByTestId("by-id").textContent).toBe("first");
   });
 });
+
+describe("system message editing fallback", () => {
+  it.each([
+    [
+      "Messages",
+      () => <ThreadPrimitive.Messages components={SYSTEM_COMPONENTS} />,
+    ],
+    [
+      "MessageByIndex",
+      () => (
+        <ThreadPrimitive.MessageByIndex
+          index={0}
+          components={SYSTEM_COMPONENTS}
+        />
+      ),
+    ],
+    [
+      "Unstable_MessageById",
+      () => (
+        <ThreadPrimitive.Unstable_MessageById
+          messageId="s1"
+          components={SYSTEM_COMPONENTS}
+        />
+      ),
+    ],
+  ])(
+    "renders nothing for a system message in edit mode through %s",
+    async (_, renderMessage) => {
+      const view = render(
+        <Provider initial={[{ id: "s1", role: "system", text: "sys" }]}>
+          <CaptureBeginEdit />
+          {renderMessage()}
+        </Provider>,
+      );
+
+      await act(async () => beginEdit!());
+
+      expect(view.container.textContent).toBe("");
+    },
+  );
+});

package/src/unstable/useComposerInput.ts

@@ -26,8 +26,8 @@ export type Unstable_ComposerInput = {
   value: string;
   /**
    * Writes `text` into the composer, mirroring `ComposerPrimitive.Input`:
-   * a no-op unless the composer is editing, committed via `flushTapSync` so the
-   * controlled value stays in sync within the same tick.
+   * a no-op unless the composer is editing; the controlled value stays in
+   * sync within the same tick.
    */
   setText(text: string): void;
   /**

package/src/unstable/useComposerInputHistory.test.tsx

@@ -6,7 +6,7 @@ const fixture = {
   messages: [] as { role: string; content: { type: string; text: string }[] }[],
   composerType: "thread",
   activeAria: null as object | null,
-  switchedToHandlers: [] as (() => void)[],
+  selectionChangedHandlers: [] as (() => void)[],
 };
 const setText = vi.fn();
 
@@ -18,7 +18,7 @@ vi.mock("@assistant-ui/store", () => ({
     },
     thread: { getState: () => ({ messages: fixture.messages }) },
     on: (_event: string, cb: () => void) => {
-      fixture.switchedToHandlers.push(cb);
+      fixture.selectionChangedHandlers.push(cb);
       return () => {};
     },
   }),
@@ -71,7 +71,7 @@ beforeEach(() => {
   fixture.messages = [user("first"), assistant("reply"), user("second")];
   fixture.composerType = "thread";
   fixture.activeAria = null;
-  fixture.switchedToHandlers = [];
+  fixture.selectionChangedHandlers = [];
   setText.mockClear();
 });
 
@@ -192,7 +192,7 @@ describe("unstable_useComposerInputHistory", () => {
   it("resets browsing when the thread switches", () => {
     const { textarea } = setup("");
     arrow(textarea, "ArrowUp");
-    fixture.switchedToHandlers.forEach((cb) => cb());
+    fixture.selectionChangedHandlers.forEach((cb) => cb());
     textarea.value = "second";
     const notPrevented = arrow(textarea, "ArrowDown");
     expect(notPrevented).toBe(true);

package/src/unstable/useComposerInputHistory.ts

@@ -72,7 +72,7 @@ export function unstable_useComposerInputHistory(): Unstable_ComposerInputHistor
   useEffect(() => {
     if (aui.composer.getState().type !== "thread") return undefined;
 
-    return aui.on("threadListItem.switchedTo", () => {
+    return aui.on("threads.selectionChanged", () => {
       browseRef.current = null;
     });
   }, [aui]);

package/src/unstable/useLiveCompletionAdapter.test.tsx

@@ -129,6 +129,137 @@ describe("unstable_useLiveCompletionAdapter", () => {
     expect(result.current.adapter.search!("ab")).toEqual([item("ab")]);
   });
 
+  it("refreshes cached results when the fetcher cache key changes", async () => {
+    const fetcherA = vi.fn(async () => [item("workspace-a")]);
+    const fetcherB = vi.fn(async () => [item("workspace-b")]);
+    const { result, rerender } = renderHook(
+      ({ fetcher, cacheKey }) =>
+        unstable_useLiveCompletionAdapter({
+          fetcher,
+          cacheKey,
+          debounceMs: 0,
+        }),
+      { initialProps: { fetcher: fetcherA, cacheKey: "workspace-a" } },
+    );
+
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(result.current.adapter.search!("alice")).toEqual([
+      item("workspace-a"),
+    ]);
+
+    await act(async () => {
+      rerender({ fetcher: fetcherB, cacheKey: "workspace-b" });
+    });
+    expect(result.current.adapter.search!("alice")).toEqual([]);
+
+    await act(async () => {
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(fetcherB).toHaveBeenCalledWith("alice");
+    expect(result.current.adapter.search!("alice")).toEqual([
+      item("workspace-b"),
+    ]);
+  });
+
+  it("drops pending results after the fetcher cache key changes", async () => {
+    let resolveA!: (items: readonly Unstable_TriggerItem[]) => void;
+    const fetcherA = vi.fn(
+      () =>
+        new Promise<readonly Unstable_TriggerItem[]>((resolve) => {
+          resolveA = resolve;
+        }),
+    );
+    const fetcherB = vi.fn(async () => [item("workspace-b")]);
+    const { result, rerender } = renderHook(
+      ({ fetcher, cacheKey }) =>
+        unstable_useLiveCompletionAdapter({
+          fetcher,
+          cacheKey,
+          debounceMs: 0,
+        }),
+      { initialProps: { fetcher: fetcherA, cacheKey: "workspace-a" } },
+    );
+
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    await act(async () => {
+      rerender({ fetcher: fetcherB, cacheKey: "workspace-b" });
+    });
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    await act(async () => {
+      resolveA([item("workspace-a")]);
+    });
+
+    expect(result.current.adapter.search!("alice")).toEqual([
+      item("workspace-b"),
+    ]);
+  });
+
+  it("keeps cached results when only the fetcher identity changes", async () => {
+    const first = vi.fn(async () => [item("alice")]);
+    const second = vi.fn(async () => [item("bob")]);
+    const { result, rerender } = renderHook(
+      ({ fetcher }) =>
+        unstable_useLiveCompletionAdapter({
+          fetcher,
+          cacheKey: "workspace-a",
+          debounceMs: 0,
+        }),
+      { initialProps: { fetcher: first } },
+    );
+
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(result.current.adapter.search!("alice")).toEqual([item("alice")]);
+
+    await act(async () => {
+      rerender({ fetcher: second });
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(second).not.toHaveBeenCalled();
+    expect(result.current.adapter.search!("alice")).toEqual([item("alice")]);
+  });
+
+  it("drops a pending result when only the cache key changes", async () => {
+    let resolveFirst!: (items: readonly Unstable_TriggerItem[]) => void;
+    const first = new Promise<readonly Unstable_TriggerItem[]>((resolve) => {
+      resolveFirst = resolve;
+    });
+    const fetcher = vi.fn(() => first);
+    const { result, rerender } = renderHook(
+      ({ cacheKey }) =>
+        unstable_useLiveCompletionAdapter({ fetcher, cacheKey, debounceMs: 0 }),
+      { initialProps: { cacheKey: "workspace-a" } },
+    );
+
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(fetcher).toHaveBeenCalledTimes(1);
+
+    await act(async () => {
+      rerender({ cacheKey: "workspace-b" });
+    });
+    await act(async () => {
+      resolveFirst([item("workspace-a")]);
+    });
+
+    expect(result.current.isLoading).toBe(false);
+    expect(fetcher).toHaveBeenCalledTimes(1);
+    expect(result.current.adapter.search!("alice")).toEqual([]);
+  });
+
   it("allows a failed query to be retried", async () => {
     const fetcher = vi
       .fn<(query: string) => Promise<readonly Unstable_TriggerItem[]>>()
@@ -156,6 +287,32 @@ describe("unstable_useLiveCompletionAdapter", () => {
     expect(result.current.adapter.search!("alice")).toEqual([item("alice")]);
   });
 
+  it("allows a synchronously failed query to be retried", async () => {
+    const fetcher = vi
+      .fn<(query: string) => Promise<readonly Unstable_TriggerItem[]>>()
+      .mockImplementationOnce(() => {
+        throw new Error("invalid request configuration");
+      })
+      .mockResolvedValueOnce([item("alice")]);
+    const { result } = renderHook(() =>
+      unstable_useLiveCompletionAdapter({ fetcher, debounceMs: 0 }),
+    );
+
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(fetcher).toHaveBeenCalledTimes(1);
+    expect(result.current.isLoading).toBe(false);
+
+    await act(async () => {
+      result.current.adapter.search!("alice");
+      await vi.advanceTimersByTimeAsync(0);
+    });
+    expect(fetcher).toHaveBeenCalledTimes(2);
+    expect(result.current.adapter.search!("alice")).toEqual([item("alice")]);
+  });
+
   it("does not automatically retry when search runs during every render", async () => {
     const fetcher = vi
       .fn<(query: string) => Promise<readonly Unstable_TriggerItem[]>>()

package/src/unstable/useLiveCompletionAdapter.ts

@@ -1,6 +1,13 @@
 "use client";
 
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import type {
   Unstable_TriggerAdapter,
   Unstable_TriggerItem,
@@ -13,6 +20,11 @@ export type Unstable_UseLiveCompletionAdapterOptions = {
    * next render.
    */
   readonly fetcher: (query: string) => Promise<readonly Unstable_TriggerItem[]>;
+  /**
+   * Identifies the fetcher's data source. Change this when switching accounts,
+   * workspaces, or another boundary that should invalidate cached results.
+   */
+  readonly cacheKey?: string | number | undefined;
   /** Debounce applied before a fetch fires, in milliseconds. @default 60 */
   readonly debounceMs?: number | undefined;
   /** When `false`, no fetch is scheduled and the adapter stays empty. @default true */
@@ -52,7 +64,7 @@ const NO_QUERY = "\u0000";
 export function unstable_useLiveCompletionAdapter(
   options: Unstable_UseLiveCompletionAdapterOptions,
 ): { adapter: Unstable_TriggerAdapter; isLoading: boolean } {
-  const { fetcher, debounceMs = 60, enabled = true } = options;
+  const { fetcher, cacheKey, debounceMs = 60, enabled = true } = options;
 
   const [state, setState] = useState<{
     query: string;
@@ -99,21 +111,23 @@ export function unstable_useLiveCompletionAdapter(
       setIsLoading(true);
       timerRef.current = setTimeout(() => {
         timerRef.current = null;
-        fetcherRef.current(query).then(
-          (items) => {
-            if (token !== tokenRef.current) return;
-            pendingRetryQueryRef.current = null;
-            setState({ query, items, failed: false });
-            setIsLoading(false);
-          },
-          () => {
-            if (token !== tokenRef.current) return;
-            pendingQueryRef.current = null;
-            pendingRetryQueryRef.current = null;
-            setState({ query, items: [], failed: true });
-            setIsLoading(false);
-          },
-        );
+        Promise.resolve()
+          .then(() => fetcherRef.current(query))
+          .then(
+            (items) => {
+              if (token !== tokenRef.current) return;
+              pendingRetryQueryRef.current = null;
+              setState({ query, items, failed: false });
+              setIsLoading(false);
+            },
+            () => {
+              if (token !== tokenRef.current) return;
+              pendingQueryRef.current = null;
+              pendingRetryQueryRef.current = null;
+              setState({ query, items: [], failed: true });
+              setIsLoading(false);
+            },
+          );
       }, debounceMs);
     },
     [enabled, debounceMs, cancelTimer, rearmPendingRetry],
@@ -127,6 +141,16 @@ export function unstable_useLiveCompletionAdapter(
     setIsLoading(false);
   }, [cancelTimer, rearmPendingRetry]);
 
+  const cacheKeyRef = useRef(cacheKey);
+  useLayoutEffect(() => {
+    if (cacheKeyRef.current === cacheKey) return;
+    cacheKeyRef.current = cacheKey;
+    invalidatePending();
+    retryableQueryRef.current = null;
+    pendingRetryQueryRef.current = null;
+    setState({ query: NO_QUERY, items: [], failed: false });
+  }, [cacheKey, invalidatePending]);
+
   useEffect(() => {
     if (enabled) return;
     invalidatePending();

package/src/utils/invokeCallbackSafely.ts

@@ -0,0 +1,11 @@
+export const invokeCallbackSafely = (invoke: () => unknown, name: string) => {
+  const reportFailure = (error: unknown) => {
+    console.error(`[assistant-ui] ${name} callback threw an error`, error);
+  };
+
+  try {
+    void Promise.resolve(invoke()).catch(reportFailure);
+  } catch (error) {
+    reportFailure(error);
+  }
+};