@assistant-ui/core 0.2.10 → 0.2.11

package/src/store/runtime-clients/thread-list-item-runtime-client.ts

@@ -1,57 +1,56 @@
 import type { Unsubscribe } from "../../types/unsubscribe";
-import { resource, tapEffect } from "@assistant-ui/tap";
-import { type ClientOutput, tapAssistantEmit } from "@assistant-ui/store";
+import { useEffect } from "react";
+import { resource } from "@assistant-ui/tap";
+import { type ClientOutput, useAssistantEmit } from "@assistant-ui/store";
 import type {
   ThreadListItemEventType,
   ThreadListItemRuntime,
 } from "../../runtime/api/thread-list-item-runtime";
-import { tapSubscribable } from "./tap-subscribable";
+import { useSubscribable } from "./useSubscribable";
 
-export const ThreadListItemClient = resource(
-  ({
-    runtime,
-  }: {
-    runtime: ThreadListItemRuntime;
-  }): ClientOutput<"threadListItem"> => {
-    const state = tapSubscribable(runtime);
-    const emit = tapAssistantEmit();
+export const ThreadListItemClient = resource(function ThreadListItemClient({
+  runtime,
+}: {
+  runtime: ThreadListItemRuntime;
+}): ClientOutput<"threadListItem"> {
+  const state = useSubscribable(runtime);
+  const emit = useAssistantEmit();
 
-    // Bind thread list item events to event manager
-    tapEffect(() => {
-      const unsubscribers: Unsubscribe[] = [];
+  // Bind thread list item events to event manager
+  useEffect(() => {
+    const unsubscribers: Unsubscribe[] = [];
 
-      // Subscribe to thread list item events
-      const threadListItemEvents: ThreadListItemEventType[] = [
-        "switchedTo",
-        "switchedAway",
-      ];
+    // Subscribe to thread list item events
+    const threadListItemEvents: ThreadListItemEventType[] = [
+      "switchedTo",
+      "switchedAway",
+    ];
 
-      for (const event of threadListItemEvents) {
-        const unsubscribe = runtime.unstable_on(event, () => {
-          emit(`threadListItem.${event}`, {
-            threadId: runtime.getState()!.id,
-          });
+    for (const event of threadListItemEvents) {
+      const unsubscribe = runtime.unstable_on(event, () => {
+        emit(`threadListItem.${event}`, {
+          threadId: runtime.getState()!.id,
         });
-        unsubscribers.push(unsubscribe);
-      }
+      });
+      unsubscribers.push(unsubscribe);
+    }
 
-      return () => {
-        for (const unsub of unsubscribers) unsub();
-      };
-    }, [runtime, emit]);
-
-    return {
-      getState: () => state,
-      switchTo: runtime.switchTo,
-      rename: runtime.rename,
-      updateCustom: runtime.updateCustom,
-      archive: runtime.archive,
-      unarchive: runtime.unarchive,
-      delete: runtime.delete,
-      generateTitle: runtime.generateTitle,
-      initialize: runtime.initialize,
-      detach: runtime.detach,
-      __internal_getRuntime: () => runtime,
+    return () => {
+      for (const unsub of unsubscribers) unsub();
     };
-  },
-);
+  }, [runtime, emit]);
+
+  return {
+    getState: () => state,
+    switchTo: runtime.switchTo,
+    rename: runtime.rename,
+    updateCustom: runtime.updateCustom,
+    archive: runtime.archive,
+    unarchive: runtime.unarchive,
+    delete: runtime.delete,
+    generateTitle: runtime.generateTitle,
+    initialize: runtime.initialize,
+    detach: runtime.detach,
+    __internal_getRuntime: () => runtime,
+  };
+});

package/src/store/runtime-clients/thread-list-runtime-client.ts

@@ -1,96 +1,99 @@
-import { withKey, resource, tapResource, tapMemo } from "@assistant-ui/tap";
+import { useMemo } from "react";
+import { useResource, withKey, resource } from "@assistant-ui/tap";
 import {
   type ClientOutput,
-  tapClientLookup,
-  tapClientResource,
+  useClientLookup,
+  useClientResource,
 } from "@assistant-ui/store";
 import type { ThreadListRuntime } from "../../runtime/api/thread-list-runtime";
 import type { AssistantRuntime } from "../../runtime/api/assistant-runtime";
-import { tapSubscribable } from "./tap-subscribable";
+import { useSubscribable } from "./useSubscribable";
 import { ThreadListItemClient } from "./thread-list-item-runtime-client";
 import { ThreadClient } from "./thread-runtime-client";
 import type { ThreadsState } from "../scopes/threads";
 
-const ThreadListItemClientById = resource(
-  ({ runtime, id }: { runtime: ThreadListRuntime; id: string }) => {
-    const threadListItemRuntime = tapMemo(
-      () => runtime.getItemById(id),
-      [runtime, id],
-    );
-    return tapResource(
-      ThreadListItemClient({
-        runtime: threadListItemRuntime,
-      }),
-    );
-  },
-);
+const ThreadListItemClientById = resource(function ThreadListItemClientById({
+  runtime,
+  id,
+}: {
+  runtime: ThreadListRuntime;
+  id: string;
+}) {
+  const threadListItemRuntime = useMemo(
+    () => runtime.getItemById(id),
+    [runtime, id],
+  );
+  return useResource(
+    ThreadListItemClient({
+      runtime: threadListItemRuntime,
+    }),
+  );
+});
 
-export const ThreadListClient = resource(
-  ({
-    runtime,
-    __internal_assistantRuntime,
-  }: {
-    runtime: ThreadListRuntime;
-    __internal_assistantRuntime: AssistantRuntime;
-  }): ClientOutput<"threads"> => {
-    const runtimeState = tapSubscribable(runtime);
+export const ThreadListClient = resource(function ThreadListClient({
+  runtime,
+  __internal_assistantRuntime,
+}: {
+  runtime: ThreadListRuntime;
+  __internal_assistantRuntime: AssistantRuntime;
+}): ClientOutput<"threads"> {
+  const runtimeState = useSubscribable(runtime);
 
-    const main = tapClientResource(
-      ThreadClient({
-        runtime: runtime.main,
-      }),
-    );
-    const threadItems = tapClientLookup(
-      () =>
-        Object.keys(runtimeState.threadItems).map((id) =>
-          withKey(id, ThreadListItemClientById({ runtime, id })),
-        ),
-      [runtimeState.threadItems, runtime],
-    );
+  const main = useClientResource(
+    ThreadClient({
+      runtime: runtime.main,
+    }),
+  );
+  const threadItems = useClientLookup(
+    () =>
+      Object.keys(runtimeState.threadItems).map((id) =>
+        withKey(id, ThreadListItemClientById({ runtime, id })),
+      ),
+    [runtimeState.threadItems, runtime],
+  );
 
-    const state = tapMemo<ThreadsState>(() => {
-      return {
-        mainThreadId: runtimeState.mainThreadId,
-        newThreadId: runtimeState.newThreadId ?? null,
-        isLoading: runtimeState.isLoading,
-        isLoadingMore: runtimeState.isLoadingMore,
-        hasMore: runtimeState.hasMore,
-        threadIds: runtimeState.threadIds,
-        archivedThreadIds: runtimeState.archivedThreadIds,
-        threadItems: threadItems.state,
+  const state = useMemo<ThreadsState>(() => {
+    return {
+      mainThreadId: runtimeState.mainThreadId,
+      newThreadId: runtimeState.newThreadId ?? null,
+      isLoading: runtimeState.isLoading,
+      isLoadingMore: runtimeState.isLoadingMore,
+      hasMore: runtimeState.hasMore,
+      threadIds: runtimeState.threadIds,
+      archivedThreadIds: runtimeState.archivedThreadIds,
+      threadItems: threadItems.state,
 
-        main: main.state,
-      };
-    }, [runtimeState, threadItems.state, main.state]);
+      main: main.state,
+    };
+  }, [runtimeState, threadItems.state, main.state]);
 
-    return {
-      getState: () => state,
-      thread: () => main.methods,
-      item: (threadIdOrOptions) => {
-        if (threadIdOrOptions === "main") {
-          return threadItems.get({ key: state.mainThreadId });
-        }
+  return {
+    getState: () => state,
+    thread: () => main.methods,
+    item: (threadIdOrOptions) => {
+      if (threadIdOrOptions === "main") {
+        return threadItems.get({ key: state.mainThreadId });
+      }
 
-        if ("id" in threadIdOrOptions) {
-          return threadItems.get({ key: threadIdOrOptions.id });
-        }
+      if ("id" in threadIdOrOptions) {
+        return threadItems.get({ key: threadIdOrOptions.id });
+      }
 
-        const { index, archived = false } = threadIdOrOptions;
-        const id = archived
-          ? state.archivedThreadIds[index]!
-          : state.threadIds[index]!;
-        return threadItems.get({ key: id });
-      },
-      switchToThread: async (threadId, options) => {
-        await runtime.switchToThread(threadId, options);
-      },
-      switchToNewThread: async () => {
-        await runtime.switchToNewThread();
-      },
-      getLoadThreadsPromise: () => runtime.getLoadThreadsPromise(),
-      reload: () => runtime.reload(),
-      loadMore: () => runtime.loadMore(),
-      __internal_getAssistantRuntime: () => __internal_assistantRuntime,
-    };
-  },
-);
+      const { index, archived = false } = threadIdOrOptions;
+      const id = archived
+        ? state.archivedThreadIds[index]!
+        : state.threadIds[index]!;
+      return threadItems.get({ key: id });
+    },
+    switchToThread: async (threadId, options) => {
+      await runtime.switchToThread(threadId, options);
+    },
+    switchToNewThread: async () => {
+      await runtime.switchToNewThread();
+    },
+    getLoadThreadsPromise: () => runtime.getLoadThreadsPromise(),
+    reload: () => runtime.reload(),
+    loadMore: () => runtime.loadMore(),
+    __internal_getAssistantRuntime: () => __internal_assistantRuntime,
+  };
+});

package/src/store/runtime-clients/thread-runtime-client.ts

@@ -1,141 +1,135 @@
 import type { Unsubscribe } from "../../types/unsubscribe";
 import type { ThreadRuntimeEventType } from "../../runtime/interfaces/thread-runtime-core";
 import type { ThreadRuntime } from "../../runtime/api/thread-runtime";
-import {
-  resource,
-  tapResource,
-  tapMemo,
-  tapEffect,
-  type tapRef,
-  withKey,
-} from "@assistant-ui/tap";
+import { useMemo, useEffect, RefObject } from "react";
+import { useResource, resource, withKey } from "@assistant-ui/tap";
 import {
   type ClientOutput,
-  tapAssistantEmit,
-  tapClientLookup,
-  tapClientResource,
+  useAssistantEmit,
+  useClientLookup,
+  useClientResource,
 } from "@assistant-ui/store";
 import { ComposerClient } from "./composer-runtime-client";
 import { MessageClient } from "./message-runtime-client";
-import { tapSubscribable } from "./tap-subscribable";
+import { useSubscribable } from "./useSubscribable";
 import type { ThreadState } from "../scopes/thread";
 
-const MessageClientById = resource(
-  ({
-    runtime,
-    id,
-    threadIdRef,
-  }: {
-    runtime: ThreadRuntime;
-    id: string;
-    threadIdRef: tapRef.RefObject<string>;
-  }) => {
-    const messageRuntime = tapMemo(
-      () => runtime.getMessageById(id),
-      [runtime, id],
-    );
+const MessageClientById = resource(function MessageClientById({
+  runtime,
+  id,
+  threadIdRef,
+}: {
+  runtime: ThreadRuntime;
+  id: string;
+  threadIdRef: RefObject<string>;
+}) {
+  const messageRuntime = useMemo(
+    () => runtime.getMessageById(id),
+    [runtime, id],
+  );
 
-    return tapResource(MessageClient({ runtime: messageRuntime, threadIdRef }));
-  },
-);
+  return useResource(MessageClient({ runtime: messageRuntime, threadIdRef }));
+});
 
-export const ThreadClient = resource(
-  ({ runtime }: { runtime: ThreadRuntime }): ClientOutput<"thread"> => {
-    const runtimeState = tapSubscribable(runtime);
-    const emit = tapAssistantEmit();
+export const ThreadClient = resource(function ThreadClient({
+  runtime,
+}: {
+  runtime: ThreadRuntime;
+}): ClientOutput<"thread"> {
+  const runtimeState = useSubscribable(runtime);
+  const emit = useAssistantEmit();
 
-    tapEffect(() => {
-      const unsubscribers: Unsubscribe[] = [];
+  useEffect(() => {
+    const unsubscribers: Unsubscribe[] = [];
 
-      const threadEvents: ThreadRuntimeEventType[] = [
-        "runStart",
-        "runEnd",
-        "initialize",
-        "modelContextUpdate",
-      ];
+    const threadEvents: ThreadRuntimeEventType[] = [
+      "runStart",
+      "runEnd",
+      "initialize",
+      "modelContextUpdate",
+    ];
 
-      for (const event of threadEvents) {
-        const unsubscribe = runtime.unstable_on(event, () => {
-          const threadId = runtime.getState()?.threadId || "unknown";
-          emit(`thread.${event}`, {
-            threadId,
-          });
+    for (const event of threadEvents) {
+      const unsubscribe = runtime.unstable_on(event, () => {
+        const threadId = runtime.getState()?.threadId || "unknown";
+        emit(`thread.${event}`, {
+          threadId,
         });
-        unsubscribers.push(unsubscribe);
-      }
-
-      return () => {
-        for (const unsub of unsubscribers) unsub();
-      };
-    }, [runtime, emit]);
+      });
+      unsubscribers.push(unsubscribe);
+    }
 
-    const threadIdRef = tapMemo(
-      () => ({
-        get current() {
-          return runtime.getState()!.threadId;
-        },
-      }),
-      [runtime],
-    );
-
-    const composer = tapClientResource(
-      ComposerClient({
-        runtime: runtime.composer,
-        threadIdRef,
-      }),
-    );
-    const messages = tapClientLookup(
-      () =>
-        runtimeState.messages.map((m) =>
-          withKey(m.id, MessageClientById({ runtime, id: m.id, threadIdRef })),
-        ),
-      [runtimeState.messages, runtime, threadIdRef],
-    );
+    return () => {
+      for (const unsub of unsubscribers) unsub();
+    };
+  }, [runtime, emit]);
 
-    const state = tapMemo<ThreadState>(() => {
-      return {
-        isEmpty: messages.state.length === 0 && !runtimeState.isLoading,
-        isDisabled: runtimeState.isDisabled,
-        isLoading: runtimeState.isLoading,
-        isRunning: runtimeState.isRunning,
-        capabilities: runtimeState.capabilities,
-        state: runtimeState.state,
-        suggestions: runtimeState.suggestions,
-        extras: runtimeState.extras,
-        speech: runtimeState.speech,
-        voice: runtimeState.voice,
+  const threadIdRef = useMemo(
+    () => ({
+      get current() {
+        return runtime.getState()!.threadId;
+      },
+    }),
+    [runtime],
+  );
 
-        composer: composer.state,
-        messages: messages.state,
-      };
-    }, [runtimeState, messages, composer.state]);
+  const composer = useClientResource(
+    ComposerClient({
+      runtime: runtime.composer,
+      threadIdRef,
+    }),
+  );
+  const messages = useClientLookup(
+    () =>
+      runtimeState.messages.map((m) =>
+        withKey(m.id, MessageClientById({ runtime, id: m.id, threadIdRef })),
+      ),
+    [runtimeState.messages, runtime, threadIdRef],
+  );
 
+  const state = useMemo<ThreadState>(() => {
     return {
-      getState: () => state,
-      composer: () => composer.methods,
-      append: runtime.append,
-      startRun: runtime.startRun,
-      resumeRun: runtime.resumeRun,
-      cancelRun: runtime.cancelRun,
-      getModelContext: runtime.getModelContext,
-      export: runtime.export,
-      import: runtime.import,
-      reset: runtime.reset,
-      stopSpeaking: runtime.stopSpeaking,
-      connectVoice: runtime.connectVoice,
-      disconnectVoice: runtime.disconnectVoice,
-      getVoiceVolume: runtime.getVoiceVolume,
-      subscribeVoiceVolume: runtime.subscribeVoiceVolume,
-      muteVoice: runtime.muteVoice,
-      unmuteVoice: runtime.unmuteVoice,
-      message: (selector) => {
-        if ("id" in selector) {
-          return messages.get({ key: selector.id });
-        } else {
-          return messages.get(selector);
-        }
-      },
-      __internal_getRuntime: () => runtime,
+      isEmpty: messages.state.length === 0 && !runtimeState.isLoading,
+      isDisabled: runtimeState.isDisabled,
+      isLoading: runtimeState.isLoading,
+      isRunning: runtimeState.isRunning,
+      capabilities: runtimeState.capabilities,
+      state: runtimeState.state,
+      suggestions: runtimeState.suggestions,
+      extras: runtimeState.extras,
+      speech: runtimeState.speech,
+      voice: runtimeState.voice,
+
+      composer: composer.state,
+      messages: messages.state,
     };
-  },
-);
+  }, [runtimeState, messages, composer.state]);
+
+  return {
+    getState: () => state,
+    composer: () => composer.methods,
+    append: runtime.append,
+    startRun: runtime.startRun,
+    resumeRun: runtime.resumeRun,
+    cancelRun: runtime.cancelRun,
+    getModelContext: runtime.getModelContext,
+    export: runtime.export,
+    import: runtime.import,
+    reset: runtime.reset,
+    stopSpeaking: runtime.stopSpeaking,
+    connectVoice: runtime.connectVoice,
+    disconnectVoice: runtime.disconnectVoice,
+    getVoiceVolume: runtime.getVoiceVolume,
+    subscribeVoiceVolume: runtime.subscribeVoiceVolume,
+    muteVoice: runtime.muteVoice,
+    unmuteVoice: runtime.unmuteVoice,
+    message: (selector) => {
+      if ("id" in selector) {
+        return messages.get({ key: selector.id });
+      } else {
+        return messages.get(selector);
+      }
+    },
+    __internal_getRuntime: () => runtime,
+  };
+});

package/src/store/runtime-clients/{tap-subscribable.ts → useSubscribable.ts}

@@ -1,11 +1,11 @@
-import { tapState, tapEffect } from "@assistant-ui/tap";
+import { useState, useEffect } from "react";
 import type { SubscribableWithState } from "../../subscribable/subscribable";
 
-export const tapSubscribable = <T>(
+export const useSubscribable = <T>(
   subscribable: Omit<SubscribableWithState<T, any>, "path">,
 ) => {
-  const [, setState] = tapState(subscribable.getState);
-  tapEffect(() => {
+  const [, setState] = useState(subscribable.getState);
+  useEffect(() => {
     setState(subscribable.getState());
     return subscribable.subscribe(() => {
       setState(subscribable.getState());

package/src/store/scopes/queue-item.ts

@@ -3,6 +3,8 @@ export type QueueItemState = {
   readonly prompt: string;
 };
 
+export const EMPTY_QUEUE_ITEMS: readonly QueueItemState[] = Object.freeze([]);
+
 export type QueueItemMethods = {
   getState(): QueueItemState;
   steer(): void;

package/src/tests/attachment-adapters.test.ts

@@ -0,0 +1,86 @@
+import { describe, expect, it } from "vitest";
+import type { PendingAttachment } from "../types/attachment";
+import {
+  type AttachmentAdapter,
+  SimpleImageAttachmentAdapter,
+  SimpleTextAttachmentAdapter,
+} from "../adapters/attachment";
+
+describe("SimpleTextAttachmentAdapter", () => {
+  const makeFile = (contents: string, name = "notes.md") =>
+    new File([contents], name, { type: "text/markdown" });
+
+  it("adds a file as a pending document attachment", async () => {
+    const pending = (await new SimpleTextAttachmentAdapter().add({
+      file: makeFile("hello"),
+    })) as PendingAttachment;
+
+    expect(pending).toMatchObject({
+      id: "notes.md",
+      type: "document",
+      name: "notes.md",
+      contentType: "text/markdown",
+      status: { type: "requires-action", reason: "composer-send" },
+    });
+  });
+
+  it("sends the file contents as a text part without FileReader", async () => {
+    expect(typeof FileReader).toBe("undefined");
+
+    const adapter = new SimpleTextAttachmentAdapter();
+    const pending = (await adapter.add({
+      file: makeFile("- retry with backoff\n- cap attempts at 3"),
+    })) as PendingAttachment;
+    const complete = await adapter.send(pending);
+
+    expect(complete.status).toEqual({ type: "complete" });
+    expect(complete.content).toEqual([
+      {
+        type: "text",
+        text: "<attachment name=notes.md>\n- retry with backoff\n- cap attempts at 3\n</attachment>",
+      },
+    ]);
+  });
+
+  it("remove resolves without error", async () => {
+    const adapter: AttachmentAdapter = new SimpleTextAttachmentAdapter();
+    const pending = (await adapter.add({
+      file: makeFile("hello"),
+    })) as PendingAttachment;
+    await expect(adapter.remove(pending)).resolves.toBeUndefined();
+  });
+});
+
+describe("SimpleImageAttachmentAdapter", () => {
+  const makeImage = (bytes: number[], name = "pixel.png") =>
+    new File([new Uint8Array(bytes)], name, { type: "image/png" });
+
+  it("adds a file as a pending image attachment", async () => {
+    const pending = (await new SimpleImageAttachmentAdapter().add({
+      file: makeImage([1, 2, 3]),
+    })) as PendingAttachment;
+
+    expect(pending).toMatchObject({
+      id: "pixel.png",
+      type: "image",
+      name: "pixel.png",
+      contentType: "image/png",
+      status: { type: "requires-action", reason: "composer-send" },
+    });
+  });
+
+  it("sends the file as a base64 data URL without FileReader", async () => {
+    expect(typeof FileReader).toBe("undefined");
+
+    const adapter = new SimpleImageAttachmentAdapter();
+    const pending = (await adapter.add({
+      file: makeImage([137, 80, 78, 71]),
+    })) as PendingAttachment;
+    const complete = await adapter.send(pending);
+
+    expect(complete.status).toEqual({ type: "complete" });
+    expect(complete.content).toEqual([
+      { type: "image", image: "data:image/png;base64,iVBORw==" },
+    ]);
+  });
+});