@assistant-ui/react 0.5.97 → 0.5.99

package/src/api/ThreadListItemRuntime.ts

@@ -0,0 +1,67 @@
+import { ThreadListMetadata } from "../runtimes/core/ThreadListRuntimeCore";
+import { Unsubscribe } from "../types";
+import { ThreadListItemRuntimePath } from "./RuntimePathTypes";
+import { SubscribableWithState } from "./subscribable/Subscribable";
+import { ThreadListRuntimeCoreBinding } from "./ThreadListRuntime";
+
+export type ThreadListItemState = ThreadListMetadata;
+
+export type ThreadListItemRuntime = Readonly<{
+  path: ThreadListItemRuntimePath;
+  getState(): ThreadListMetadata;
+
+  rename(newTitle: string): Promise<void>;
+  archive(): Promise<void>;
+  unarchive(): Promise<void>;
+  delete(): Promise<void>;
+
+  subscribe(callback: () => void): Unsubscribe;
+}>;
+
+export type ThreadListItemStateBinding = SubscribableWithState<
+  ThreadListItemState,
+  ThreadListItemRuntimePath
+>;
+
+export class ThreadListItemRuntimeImpl implements ThreadListItemRuntime {
+  public get path() {
+    return this._core.path;
+  }
+
+  constructor(
+    private _core: ThreadListItemStateBinding,
+    private _ThreadListBinding: ThreadListRuntimeCoreBinding,
+  ) {}
+
+  public getState(): ThreadListItemState {
+    return this._core.getState();
+  }
+
+  public rename(newTitle: string): Promise<void> {
+    const state = this._core.getState();
+
+    return this._ThreadListBinding.rename(state.threadId, newTitle);
+  }
+
+  public archive(): Promise<void> {
+    const state = this._core.getState();
+
+    return this._ThreadListBinding.archive(state.threadId);
+  }
+
+  public unarchive(): Promise<void> {
+    const state = this._core.getState();
+
+    return this._ThreadListBinding.unarchive(state.threadId);
+  }
+
+  public delete(): Promise<void> {
+    const state = this._core.getState();
+
+    return this._ThreadListBinding.delete(state.threadId);
+  }
+
+  public subscribe(callback: () => void): Unsubscribe {
+    return this._core.subscribe(callback);
+  }
+}

package/src/api/ThreadListRuntime.ts

@@ -0,0 +1,159 @@
+import { LazyMemoizeSubject } from "./subscribable/LazyMemoizeSubject";
+import {
+  ThreadListMetadata,
+  ThreadListRuntimeCore,
+} from "../runtimes/core/ThreadListRuntimeCore";
+import { Unsubscribe } from "../types";
+import { ThreadListRuntimePath } from "./RuntimePathTypes";
+import {
+  ThreadListItemRuntime,
+  ThreadListItemRuntimeImpl,
+} from "./ThreadListItemRuntime";
+import { SKIP_UPDATE } from "./subscribable/SKIP_UPDATE";
+
+export type ThreadListState = Readonly<{
+  threads: readonly ThreadListMetadata[];
+  archivedThreads: readonly ThreadListMetadata[];
+}>;
+
+export type ThreadListRuntime = Readonly<{
+  path: ThreadListRuntimePath;
+  getState(): ThreadListState;
+
+  /**
+   * @deprecated Use `getThreadListItemById(idx).rename(newTitle)` instead. This will be removed in 0.6.0.
+   */
+  rename(threadId: string, newTitle: string): Promise<void>;
+  /**
+   * @deprecated Use `getThreadListItemById(idx).archive()` instead. This will be removed in 0.6.0.
+   */
+  archive(threadId: string): Promise<void>;
+  /**
+   * @deprecated Use `getThreadListItemById(idx).unarchive()` instead. This will be removed in 0.6.0.
+   */
+  unarchive(threadId: string): Promise<void>;
+  /**
+   * @deprecated Use `getThreadListItemById(idx).delete()` instead. This will be removed in 0.6.0.
+   */
+  delete(threadId: string): Promise<void>;
+
+  subscribe(callback: () => void): Unsubscribe;
+
+  getThreadListItemById(threadId: string): ThreadListItemRuntime;
+  getThreadListItemByIndex(idx: number): ThreadListItemRuntime;
+  getThreadListArchivedItemByIndex(idx: number): ThreadListItemRuntime;
+}>;
+
+const getThreadListState = (
+  threadList: ThreadListRuntimeCore,
+): ThreadListState => {
+  return {
+    threads: threadList.threads,
+    archivedThreads: threadList.archivedThreads,
+  };
+};
+
+const THREAD_MANAGER_PATH = {
+  ref: "ThreadList",
+};
+
+export type ThreadListRuntimeCoreBinding = ThreadListRuntimeCore;
+
+export class ThreadListRuntimeImpl implements ThreadListRuntime {
+  public get path() {
+    return THREAD_MANAGER_PATH;
+  }
+
+  private _getState;
+  constructor(private _core: ThreadListRuntimeCoreBinding) {
+    const stateBinding = new LazyMemoizeSubject({
+      path: THREAD_MANAGER_PATH,
+      getState: () => getThreadListState(_core),
+      subscribe: (callback) => _core.subscribe(callback),
+    });
+
+    this._getState = stateBinding.getState.bind(stateBinding);
+  }
+
+  public getState(): ThreadListState {
+    return this._getState();
+  }
+
+  public rename(threadId: string, newTitle: string): Promise<void> {
+    return this._core.rename(threadId, newTitle);
+  }
+
+  public archive(threadId: string): Promise<void> {
+    return this._core.archive(threadId);
+  }
+
+  public unarchive(threadId: string): Promise<void> {
+    return this._core.unarchive(threadId);
+  }
+
+  public delete(threadId: string): Promise<void> {
+    return this._core.delete(threadId);
+  }
+
+  public subscribe(callback: () => void): Unsubscribe {
+    return this._core.subscribe(callback);
+  }
+
+  public getThreadListItemByIndex(idx: number) {
+    return new ThreadListItemRuntimeImpl(
+      new LazyMemoizeSubject({
+        path: {
+          ref: this.path.ref + `${this.path.ref}.threadItems[${idx}]`,
+          threadSelector: { type: "index", index: idx },
+        },
+        getState: () => {
+          const threads = this._core.threads;
+          const thread = threads[idx];
+          if (!thread) return SKIP_UPDATE;
+          return thread;
+        },
+        subscribe: (callback) => this._core.subscribe(callback),
+      }),
+      this._core,
+    );
+  }
+
+  public getThreadListArchivedItemByIndex(idx: number) {
+    return new ThreadListItemRuntimeImpl(
+      new LazyMemoizeSubject({
+        path: {
+          ref: this.path.ref + `${this.path.ref}.archivedThreadItems[${idx}]`,
+          threadSelector: { type: "archiveIndex", index: idx },
+        },
+        getState: () => {
+          const threads = this._core.archivedThreads;
+          const thread = threads[idx];
+          if (!thread) return SKIP_UPDATE;
+          return thread;
+        },
+        subscribe: (callback) => this._core.subscribe(callback),
+      }),
+      this._core,
+    );
+  }
+
+  public getThreadListItemById(threadId: string) {
+    return new ThreadListItemRuntimeImpl(
+      new LazyMemoizeSubject({
+        path: {
+          ref:
+            this.path.ref +
+            `${this.path.ref}.threadItems[threadId=${threadId}]`,
+          threadSelector: { type: "threadId", threadId },
+        },
+        getState: () => {
+          const threadItem = this._core.getThreadMetadataById(threadId);
+          if (!threadItem) return SKIP_UPDATE;
+          return threadItem;
+        },
+        subscribe: (callback) => this._core.subscribe(callback),
+      }),
+      this._core,
+    );
+  }
+}

package/src/api/ThreadRuntime.ts

@@ -42,6 +42,7 @@ export type CreateAppendMessage =
       role?: AppendMessage["role"] | undefined;
       content: AppendMessage["content"];
       attachments?: AppendMessage["attachments"] | undefined;
+      startRun?: boolean | undefined;
     };
 
 const toAppendMessage = (
@@ -62,9 +63,9 @@ const toAppendMessage = (
   }
 
   return {
+    ...message,
     parentId: message.parentId ?? messages.at(-1)?.id ?? null,
     role: message.role ?? "user",
-    content: message.content,
     attachments: message.attachments ?? [],
   } as AppendMessage;
 };

package/src/api/index.ts

@@ -14,7 +14,4 @@ export type {
   ComposerState,
 } from "./ComposerRuntime";
 export type { AttachmentRuntime, AttachmentState } from "./AttachmentRuntime";
-export type {
-  ThreadManagerRuntime,
-  ThreadManagerState,
-} from "./ThreadManagerRuntime";
+export type { ThreadListRuntime, ThreadListState } from "./ThreadListRuntime";

package/src/context/providers/AssistantRuntimeProvider.tsx

@@ -32,16 +32,14 @@ const useAssistantToolUIsStore = () => {
   return useMemo(() => makeAssistantToolUIsStore(), []);
 };
 
-const useThreadManagerStore = (runtime: AssistantRuntime) => {
-  const [store] = useState(() =>
-    create(() => runtime.threadManager.getState()),
-  );
+const useThreadListStore = (runtime: AssistantRuntime) => {
+  const [store] = useState(() => create(() => runtime.threadList.getState()));
 
   useEffect(() => {
     const updateState = () =>
-      writableStore(store).setState(runtime.threadManager.getState(), true);
+      writableStore(store).setState(runtime.threadList.getState(), true);
     updateState();
-    return runtime.threadManager.subscribe(updateState);
+    return runtime.threadList.subscribe(updateState);
   }, [runtime, store]);
 
   return store;
@@ -52,15 +50,15 @@ export const AssistantRuntimeProviderImpl: FC<
 > = ({ children, runtime }) => {
   const useAssistantRuntime = useAssistantRuntimeStore(runtime);
   const useToolUIs = useAssistantToolUIsStore();
-  const useThreadManager = useThreadManagerStore(runtime);
+  const useThreadList = useThreadListStore(runtime);
   const context = useMemo(() => {
     return {
       useToolUIs,
       useAssistantRuntime,
       useAssistantActions: useAssistantRuntime,
-      useThreadManager,
+      useThreadList,
     };
-  }, [useAssistantRuntime, useToolUIs, useThreadManager]);
+  }, [useAssistantRuntime, useToolUIs, useThreadList]);
 
   return (
     <AssistantContext.Provider value={context}>

package/src/context/providers/AttachmentRuntimeProvider.tsx

@@ -12,9 +12,11 @@ import { AttachmentContext } from "../react/AttachmentContext";
 import { writableStore } from "../ReadonlyStore";
 import { AttachmentRuntime } from "../../api/AttachmentRuntime";
 
-type AttachmentRuntimeProviderProps = PropsWithChildren<{
-  runtime: AttachmentRuntime;
-}>;
+export namespace AttachmentRuntimeProvider {
+  export type Props = PropsWithChildren<{
+    runtime: AttachmentRuntime;
+  }>;
+}
 
 const useAttachmentRuntimeStore = (runtime: AttachmentRuntime) => {
   const [store] = useState(() => create(() => runtime));
@@ -37,7 +39,7 @@ const useAttachmentStore = (runtime: AttachmentRuntime) => {
   return store;
 };
 
-export const AttachmentRuntimeProvider: FC<AttachmentRuntimeProviderProps> = ({
+export const AttachmentRuntimeProvider: FC<AttachmentRuntimeProvider.Props> = ({
   runtime,
   children,
 }) => {

package/src/context/providers/ContentPartRuntimeProvider.tsx

@@ -7,9 +7,11 @@ import type { ContentPartContextValue } from "../react/ContentPartContext";
 import { writableStore } from "../ReadonlyStore";
 import { ContentPartRuntime } from "../../api/ContentPartRuntime";
 
-type ContentPartProviderProps = PropsWithChildren<{
-  runtime: ContentPartRuntime;
-}>;
+export namespace ContentPartRuntimeProvider {
+  export type Props = PropsWithChildren<{
+    runtime: ContentPartRuntime;
+  }>;
+}
 
 const useContentPartRuntimeStore = (runtime: ContentPartRuntime) => {
   const [store] = useState(() => create(() => runtime));
@@ -33,10 +35,9 @@ export const useContentPartStore = (runtime: ContentPartRuntime) => {
   return store;
 };
 
-export const ContentPartRuntimeProvider: FC<ContentPartProviderProps> = ({
-  runtime,
-  children,
-}) => {
+export const ContentPartRuntimeProvider: FC<
+  ContentPartRuntimeProvider.Props
+> = ({ runtime, children }) => {
   const useContentPartRuntime = useContentPartRuntimeStore(runtime);
   const useContentPart = useContentPartStore(runtime);
   const [context] = useState<ContentPartContextValue>(() => {

package/src/context/providers/MessageRuntimeProvider.tsx

@@ -8,9 +8,11 @@ import { makeMessageUtilsStore } from "../stores/MessageUtils";
 import { ReadonlyStore, writableStore } from "../ReadonlyStore";
 import { MessageRuntime } from "../../api/MessageRuntime";
 
-type MessageProviderProps = PropsWithChildren<{
-  runtime: MessageRuntime;
-}>;
+export namespace MessageRuntimeProvider {
+  export type Props = PropsWithChildren<{
+    runtime: MessageRuntime;
+  }>;
+}
 
 const useMessageRuntimeStore = (runtime: MessageRuntime) => {
   const [store] = useState(() => create(() => runtime));
@@ -54,7 +56,7 @@ const useEditComposerStore = (
   return store;
 };
 
-export const MessageRuntimeProvider: FC<MessageProviderProps> = ({
+export const MessageRuntimeProvider: FC<MessageRuntimeProvider.Props> = ({
   runtime,
   children,
 }) => {

package/src/context/providers/TextContentPartProvider.tsx

@@ -14,10 +14,12 @@ import {
   ContentPartState,
 } from "../../api/ContentPartRuntime";
 
-type TextContentPartProviderProps = {
-  text: string;
-  isRunning?: boolean | undefined;
-};
+export namespace TextContentPartProvider {
+  export type Props = PropsWithChildren<{
+    text: string;
+    isRunning?: boolean | undefined;
+  }>;
+}
 
 const COMPLETE_STATUS: ContentPartStatus = {
   type: "complete",
@@ -27,9 +29,11 @@ const RUNNING_STATUS: ContentPartStatus = {
   type: "running",
 };
 
-export const TextContentPartProvider: FC<
-  PropsWithChildren<TextContentPartProviderProps>
-> = ({ children, text, isRunning }) => {
+export const TextContentPartProvider: FC<TextContentPartProvider.Props> = ({
+  children,
+  text,
+  isRunning,
+}) => {
   const [context] = useState<ContentPartContextValue>(() => {
     const useContentPartRuntime = create(
       // TODO

package/src/context/providers/ThreadListItemRuntimeProvider.tsx

@@ -0,0 +1,54 @@
+"use client";
+
+import { type FC, type PropsWithChildren, useEffect, useState } from "react";
+import { create } from "zustand";
+import {
+  ThreadListItemContext,
+  type ThreadListItemContextValue,
+} from "../react/ThreadListItemContext";
+import { writableStore } from "../ReadonlyStore";
+import { ThreadListItemRuntime } from "../../api/ThreadListItemRuntime";
+
+export namespace ThreadListItemRuntimeProvider {
+  export type Props = PropsWithChildren<{
+    runtime: ThreadListItemRuntime;
+  }>;
+}
+
+const useThreadListItemRuntimeStore = (runtime: ThreadListItemRuntime) => {
+  const [store] = useState(() => create(() => runtime));
+
+  useEffect(() => {
+    writableStore(store).setState(runtime, true);
+  }, [runtime, store]);
+
+  return store;
+};
+
+export const useThreadListItemStore = (runtime: ThreadListItemRuntime) => {
+  const [store] = useState(() => create(() => runtime.getState()));
+  useEffect(() => {
+    const updateState = () =>
+      writableStore(store).setState(runtime.getState(), true);
+    updateState();
+    return runtime.subscribe(updateState);
+  }, [runtime, store]);
+
+  return store;
+};
+
+export const ThreadListItemRuntimeProvider: FC<
+  ThreadListItemRuntimeProvider.Props
+> = ({ runtime, children }) => {
+  const useThreadListItemRuntime = useThreadListItemRuntimeStore(runtime);
+  const useThreadListItem = useThreadListItemStore(runtime);
+  const [context] = useState<ThreadListItemContextValue>(() => {
+    return { useThreadListItemRuntime, useThreadListItem };
+  });
+
+  return (
+    <ThreadListItemContext.Provider value={context}>
+      {children}
+    </ThreadListItemContext.Provider>
+  );
+};

package/src/context/react/AssistantContext.ts

@@ -7,12 +7,12 @@ import { createContextHook } from "./utils/createContextHook";
 import { createContextStoreHook } from "./utils/createContextStoreHook";
 import { UseBoundStore } from "zustand";
 import { AssistantRuntime } from "../../api/AssistantRuntime";
-import { ThreadManagerState } from "../../api/ThreadManagerRuntime";
+import { ThreadListState } from "../../api/ThreadListRuntime";
 
 export type AssistantContextValue = {
   useToolUIs: UseBoundStore<ReadonlyStore<AssistantToolUIsState>>;
   useAssistantRuntime: UseBoundStore<ReadonlyStore<AssistantRuntime>>;
-  useThreadManager: UseBoundStore<ReadonlyStore<ThreadManagerState>>;
+  useThreadList: UseBoundStore<ReadonlyStore<ThreadListState>>;
 
   /**
    * @deprecated Use `useAssistantRuntime` instead. This will be removed in 0.6.0.
@@ -68,7 +68,7 @@ export const { useToolUIs, useToolUIsStore } = createContextStoreHook(
   "useToolUIs",
 );
 
-export const { useThreadManager } = createContextStoreHook(
+export const { useThreadList } = createContextStoreHook(
   useAssistantContext,
-  "useThreadManager",
+  "useThreadList",
 );

package/src/context/react/ThreadListItemContext.ts

@@ -0,0 +1,39 @@
+"use client";
+
+import { createContext } from "react";
+import { ReadonlyStore } from "../ReadonlyStore";
+import { createContextStoreHook } from "./utils/createContextStoreHook";
+import { createContextHook } from "./utils/createContextHook";
+import { UseBoundStore } from "zustand";
+import { ThreadListItemRuntime } from "../../api/ThreadListItemRuntime";
+import { ThreadListItemState } from "../../api/ThreadListItemRuntime";
+
+export type ThreadListItemContextValue = {
+  useThreadListItemRuntime: UseBoundStore<ReadonlyStore<ThreadListItemRuntime>>;
+  useThreadListItem: UseBoundStore<ReadonlyStore<ThreadListItemState>>;
+};
+
+export const ThreadListItemContext =
+  createContext<ThreadListItemContextValue | null>(null);
+
+export const useThreadListItemContext = createContextHook(
+  ThreadListItemContext,
+  "a component passed to <ThreadListPrimitive.Items components={...}>",
+);
+
+export function useThreadListItemRuntime(options?: {
+  optional?: false | undefined;
+}): ThreadListItemRuntime;
+export function useThreadListItemRuntime(options?: {
+  optional?: boolean | undefined;
+}): ThreadListItemRuntime | null;
+export function useThreadListItemRuntime(options?: {
+  optional?: boolean | undefined;
+}) {
+  const context = useThreadListItemContext(options);
+  if (!context) return null;
+  return context.useThreadListItemRuntime();
+}
+
+export const { useThreadListItem, useThreadListItemStore } =
+  createContextStoreHook(useThreadListItemContext, "useThreadListItem");

package/src/context/react/index.ts

@@ -1,6 +1,6 @@
 export {
   useAssistantRuntime,
-  useThreadManager,
+  useThreadList,
   useToolUIs,
   useToolUIsStore,
 
@@ -150,7 +150,7 @@ export {
   useAttachment,
   useAttachmentRuntime,
 
-  // TODO decide if we want to export/drop these? 
+  // TODO decide if we want to export/drop these?
   // useEditComposerAttachment,
   // useEditComposerAttachmentRuntime,
   // useMessageAttachment,

package/src/internal.ts

@@ -1,5 +1,5 @@
 export type { ThreadRuntimeCore } from "./runtimes/core/ThreadRuntimeCore";
-export type { ThreadManagerRuntimeCore } from "./runtimes/core/ThreadManagerRuntimeCore";
+export type { ThreadListRuntimeCore } from "./runtimes/core/ThreadListRuntimeCore";
 export { DefaultThreadComposerRuntimeCore } from "./runtimes/composer/DefaultThreadComposerRuntimeCore";
 export { ProxyConfigProvider } from "./utils/ProxyConfigProvider";
 export { MessageRepository } from "./runtimes/utils/MessageRepository";

package/src/primitives/index.ts

@@ -6,6 +6,8 @@ export * as ComposerPrimitive from "./composer";
 export * as ContentPartPrimitive from "./contentPart";
 export * as MessagePrimitive from "./message";
 export * as ThreadPrimitive from "./thread";
+export * as ThreadListPrimitive from "./threadList";
+export * as ThreadListItemPrimitive from "./threadListItem";
 
 export type * from "./actionBar/types";
 export type * from "./assistantModal/types";

package/src/primitives/threadList/ThreadListItems.tsx

@@ -0,0 +1,73 @@
+"use client";
+
+import { ComponentType, FC, memo, useMemo } from "react";
+import { ThreadListItemRuntimeProvider } from "../../context/providers/ThreadListItemRuntimeProvider";
+import { useAssistantRuntime, useThreadList } from "../../context";
+
+export namespace MessagePrimitiveContent {
+  export type Props = {
+    archived?: boolean | undefined;
+    components: {
+      ThreadListItem: ComponentType;
+    };
+  };
+}
+
+type ThreadListItemProps = {
+  partIndex: number;
+  archived: boolean;
+  components: MessagePrimitiveContent.Props["components"];
+};
+
+const ThreadListItemImpl: FC<ThreadListItemProps> = ({
+  partIndex,
+  archived,
+  components,
+}) => {
+  const assistantRuntime = useAssistantRuntime();
+  const runtime = useMemo(
+    () =>
+      archived
+        ? assistantRuntime.threadList.getThreadListArchivedItemByIndex(
+            partIndex,
+          )
+        : assistantRuntime.threadList.getThreadListItemByIndex(partIndex),
+    [assistantRuntime, partIndex],
+  );
+
+  const ThreadListItemComponent = components.ThreadListItem;
+
+  return (
+    <ThreadListItemRuntimeProvider runtime={runtime}>
+      <ThreadListItemComponent />
+    </ThreadListItemRuntimeProvider>
+  );
+};
+
+const ThreadListItem = memo(
+  ThreadListItemImpl,
+  (prev, next) =>
+    prev.partIndex === next.partIndex &&
+    prev.archived === next.archived &&
+    prev.components.ThreadListItem === next.components.ThreadListItem,
+);
+
+export const ThreadListPrimitiveItems: FC<MessagePrimitiveContent.Props> = ({
+  archived = false,
+  components,
+}) => {
+  const contentLength = useThreadList((s) =>
+    archived ? s.archivedThreads.length : s.threads.length,
+  );
+
+  return Array.from({ length: contentLength }, (_, index) => (
+    <ThreadListItem
+      key={index}
+      partIndex={index}
+      archived={archived}
+      components={components}
+    />
+  ));
+};
+
+ThreadListPrimitiveItems.displayName = "ThreadListPrimitive.Items";

package/src/primitives/threadList/ThreadListNew.ts

@@ -0,0 +1,25 @@
+"use client";
+
+import {
+  ActionButtonElement,
+  ActionButtonProps,
+  createActionButton,
+} from "../../utils/createActionButton";
+import { useAssistantRuntime } from "../../context";
+
+const useThreadListNew = () => {
+  const runtime = useAssistantRuntime();
+  return () => {
+    runtime.switchToNewThread();
+  };
+};
+
+export namespace ThreadListPrimitiveNew {
+  export type Element = ActionButtonElement;
+  export type Props = ActionButtonProps<typeof useThreadListNew>;
+}
+
+export const ThreadListPrimitiveNew = createActionButton(
+  "ThreadListPrimitive.New",
+  useThreadListNew,
+);

package/src/primitives/threadList/index.ts

@@ -0,0 +1,2 @@
+export { ThreadListPrimitiveNew as New } from "./ThreadListNew";
+export { ThreadListPrimitiveItems as Items } from "./ThreadListItems";