@assistant-ui/react 0.7.45 → 0.7.47

package/src/runtimes/composer/BaseComposerRuntimeCore.tsx

@@ -158,9 +158,31 @@ export abstract class BaseComposerRuntimeCore
     const adapter = this.getAttachmentAdapter();
     if (!adapter) throw new Error("Attachments are not supported");
 
-    const attachment = await adapter.add({ file });
+    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._attachments = [...this._attachments, attachment as PendingAttachment];
     this._notifyEventSubscribers("attachment_add");
     this._notifySubscribers();
   }

package/src/runtimes/local/useLocalRuntime.tsx

@@ -19,6 +19,11 @@ class LocalRuntimeImpl extends AssistantRuntimeImpl implements LocalRuntime {
     super(core, ThreadRuntimeImpl);
   }
 
+  public override __internal_bindMethods() {
+    super.__internal_bindMethods();
+    this.reset = this.reset.bind(this);
+  }
+
   public reset(options?: Parameters<LocalRuntimeCore["reset"]>[0]) {
     this.core.reset(options);
   }

package/src/ui/thread-config.tsx

@@ -193,6 +193,7 @@ export type ThreadConfig = {
         EditComposer?: ComponentType | undefined;
         Composer?: ComponentType | undefined;
         ThreadWelcome?: ComponentType | undefined;
+        MessagesFooter?: ComponentType | undefined;
       }
     | undefined;
 };

package/src/ui/thread.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { forwardRef, type FC } from "react";
+import { ComponentType, forwardRef, type FC } from "react";
 import { ArrowDownIcon } from "lucide-react";
 
 import { withDefaults } from "./utils/withDefaults";
@@ -24,6 +24,7 @@ const Thread: FC<ThreadConfig> = (config) => {
     components: {
       Composer: ComposerComponent = Composer,
       ThreadWelcome: ThreadWelcomeComponent = ThreadWelcome,
+      MessagesFooter,
       ...messageComponents
     } = {},
   } = config;
@@ -31,7 +32,10 @@ const Thread: FC<ThreadConfig> = (config) => {
     <ThreadRoot config={config}>
       <ThreadViewport>
         <ThreadWelcomeComponent />
-        <ThreadMessages components={messageComponents} />
+        <ThreadMessages
+          MessagesFooter={MessagesFooter}
+          components={messageComponents}
+        />
         <ThreadFollowupSuggestions />
         <ThreadViewportFooter>
           <ThreadScrollToBottom />
@@ -78,7 +82,13 @@ ThreadViewportFooter.displayName = "ThreadViewportFooter";
 const ThreadMessages: FC<{
   unstable_flexGrowDiv?: boolean;
   components?: Partial<ThreadPrimitive.Messages.Props["components"]>;
-}> = ({ components, unstable_flexGrowDiv: flexGrowDiv = true, ...rest }) => {
+  MessagesFooter?: ComponentType | undefined;
+}> = ({
+  components,
+  MessagesFooter,
+  unstable_flexGrowDiv: flexGrowDiv = true,
+  ...rest
+}) => {
   return (
     <>
       <ThreadPrimitive.Messages
@@ -90,6 +100,7 @@ const ThreadMessages: FC<{
         }}
         {...rest}
       />
+      {MessagesFooter && <MessagesFooter />}
       {flexGrowDiv && (
         <ThreadPrimitive.If empty={false}>
           <div style={{ flexGrow: 1 }} />