@assistant-ui/core 0.3.1 → 0.3.3

package/src/react/runtimes/RemoteThreadListHookInstanceManager.tsx

@@ -4,6 +4,7 @@ import {
   useCallback,
   useRef,
   useEffect,
+  useEffectEvent,
   useLayoutEffect,
   memo,
   type PropsWithChildren,
@@ -142,23 +143,25 @@ export class RemoteThreadListHookInstanceManager extends BaseSubscribable {
       }
     }, [threadBinding]);
 
-    useEffect(() => {
-      hasInitializedRef.current = false;
-      return runtime.threads.main.unstable_on("initialize", () => {
-        if (hasInitializedRef.current) return;
+    const handleInitialize = useEffectEvent(() => {
+      if (hasInitializedRef.current) return;
 
-        const state = aui.threadListItem.getState();
-        if (state.status !== "new") return;
-        hasInitializedRef.current = true;
+      const state = aui.threadListItem.getState();
+      if (state.status !== "new") return;
+      hasInitializedRef.current = true;
 
-        initPromiseRef.current = aui.threadListItem.initialize();
+      initPromiseRef.current = aui.threadListItem.initialize();
 
-        const dispose = runtime.thread.unstable_on("runEnd", () => {
-          dispose();
-          aui.threadListItem.generateTitle();
-        });
+      const dispose = runtime.thread.unstable_on("runEnd", () => {
+        dispose();
+        aui.threadListItem.generateTitle();
       });
-    }, [runtime, aui]);
+    });
+
+    useEffect(() => {
+      hasInitializedRef.current = false;
+      return runtime.threads.main.unstable_on("initialize", handleInitialize);
+    }, [runtime]);
 
     return <>{children}</>;
   };

package/src/react/runtimes/RemoteThreadListThreadListRuntimeCore.tsx

@@ -200,6 +200,10 @@ export class RemoteThreadListThreadListRuntimeCore
 
     const adapterChanged =
       this._options !== undefined && this._options.adapter !== options.adapter;
+    const controlledThreadIdChanged =
+      this._initialThreadLoaded &&
+      this._options !== undefined &&
+      this._options.threadId !== options.threadId;
 
     this._options = options;
 
@@ -219,15 +223,25 @@ export class RemoteThreadListThreadListRuntimeCore
         cursor: undefined,
       });
     }
+
+    if (controlledThreadIdChanged) {
+      this._switchToThreadFromProp(options.threadId).catch(() => {});
+    }
   }
 
   public __internal_load() {
     this.getLoadThreadsPromise(); // begin loading on initial bind
+    if (this._initialThreadLoaded) return;
+    this._initialThreadLoaded = true;
+
     const startThreadId =
       this._options.threadId ?? this._options.initialThreadId;
-    if (!this._initialThreadLoaded && startThreadId) {
-      this._initialThreadLoaded = true;
-      this.switchToThread(startThreadId).catch(() => {});
+    if (startThreadId !== undefined) {
+      const switchTask =
+        this._options.threadId !== undefined
+          ? this._switchToThreadFromProp(startThreadId)
+          : this.switchToThread(startThreadId);
+      switchTask.catch(() => {});
     }
   }
 
@@ -279,11 +293,13 @@ export class RemoteThreadListThreadListRuntimeCore
 
   private _lastNotifiedThreadId: string | undefined = undefined;
 
-  private _notifyThreadIdChange() {
+  private _notifyThreadIdChange(emit = true) {
     const threadId = this._mainThreadRemoteId;
     if (this._lastNotifiedThreadId === threadId) return;
     this._lastNotifiedThreadId = threadId;
-    this._options.onThreadIdChange?.(threadId);
+    if (emit) {
+      this._options.onThreadIdChange?.(threadId);
+    }
   }
 
   public getMainThreadRuntimeCore() {
@@ -312,9 +328,22 @@ export class RemoteThreadListThreadListRuntimeCore
   public switchToThread(
     threadIdOrRemoteId: string,
     options?: { unarchive?: boolean },
+  ): Promise<void> {
+    return this._startSwitchToThread(threadIdOrRemoteId, options, true);
+  }
+
+  private _startSwitchToThread(
+    threadIdOrRemoteId: string,
+    options: { unarchive?: boolean } | undefined,
+    emitThreadIdChange: boolean,
   ): Promise<void> {
     const generation = ++this._switchGeneration;
-    const task = this._switchToThread(threadIdOrRemoteId, options, generation);
+    const task = this._switchToThread(
+      threadIdOrRemoteId,
+      options,
+      generation,
+      emitThreadIdChange,
+    );
     this._switchTask = task;
     return task;
   }
@@ -323,6 +352,7 @@ export class RemoteThreadListThreadListRuntimeCore
     threadIdOrRemoteId: string,
     options: { unarchive?: boolean } | undefined,
     generation: number,
+    emitThreadIdChange: boolean,
   ): Promise<void> {
     let data = this.getItemById(threadIdOrRemoteId);
 
@@ -418,17 +448,30 @@ export class RemoteThreadListThreadListRuntimeCore
     this._mainThreadId = data.id;
 
     this._notifySubscribers();
-    this._notifyThreadIdChange();
+    this._notifyThreadIdChange(emitThreadIdChange);
   }
 
   public switchToNewThread(): Promise<void> {
+    return this._startSwitchToNewThread(true);
+  }
+
+  private _switchToThreadFromProp(threadId: string | undefined): Promise<void> {
+    return threadId !== undefined
+      ? this._startSwitchToThread(threadId, undefined, false)
+      : this._startSwitchToNewThread(false);
+  }
+
+  private _startSwitchToNewThread(emitThreadIdChange: boolean): Promise<void> {
     const generation = ++this._switchGeneration;
-    const task = this._switchToNewThread(generation);
+    const task = this._switchToNewThread(generation, emitThreadIdChange);
     this._switchTask = task;
     return task;
   }
 
-  private async _switchToNewThread(generation: number): Promise<void> {
+  private async _switchToNewThread(
+    generation: number,
+    emitThreadIdChange: boolean,
+  ): Promise<void> {
     // an initialization transaction is in progress, wait for it to settle
     while (
       this._state.baseValue.newThreadId !== undefined &&
@@ -467,7 +510,7 @@ export class RemoteThreadListThreadListRuntimeCore
       });
     }
 
-    return this._switchToThread(id, undefined, generation);
+    return this._switchToThread(id, undefined, generation, emitThreadIdChange);
   }
 
   public initialize = async (threadId: string) => {

package/src/react/runtimes/cloud/AssistantCloudThreadHistoryAdapter.ts

@@ -22,18 +22,18 @@ const globalPersistence = new WeakMap<
 
 class AssistantCloudThreadHistoryAdapter implements ThreadHistoryAdapter {
   private cloudRef: RefObject<AssistantCloud>;
-  private auiRef: RefObject<AssistantClient>;
+  private getAui: () => AssistantClient;
 
   constructor(
     cloudRef: RefObject<AssistantCloud>,
-    auiRef: RefObject<AssistantClient>,
+    getAui: () => AssistantClient,
   ) {
     this.cloudRef = cloudRef;
-    this.auiRef = auiRef;
+    this.getAui = getAui;
   }
 
   private get aui(): AssistantClient {
-    return this.auiRef.current;
+    return this.getAui();
   }
 
   private get _persistence(): CloudMessagePersistence {
@@ -816,12 +816,14 @@ export function useAssistantCloudThreadHistoryAdapter(
   cloudRef: RefObject<AssistantCloud>,
 ): ThreadHistoryAdapter {
   const aui = useAui();
+  // Not useEffectEvent: history adapter methods run during render (SSR load).
   const auiRef = useRef(aui);
   useEffect(() => {
     auiRef.current = aui;
   });
   const [adapter] = useState(
-    () => new AssistantCloudThreadHistoryAdapter(cloudRef, auiRef),
+    () =>
+      new AssistantCloudThreadHistoryAdapter(cloudRef, () => auiRef.current),
   );
   return adapter;
 }

package/src/react/runtimes/cloud/auiV0.ts

@@ -1,13 +1,8 @@
 import type {
-  DataMessagePart,
-  FileMessagePart,
-  ImageMessagePart,
   MessageStatus,
   SourceProviderMetadata,
   ThreadMessage,
-  TextMessagePart,
   ToolApprovalOption,
-  Unstable_AudioMessagePart,
 } from "../../../types/message";
 import type { CompleteAttachment } from "../../../types/attachment";
 import { fromThreadMessageLike } from "../../../runtime/utils/thread-message-like";
@@ -85,11 +80,33 @@ type AuiV0MessagePart =
     };
 
 type AuiV0AttachmentPart =
-  | TextMessagePart
-  | ImageMessagePart
-  | FileMessagePart
-  | Unstable_AudioMessagePart
-  | DataMessagePart<ReadonlyJSONValue>;
+  | {
+      readonly type: "text";
+      readonly text: string;
+    }
+  | {
+      readonly type: "image";
+      readonly image: string;
+      readonly filename?: string;
+    }
+  | {
+      readonly type: "file";
+      readonly data: string;
+      readonly mimeType: string;
+      readonly filename?: string;
+    }
+  | {
+      readonly type: "audio";
+      readonly audio: {
+        readonly data: string;
+        readonly format: "mp3" | "wav";
+      };
+    }
+  | {
+      readonly type: "data";
+      readonly name: string;
+      readonly data: ReadonlyJSONValue;
+    };
 
 type AuiV0Attachment = {
   readonly id: string;
@@ -125,16 +142,38 @@ const encodeAttachmentPart = (
   const type = part.type;
   switch (type) {
     case "text":
+      return { type: "text", text: part.text };
+
     case "image":
+      return {
+        type: "image",
+        image: part.image,
+        ...(part.filename != null ? { filename: part.filename } : undefined),
+      };
+
     case "file":
+      return {
+        type: "file",
+        data: part.data,
+        mimeType: part.mimeType,
+        ...(part.filename != null ? { filename: part.filename } : undefined),
+      };
+
     case "audio":
-      return part;
+      return {
+        type: "audio",
+        audio: { data: part.audio.data, format: part.audio.format },
+      };
 
     case "data": {
       if (!isJSONValue(part.data)) {
         console.warn(`attachment data is not JSON! ${JSON.stringify(part)}`);
       }
-      return { ...part, data: part.data as ReadonlyJSONValue };
+      return {
+        type: "data",
+        name: part.name,
+        data: part.data as ReadonlyJSONValue,
+      };
     }
 
     default: {

package/src/react/runtimes/useRemoteThreadListRuntime.ts

@@ -51,8 +51,7 @@ export const useRemoteThreadListRuntime = (
   const runtimeHookRef = useRef(options.runtimeHook);
   runtimeHookRef.current = options.runtimeHook;
 
-  // threadId/initialThreadId only affect the constructor; capture once via ref
-  const startThreadIdRef = useRef(options.threadId ?? options.initialThreadId);
+  const initialThreadIdRef = useRef(options.initialThreadId);
 
   const stableRuntimeHook = useCallback(() => {
     return runtimeHookRef.current();
@@ -66,11 +65,17 @@ export const useRemoteThreadListRuntime = (
     () => ({
       adapter: options.adapter,
       allowNesting: options.allowNesting,
-      initialThreadId: startThreadIdRef.current,
+      threadId: options.threadId,
+      initialThreadId: initialThreadIdRef.current,
       runtimeHook: stableRuntimeHook,
       onThreadIdChange,
     }),
-    [options.adapter, options.allowNesting, stableRuntimeHook],
+    [
+      options.adapter,
+      options.allowNesting,
+      options.threadId,
+      stableRuntimeHook,
+    ],
   );
 
   const aui = useAui();
@@ -91,16 +96,5 @@ export const useRemoteThreadListRuntime = (
 
   const runtime = useRemoteThreadListRuntimeImpl(stableOptions);
 
-  const prevThreadIdRef = useRef(options.threadId);
-  useEffect(() => {
-    if (options.threadId === prevThreadIdRef.current) return;
-    prevThreadIdRef.current = options.threadId;
-    if (options.threadId) {
-      runtime.threads.switchToThread(options.threadId).catch(() => {});
-    } else {
-      runtime.threads.switchToNewThread().catch(() => {});
-    }
-  }, [runtime, options.threadId]);
-
   return runtime;
 };

package/src/runtime/api/message-runtime.test.ts

@@ -1,8 +1,10 @@
 import { describe, expect, it } from "vitest";
 import type { CompleteAttachment } from "../../types/attachment";
+import type { ThreadAssistantMessage } from "../../types/message";
 import type { ThreadRuntimeCoreBinding } from "./thread-runtime";
 import {
   MessageRuntimeImpl,
+  toMessagePartStatus,
   type MessageState,
   type MessageStateBinding,
 } from "./message-runtime";
@@ -63,6 +65,144 @@ const threadBinding = {
   subscribe: () => () => {},
 } as unknown as ThreadRuntimeCoreBinding;
 
+const createAssistantMessage = (
+  content: ThreadAssistantMessage["content"],
+  status: ThreadAssistantMessage["status"],
+): ThreadAssistantMessage => ({
+  id: "message-1",
+  role: "assistant",
+  createdAt: new Date(0),
+  content,
+  status,
+  metadata: {
+    unstable_state: null,
+    unstable_annotations: [],
+    unstable_data: [],
+    steps: [],
+    custom: {},
+  },
+});
+
+describe("toMessagePartStatus", () => {
+  it("honours a supplied running status on a non-last part", () => {
+    const message = createAssistantMessage(
+      [
+        { type: "text", text: "first", status: { type: "running" } },
+        { type: "text", text: "last" },
+      ],
+      { type: "running" },
+    );
+
+    expect(toMessagePartStatus(message, 0, message.content[0]!)).toEqual({
+      type: "running",
+    });
+  });
+
+  it("honours a supplied complete status on the last part", () => {
+    const message = createAssistantMessage(
+      [{ type: "reasoning", text: "done", status: { type: "complete" } }],
+      { type: "running" },
+    );
+
+    expect(toMessagePartStatus(message, 0, message.content[0]!)).toEqual({
+      type: "complete",
+    });
+  });
+
+  it("ignores supplied statuses after the message completes", () => {
+    const message = createAssistantMessage(
+      [{ type: "text", text: "truncated", status: { type: "running" } }],
+      { type: "complete", reason: "stop" },
+    );
+
+    expect(toMessagePartStatus(message, 0, message.content[0]!)).toEqual({
+      type: "complete",
+      reason: "stop",
+    });
+  });
+
+  it("falls back to positional statuses for statusless running parts", () => {
+    const message = createAssistantMessage(
+      [
+        { type: "text", text: "first" },
+        { type: "reasoning", text: "last" },
+      ],
+      { type: "running" },
+    );
+
+    expect(toMessagePartStatus(message, 0, message.content[0]!)).toEqual({
+      type: "complete",
+    });
+    expect(toMessagePartStatus(message, 1, message.content[1]!)).toEqual({
+      type: "running",
+    });
+  });
+
+  it("preserves tool-call status derivation", () => {
+    const unresolved = createAssistantMessage(
+      [
+        {
+          type: "tool-call",
+          toolCallId: "call-1",
+          toolName: "weather",
+          args: {},
+          argsText: "{}",
+        },
+      ],
+      { type: "running" },
+    );
+    const resolved = createAssistantMessage(
+      [
+        {
+          type: "tool-call",
+          toolCallId: "call-1",
+          toolName: "weather",
+          args: {},
+          argsText: "{}",
+          result: "sunny",
+        },
+      ],
+      { type: "running" },
+    );
+
+    expect(toMessagePartStatus(unresolved, 0, unresolved.content[0]!)).toEqual({
+      type: "running",
+    });
+    expect(toMessagePartStatus(resolved, 0, resolved.content[0]!)).toEqual({
+      type: "complete",
+    });
+  });
+
+  it("normalizes supplied upstream statuses", () => {
+    const upstreamComplete = {
+      type: "text",
+      text: "done",
+      status: { type: "complete", reason: "unknown" },
+    } as unknown as ThreadAssistantMessage["content"][number];
+    const upstreamIncomplete = {
+      type: "reasoning",
+      text: "interrupted",
+      status: {
+        type: "incomplete",
+        reason: "unknown",
+        error: "upstream error",
+      },
+    } as unknown as ThreadAssistantMessage["content"][number];
+    const message = createAssistantMessage(
+      [upstreamComplete, upstreamIncomplete],
+      { type: "running" },
+    );
+
+    expect(toMessagePartStatus(message, 0, message.content[0]!)).toEqual({
+      type: "complete",
+    });
+    expect(toMessagePartStatus(message, 1, message.content[1]!)).toEqual({
+      type: "incomplete",
+      reason: "other",
+    });
+  });
+});
+
 describe("MessageRuntimeImpl paths", () => {
   it("appends nested selectors to the message path", () => {
     const runtime = new MessageRuntimeImpl(messageBinding, threadBinding);

package/src/runtime/api/message-runtime.ts

@@ -8,6 +8,10 @@ import type {
 } from "../../types/message";
 import type { Unsubscribe } from "../../types/unsubscribe";
 import type { MessagePartStatus, RunConfig } from "../../types/message";
+import {
+  COMPLETE_STATUS,
+  normalizePartStatus,
+} from "../../utils/normalizePartStatus";
 import { getThreadMessageText } from "../../utils/text";
 import { NestedSubscriptionSubject } from "../../subscribable/subscribable";
 import {
@@ -32,10 +36,6 @@ import type { MessageRuntimePath } from "./paths";
 import type { ThreadRuntimeCoreBinding } from "./thread-runtime";
 import type { MessageStateBinding } from "./bindings";
 
-const COMPLETE_STATUS: MessagePartStatus = Object.freeze({
-  type: "complete",
-});
-
 export const toMessagePartStatus = (
   message: ThreadMessage,
   partIndex: number,
@@ -51,6 +51,11 @@ export const toMessagePartStatus = (
     }
   }
 
+  if (message.status.type === "running") {
+    const status = normalizePartStatus(part);
+    if (status) return status;
+  }
+
   const isLastPart = partIndex === Math.max(0, message.content.length - 1);
   if (message.status.type === "requires-action") return COMPLETE_STATUS;
   return isLastPart ? (message.status as MessagePartStatus) : COMPLETE_STATUS;
@@ -70,7 +75,7 @@ const getMessagePartState = (
   return Object.freeze({
     ...part,
     ...{ [symbolInnerMessage]: (part as any)[symbolInnerMessage] },
-    status,
+    status: status as MessagePartStatus,
   });
 };
 

package/src/runtime/utils/thread-message-like.ts

@@ -131,12 +131,12 @@ export const fromThreadMessageLike = (
   }: ImageMessagePart): ImageMessagePart | null => {
     if (typeof image !== "string") return null;
     const dataUri = image.match(
-      /^data:image\/(png|jpeg|jpg|gif|webp|svg\+xml);base64,(.*)$/,
+      /^data:image\/(png|jpeg|jpg|gif|webp|svg\+xml);base64,(.*)$/i,
     );
     if (dataUri) {
       return { ...rest, image };
     }
-    if (/^(https:\/\/|blob:)/.test(image)) {
+    if (/^(https:\/\/|blob:)/i.test(image)) {
       return { ...rest, image };
     }
     console.warn(`Invalid image data format detected`);

package/src/runtimes/remote-thread-list/types.ts

@@ -78,10 +78,11 @@ export type RemoteThreadListOptions = {
   threadId?: string | undefined;
 
   /**
-   * Called whenever the active thread's canonical (remote) ID changes, so the
-   * value can be treated as a managed/controlled variable (e.g. synced to a
-   * URL query param). Together with `threadId` this forms the controlled
-   * pattern: `threadId` in, `onThreadIdChange` out.
+   * Called whenever the runtime changes the active thread's canonical (remote)
+   * ID, so the value can be treated as a managed/controlled variable (e.g.
+   * synced to a URL query param). Changes initiated by the controlled
+   * `threadId` option are not echoed back. Together these options form the
+   * controlled pattern: `threadId` in, `onThreadIdChange` out.
    *
    * Only the settled remote ID is emitted: while a freshly created thread is
    * still optimistic (no remote ID yet) the value is `undefined`, and the real

package/src/store/clients/chain-of-thought-client.ts

@@ -5,12 +5,8 @@ import type {
   ChainOfThoughtState,
   ChainOfThoughtPart,
 } from "../scopes/chain-of-thought";
-import type { MessagePartStatus } from "../../types/message";
 import type { PartMethods } from "../scopes/part";
-
-const COMPLETE_STATUS: MessagePartStatus = Object.freeze({
-  type: "complete",
-});
+import { getGroupStatus } from "../../utils/getGroupStatus";
 
 const useChainOfThoughtClient = ({
   parts,
@@ -22,8 +18,7 @@ const useChainOfThoughtClient = ({
   const [collapsed, setCollapsed] = useState(true);
 
   const status = useMemo(() => {
-    const lastPart = parts[parts.length - 1];
-    return lastPart?.status ?? COMPLETE_STATUS;
+    return getGroupStatus(parts);
   }, [parts]);
 
   const state = useMemo<ChainOfThoughtState>(