@assistant-ui/react 0.11.0 → 0.11.1

package/src/legacy-runtime/runtime-cores/composer/BaseComposerRuntimeCore.tsx

@@ -0,0 +1,239 @@
+import {
+  Attachment,
+  CompleteAttachment,
+  PendingAttachment,
+} from "../../../types/AttachmentTypes";
+import { AppendMessage } from "../../../types";
+import { AttachmentAdapter } from "../adapters/attachment";
+import {
+  ComposerRuntimeCore,
+  ComposerRuntimeEventType,
+} from "../core/ComposerRuntimeCore";
+import { MessageRole, RunConfig } from "../../../types/AssistantTypes";
+import { BaseSubscribable } from "../remote-thread-list/BaseSubscribable";
+
+const isAttachmentComplete = (a: Attachment): a is CompleteAttachment =>
+  a.status.type === "complete";
+
+export abstract class BaseComposerRuntimeCore
+  extends BaseSubscribable
+  implements ComposerRuntimeCore
+{
+  public readonly isEditing = true;
+
+  protected abstract getAttachmentAdapter(): AttachmentAdapter | undefined;
+
+  public get attachmentAccept(): string {
+    return this.getAttachmentAdapter()?.accept ?? "*";
+  }
+
+  private _attachments: readonly Attachment[] = [];
+  public get attachments() {
+    return this._attachments;
+  }
+
+  protected setAttachments(value: readonly Attachment[]) {
+    this._attachments = value;
+    this._notifySubscribers();
+  }
+
+  public abstract get canCancel(): boolean;
+
+  public get isEmpty() {
+    return !this.text.trim() && !this.attachments.length;
+  }
+
+  private _text = "";
+
+  get text() {
+    return this._text;
+  }
+
+  private _role: MessageRole = "user";
+
+  get role() {
+    return this._role;
+  }
+
+  private _runConfig: RunConfig = {};
+
+  get runConfig() {
+    return this._runConfig;
+  }
+
+  public setText(value: string) {
+    if (this._text === value) return;
+
+    this._text = value;
+    this._notifySubscribers();
+  }
+
+  public setRole(role: MessageRole) {
+    if (this._role === role) return;
+
+    this._role = role;
+    this._notifySubscribers();
+  }
+
+  public setRunConfig(runConfig: RunConfig) {
+    if (this._runConfig === runConfig) return;
+
+    this._runConfig = runConfig;
+    this._notifySubscribers();
+  }
+
+  private _emptyTextAndAttachments() {
+    this._attachments = [];
+    this._text = "";
+    this._notifySubscribers();
+  }
+
+  private async _onClearAttachments() {
+    const adapter = this.getAttachmentAdapter();
+    if (adapter) {
+      await Promise.all(this._attachments.map((a) => adapter.remove(a)));
+    }
+  }
+
+  public async reset() {
+    if (
+      this._attachments.length === 0 &&
+      this._text === "" &&
+      this._role === "user" &&
+      Object.keys(this._runConfig).length === 0
+    ) {
+      return;
+    }
+
+    this._role = "user";
+    this._runConfig = {};
+
+    const task = this._onClearAttachments();
+    this._emptyTextAndAttachments();
+    await task;
+  }
+
+  public async clearAttachments() {
+    const task = this._onClearAttachments();
+    this.setAttachments([]);
+
+    await task;
+  }
+
+  public async send() {
+    const adapter = this.getAttachmentAdapter();
+    const attachments =
+      adapter && this.attachments.length > 0
+        ? Promise.all(
+            this.attachments.map(async (a) => {
+              if (isAttachmentComplete(a)) return a;
+              const result = await adapter.send(a);
+              return result as CompleteAttachment;
+            }),
+          )
+        : [];
+
+    const text = this.text;
+    this._emptyTextAndAttachments();
+    const message: Omit<AppendMessage, "parentId" | "sourceId"> = {
+      createdAt: new Date(),
+      role: this.role,
+      content: text ? [{ type: "text", text }] : [],
+      attachments: await attachments,
+      runConfig: this.runConfig,
+      metadata: { custom: {} },
+    };
+
+    this.handleSend(message);
+    this._notifyEventSubscribers("send");
+  }
+
+  public cancel() {
+    this.handleCancel();
+  }
+
+  protected abstract handleSend(
+    message: Omit<AppendMessage, "parentId" | "sourceId">,
+  ): void;
+  protected abstract handleCancel(): void;
+
+  async addAttachment(file: File) {
+    const adapter = this.getAttachmentAdapter();
+    if (!adapter) throw new Error("Attachments are not supported");
+
+    const upsertAttachment = (a: PendingAttachment) => {
+      const idx = this._attachments.findIndex(
+        (attachment) => attachment.id === a.id,
+      );
+      if (idx !== -1)
+        this._attachments = [
+          ...this._attachments.slice(0, idx),
+          a,
+          ...this._attachments.slice(idx + 1),
+        ];
+      else {
+        this._attachments = [...this._attachments, a];
+        this._notifyEventSubscribers("attachment-add");
+      }
+
+      this._notifySubscribers();
+    };
+
+    const promiseOrGenerator = adapter.add({ file });
+    if (Symbol.asyncIterator in promiseOrGenerator) {
+      for await (const r of promiseOrGenerator) {
+        upsertAttachment(r);
+      }
+    } else {
+      upsertAttachment(await promiseOrGenerator);
+    }
+
+    this._notifyEventSubscribers("attachment-add");
+    this._notifySubscribers();
+  }
+
+  async removeAttachment(attachmentId: string) {
+    const adapter = this.getAttachmentAdapter();
+    if (!adapter) throw new Error("Attachments are not supported");
+
+    const index = this._attachments.findIndex((a) => a.id === attachmentId);
+    if (index === -1) throw new Error("Attachment not found");
+    const attachment = this._attachments[index]!;
+
+    await adapter.remove(attachment);
+
+    // this._attachments.toSpliced(index, 1); - not yet widely supported
+    this._attachments = [
+      ...this._attachments.slice(0, index),
+      ...this._attachments.slice(index + 1),
+    ];
+    this._notifySubscribers();
+  }
+
+  private _eventSubscribers = new Map<
+    ComposerRuntimeEventType,
+    Set<() => void>
+  >();
+
+  protected _notifyEventSubscribers(event: ComposerRuntimeEventType) {
+    const subscribers = this._eventSubscribers.get(event);
+    if (!subscribers) return;
+
+    for (const callback of subscribers) callback();
+  }
+
+  public unstable_on(event: ComposerRuntimeEventType, callback: () => void) {
+    const subscribers = this._eventSubscribers.get(event);
+    if (!subscribers) {
+      this._eventSubscribers.set(event, new Set([callback]));
+    } else {
+      subscribers.add(callback);
+    }
+
+    return () => {
+      const subscribers = this._eventSubscribers.get(event);
+      if (!subscribers) return;
+      subscribers.delete(callback);
+    };
+  }
+}

package/src/legacy-runtime/runtime-cores/composer/DefaultEditComposerRuntimeCore.tsx

@@ -0,0 +1,62 @@
+import { AppendMessage, ThreadMessage } from "../../../types";
+import { getThreadMessageText } from "../../../utils/getThreadMessageText";
+import { AttachmentAdapter } from "../adapters/attachment";
+import { ThreadRuntimeCore } from "../core/ThreadRuntimeCore";
+import { BaseComposerRuntimeCore } from "./BaseComposerRuntimeCore";
+
+export class DefaultEditComposerRuntimeCore extends BaseComposerRuntimeCore {
+  public get canCancel() {
+    return true;
+  }
+
+  protected getAttachmentAdapter() {
+    return this.runtime.adapters?.attachments;
+  }
+
+  private _nonTextParts;
+  private _previousText;
+  private _parentId;
+  private _sourceId;
+  constructor(
+    private runtime: ThreadRuntimeCore & {
+      adapters?: { attachments?: AttachmentAdapter | undefined } | undefined;
+    },
+    private endEditCallback: () => void,
+    { parentId, message }: { parentId: string | null; message: ThreadMessage },
+  ) {
+    super();
+    this._parentId = parentId;
+    this._sourceId = message.id;
+    this._previousText = getThreadMessageText(message);
+    this.setText(this._previousText);
+
+    this.setRole(message.role);
+    this.setAttachments(message.attachments ?? []);
+
+    this._nonTextParts = message.content.filter((part) => part.type !== "text");
+
+    // Use the runConfig from the regular (non-edit) composer as the initial runConfig for the edit composer
+    this.setRunConfig({ ...runtime.composer.runConfig });
+  }
+
+  public async handleSend(
+    message: Omit<AppendMessage, "parentId" | "sourceId">,
+  ) {
+    const text = getThreadMessageText(message as AppendMessage);
+    if (text !== this._previousText) {
+      this.runtime.append({
+        ...message,
+        content: [...message.content, ...this._nonTextParts] as any,
+        parentId: this._parentId,
+        sourceId: this._sourceId,
+      });
+    }
+
+    this.handleCancel();
+  }
+
+  public handleCancel() {
+    this.endEditCallback();
+    this._notifySubscribers();
+  }
+}

package/src/legacy-runtime/runtime-cores/composer/DefaultThreadComposerRuntimeCore.tsx

@@ -0,0 +1,55 @@
+import { AppendMessage, PendingAttachment } from "../../../types";
+import { AttachmentAdapter } from "../adapters/attachment";
+import { ThreadComposerRuntimeCore } from "../core/ComposerRuntimeCore";
+import { ThreadRuntimeCore } from "../core/ThreadRuntimeCore";
+import { BaseComposerRuntimeCore } from "./BaseComposerRuntimeCore";
+
+export class DefaultThreadComposerRuntimeCore
+  extends BaseComposerRuntimeCore
+  implements ThreadComposerRuntimeCore
+{
+  private _canCancel = false;
+  public get canCancel() {
+    return this._canCancel;
+  }
+
+  public override get attachments(): readonly PendingAttachment[] {
+    return super.attachments as readonly PendingAttachment[];
+  }
+
+  protected getAttachmentAdapter() {
+    return this.runtime.adapters?.attachments;
+  }
+
+  constructor(
+    private runtime: Omit<ThreadRuntimeCore, "composer"> & {
+      adapters?: { attachments?: AttachmentAdapter | undefined } | undefined;
+    },
+  ) {
+    super();
+    this.connect();
+  }
+
+  public connect() {
+    return this.runtime.subscribe(() => {
+      if (this.canCancel !== this.runtime.capabilities.cancel) {
+        this._canCancel = this.runtime.capabilities.cancel;
+        this._notifySubscribers();
+      }
+    });
+  }
+
+  public async handleSend(
+    message: Omit<AppendMessage, "parentId" | "sourceId">,
+  ) {
+    this.runtime.append({
+      ...(message as AppendMessage),
+      parentId: this.runtime.messages.at(-1)?.id ?? null,
+      sourceId: null,
+    });
+  }
+
+  public async handleCancel() {
+    this.runtime.cancelRun();
+  }
+}

package/src/legacy-runtime/runtime-cores/core/AssistantRuntimeCore.tsx

@@ -0,0 +1,18 @@
+import { ComponentType } from "react";
+import type { ModelContextProvider } from "../../../model-context/ModelContextTypes";
+import type { Unsubscribe } from "../../../types/Unsubscribe";
+import { ThreadListRuntimeCore } from "./ThreadListRuntimeCore";
+
+export type AssistantRuntimeCore = {
+  readonly threads: ThreadListRuntimeCore;
+
+  registerModelContextProvider: (provider: ModelContextProvider) => Unsubscribe;
+
+  /**
+   * EXPERIMENTAL: A component that is rendered inside the AssistantRuntimeProvider.
+   *
+   * Note: This field is expected to never change.
+   * To update the component, use a zustand store.
+   */
+  readonly RenderComponent?: ComponentType | undefined;
+};

package/src/legacy-runtime/runtime-cores/core/BaseAssistantRuntimeCore.tsx

@@ -0,0 +1,16 @@
+import { type ModelContextProvider } from "../../../model-context/ModelContextTypes";
+import type { Unsubscribe } from "../../../types/Unsubscribe";
+import type { AssistantRuntimeCore } from "./AssistantRuntimeCore";
+import { CompositeContextProvider } from "../../../utils/CompositeContextProvider";
+import { ThreadListRuntimeCore } from "./ThreadListRuntimeCore";
+
+export abstract class BaseAssistantRuntimeCore implements AssistantRuntimeCore {
+  protected readonly _contextProvider = new CompositeContextProvider();
+  public abstract get threads(): ThreadListRuntimeCore;
+
+  public registerModelContextProvider(
+    provider: ModelContextProvider,
+  ): Unsubscribe {
+    return this._contextProvider.registerModelContextProvider(provider);
+  }
+}

package/src/legacy-runtime/runtime-cores/core/BaseThreadRuntimeCore.tsx

@@ -0,0 +1,228 @@
+import type { AppendMessage, Unsubscribe } from "../../../types";
+import {
+  ExportedMessageRepository,
+  MessageRepository,
+} from "../utils/MessageRepository";
+import { DefaultThreadComposerRuntimeCore } from "../composer/DefaultThreadComposerRuntimeCore";
+import {
+  AddToolResultOptions,
+  ThreadSuggestion,
+  SubmitFeedbackOptions,
+  ThreadRuntimeCore,
+  SpeechState,
+  RuntimeCapabilities,
+  SubmittedFeedback,
+  ThreadRuntimeEventType,
+  StartRunConfig,
+  ResumeRunConfig,
+} from "./ThreadRuntimeCore";
+import { DefaultEditComposerRuntimeCore } from "../composer/DefaultEditComposerRuntimeCore";
+import { SpeechSynthesisAdapter } from "../adapters/speech/SpeechAdapterTypes";
+import { FeedbackAdapter } from "../adapters/feedback/FeedbackAdapter";
+import { AttachmentAdapter } from "../adapters/attachment";
+import { getThreadMessageText } from "../../../utils/getThreadMessageText";
+import { ModelContextProvider } from "../../../model-context";
+import { ThreadMessageLike } from "../external-store";
+
+type BaseThreadAdapters = {
+  speech?: SpeechSynthesisAdapter | undefined;
+  feedback?: FeedbackAdapter | undefined;
+  attachments?: AttachmentAdapter | undefined;
+};
+
+export abstract class BaseThreadRuntimeCore implements ThreadRuntimeCore {
+  private _subscriptions = new Set<() => void>();
+  private _isInitialized = false;
+
+  protected readonly repository = new MessageRepository();
+  public abstract get adapters(): BaseThreadAdapters | undefined;
+  public abstract get isDisabled(): boolean;
+  public abstract get isLoading(): boolean;
+  public abstract get suggestions(): readonly ThreadSuggestion[];
+  public abstract get extras(): unknown;
+
+  public abstract get capabilities(): RuntimeCapabilities;
+  public abstract append(message: AppendMessage): void;
+  public abstract startRun(config: StartRunConfig): void;
+  public abstract resumeRun(config: ResumeRunConfig): void;
+  public abstract addToolResult(options: AddToolResultOptions): void;
+  public abstract cancelRun(): void;
+
+  public get messages() {
+    return this.repository.getMessages();
+  }
+
+  public get state() {
+    let mostRecentAssistantMessage;
+    for (const message of this.messages) {
+      if (message.role === "assistant") {
+        mostRecentAssistantMessage = message;
+        break;
+      }
+    }
+
+    return mostRecentAssistantMessage?.metadata.unstable_state ?? null;
+  }
+
+  public readonly composer = new DefaultThreadComposerRuntimeCore(this);
+
+  constructor(private readonly _contextProvider: ModelContextProvider) {}
+
+  public getModelContext() {
+    return this._contextProvider.getModelContext();
+  }
+
+  private _editComposers = new Map<string, DefaultEditComposerRuntimeCore>();
+  public getEditComposer(messageId: string) {
+    return this._editComposers.get(messageId);
+  }
+  public beginEdit(messageId: string) {
+    if (this._editComposers.has(messageId))
+      throw new Error("Edit already in progress");
+
+    this._editComposers.set(
+      messageId,
+      new DefaultEditComposerRuntimeCore(
+        this,
+        () => this._editComposers.delete(messageId),
+        this.repository.getMessage(messageId),
+      ),
+    );
+    this._notifySubscribers();
+  }
+
+  public getMessageById(messageId: string) {
+    try {
+      return this.repository.getMessage(messageId);
+    } catch {
+      return undefined;
+    }
+  }
+
+  public getBranches(messageId: string): string[] {
+    return this.repository.getBranches(messageId);
+  }
+
+  public switchToBranch(branchId: string): void {
+    this.repository.switchToBranch(branchId);
+    this._notifySubscribers();
+  }
+
+  protected _notifySubscribers() {
+    for (const callback of this._subscriptions) callback();
+  }
+
+  public _notifyEventSubscribers(event: ThreadRuntimeEventType) {
+    const subscribers = this._eventSubscribers.get(event);
+    if (!subscribers) return;
+
+    for (const callback of subscribers) callback();
+  }
+
+  public subscribe(callback: () => void): Unsubscribe {
+    this._subscriptions.add(callback);
+    return () => this._subscriptions.delete(callback);
+  }
+
+  private _submittedFeedback: Record<string, SubmittedFeedback> = {};
+
+  public getSubmittedFeedback(messageId: string) {
+    return this._submittedFeedback[messageId];
+  }
+
+  public submitFeedback({ messageId, type }: SubmitFeedbackOptions) {
+    const adapter = this.adapters?.feedback;
+    if (!adapter) throw new Error("Feedback adapter not configured");
+
+    const { message } = this.repository.getMessage(messageId);
+    adapter.submit({ message, type });
+
+    this._submittedFeedback[messageId] = { type };
+    this._notifySubscribers();
+  }
+
+  private _stopSpeaking: Unsubscribe | undefined;
+  public speech: SpeechState | undefined;
+
+  public speak(messageId: string) {
+    const adapter = this.adapters?.speech;
+    if (!adapter) throw new Error("Speech adapter not configured");
+
+    const { message } = this.repository.getMessage(messageId);
+
+    this._stopSpeaking?.();
+
+    const utterance = adapter.speak(getThreadMessageText(message));
+    const unsub = utterance.subscribe(() => {
+      if (utterance.status.type === "ended") {
+        this._stopSpeaking = undefined;
+        this.speech = undefined;
+      } else {
+        this.speech = { messageId, status: utterance.status };
+      }
+      this._notifySubscribers();
+    });
+
+    this.speech = { messageId, status: utterance.status };
+    this._notifySubscribers();
+
+    this._stopSpeaking = () => {
+      utterance.cancel();
+      unsub();
+      this.speech = undefined;
+      this._stopSpeaking = undefined;
+    };
+  }
+
+  public stopSpeaking() {
+    if (!this._stopSpeaking) throw new Error("No message is being spoken");
+    this._stopSpeaking();
+    this._notifySubscribers();
+  }
+
+  protected ensureInitialized() {
+    if (!this._isInitialized) {
+      this._isInitialized = true;
+      this._notifyEventSubscribers("initialize");
+    }
+  }
+
+  // TODO import()/export() on external store doesn't make much sense
+  public export() {
+    return this.repository.export();
+  }
+
+  public import(data: ExportedMessageRepository) {
+    this.ensureInitialized();
+    this.repository.clear();
+    this.repository.import(data);
+    this._notifySubscribers();
+  }
+
+  public reset(initialMessages?: readonly ThreadMessageLike[]) {
+    this.import(ExportedMessageRepository.fromArray(initialMessages ?? []));
+  }
+
+  private _eventSubscribers = new Map<
+    ThreadRuntimeEventType,
+    Set<() => void>
+  >();
+
+  public unstable_on(event: ThreadRuntimeEventType, callback: () => void) {
+    if (event === "model-context-update") {
+      return this._contextProvider.subscribe?.(callback) ?? (() => {});
+    }
+
+    const subscribers = this._eventSubscribers.get(event);
+    if (!subscribers) {
+      this._eventSubscribers.set(event, new Set([callback]));
+    } else {
+      subscribers.add(callback);
+    }
+
+    return () => {
+      const subscribers = this._eventSubscribers.get(event)!;
+      subscribers.delete(callback);
+    };
+  }
+}

package/src/legacy-runtime/runtime-cores/core/ComposerRuntimeCore.tsx

@@ -0,0 +1,48 @@
+import type {
+  Attachment,
+  PendingAttachment,
+  Unsubscribe,
+} from "../../../types";
+import { MessageRole, RunConfig } from "../../../types/AssistantTypes";
+
+export type ComposerRuntimeEventType = "send" | "attachment-add";
+
+export type ComposerRuntimeCore = Readonly<{
+  isEditing: boolean;
+
+  canCancel: boolean;
+  isEmpty: boolean;
+
+  attachments: readonly Attachment[];
+  attachmentAccept: string;
+
+  addAttachment: (file: File) => Promise<void>;
+  removeAttachment: (attachmentId: string) => Promise<void>;
+
+  text: string;
+  setText: (value: string) => void;
+
+  role: MessageRole;
+  setRole: (role: MessageRole) => void;
+
+  runConfig: RunConfig;
+  setRunConfig: (runConfig: RunConfig) => void;
+
+  reset: () => Promise<void>;
+  clearAttachments: () => Promise<void>;
+
+  send: () => void;
+  cancel: () => void;
+
+  subscribe: (callback: () => void) => Unsubscribe;
+
+  unstable_on: (
+    event: ComposerRuntimeEventType,
+    callback: () => void,
+  ) => Unsubscribe;
+}>;
+
+export type ThreadComposerRuntimeCore = ComposerRuntimeCore &
+  Readonly<{
+    attachments: readonly PendingAttachment[];
+  }>;