refactor!: drop deprecated features (#1131)

* refactor!: drop deprecated features * fixes * more fixes * changeset
assistant-ui · Nov 2, 2024 · c6e886b · c6e886b
1 parent 2912fda
commit c6e886b
Show file tree

Hide file tree

Showing 123 changed files with 225 additions and 1,449 deletions.
diff --git a/.changeset/small-roses-return.md b/.changeset/small-roses-return.md
@@ -0,0 +1,5 @@
+---
+"@assistant-ui/react": minor
+---
+
+refactor!: drop deprecated features
diff --git a/apps/docs/components/claude/Claude.tsx b/apps/docs/components/claude/Claude.tsx
@@ -51,19 +51,19 @@ export const Claude: FC = () => {
 };
 
 const ChatMessage: FC = () => {
-  const { message } = useMessage();
+  const role = useMessage((m) => m.role);
 
   return (
     <MessagePrimitive.Root className="relative mx-auto mb-4 flex w-full max-w-screen-md flex-col gap-3">
       <div
         className={cn(
           "relative flex gap-2 rounded-2xl bg-gradient-to-b from-[#21201c] from-50% to-[#1a1915] px-3 py-2.5",
-          message.role === "user" && "self-start",
-          message.role === "assistant" &&
+          role === "user" && "self-start",
+          role === "assistant" &&
             "bg-[linear-gradient(to_bottom,_hsla(60_1.8%_22%_/_0.75)_0%,_hsla(60_1.8%_22%_/_0)_90%)] pb-4 font-serif",
         )}
       >
-        {message.role === "assistant" && (
+        {role === "assistant" && (
           <div className="absolute inset-0 rounded-2xl border-[0.5px] border-[hsla(50_5.8%_40%/0.15)] bg-[radial-gradient(ellipse_at_left_top,_hsla(60_1.8%_22%/0.5)_0%,_hsla(60_1.8%_22%/0.3)_60%)] shadow-[0_4px_24px_rgba(0,0,0,0.015)]" />
         )}
         <div className="relative flex gap-2">

diff --git a/apps/docs/components/shadcn/Shadcn.tsx b/apps/docs/components/shadcn/Shadcn.tsx
@@ -23,7 +23,6 @@ import {
   TooltipTrigger,
 } from "../ui/tooltip";
 import { ModelPicker } from "./ModelPicker";
-import { useThreadListItem } from "@assistant-ui/react/context/react/ThreadListItemContext";
 
 export const MarkdownText = makeMarkdownText({
   remarkPlugins: [remarkGfm],

diff --git a/packages/assistant-stream/src/core/index.ts b/packages/assistant-stream/src/core/index.ts
@@ -11,9 +11,3 @@ export {
   toAssistantMessageStream,
   type AsyncIterableStream,
 } from "./accumulators/assistant-message";
-
-
-/**
- * @deprecated Use `createAssistantRun` instead. This will be removed in 0.0.1.
- */
-export { createAssistantRun as createRun } from "./modules/runs";
diff --git a/packages/react-ai-sdk/src/rsc/VercelRSCAdapter.tsx b/packages/react-ai-sdk/src/rsc/VercelRSCAdapter.tsx
@@ -17,19 +17,6 @@ type VercelRSCAdapterBase<T> = {
   convertMessage?: ((message: T) => VercelRSCMessage) | undefined;
 
   adapters?: ExternalStoreAdapter["adapters"] | undefined;
-
-  /**
-   * @deprecated Use `onNew` instead. This will be removed in 0.6.0.
-   */
-  append?: (message: AppendMessage) => Promise<void>;
-  /**
-   * @deprecated Use `onEdit` instead. This will be removed in 0.6.0.
-   */
-  edit?: ((message: AppendMessage) => Promise<void>) | undefined;
-  /**
-   * @deprecated Use `onReload` instead. This will be removed in 0.6.0.
-   */
-  reload?: ((parentId: string | null) => Promise<void>) | undefined;
 };
 
 export type VercelRSCAdapter<T = VercelRSCMessage> = VercelRSCAdapterBase<T> &

diff --git a/packages/react-ai-sdk/src/rsc/useVercelRSCRuntime.tsx b/packages/react-ai-sdk/src/rsc/useVercelRSCRuntime.tsx
@@ -25,15 +25,15 @@ const vercelToThreadMessage = <T,>(
 export const useVercelRSCRuntime = <T extends WeakKey>(
   adapter: VercelRSCAdapter<T>,
 ) => {
-  const onNew = adapter.onNew ?? adapter.append;
+  const onNew = adapter.onNew;
   if (!onNew)
     throw new Error("You must pass a onNew function to useVercelRSCRuntime");
   const eAdapter: ExternalStoreAdapter<any> = {
     isRunning: adapter.isRunning,
     messages: adapter.messages,
     onNew,
-    onEdit: adapter.onEdit ?? adapter.edit,
-    onReload: adapter.onReload ?? adapter.reload,
+    onEdit: adapter.onEdit,
+    onReload: adapter.onReload,
     convertMessage: (m: T) =>
       vercelToThreadMessage(
         adapter.convertMessage ?? ((m) => m as VercelRSCMessage),

diff --git a/packages/react-ai-sdk/src/ui/index.ts b/packages/react-ai-sdk/src/ui/index.ts
@@ -1,8 +1,3 @@
 export { useVercelUseChatRuntime } from "./use-chat/useVercelUseChatRuntime";
 export { useVercelUseAssistantRuntime } from "./use-assistant/useVercelUseAssistantRuntime";
 export { getVercelAIMessages } from "./getVercelAIMessages";
-
-/**
- * @deprecated Use `getVercelAIMessages` (plural) instead. This will be removed in 0.7.0.
- */
-export { getVercelAIMessages as getVercelAIMessage } from "./getVercelAIMessages";
diff --git a/packages/react-ai-sdk/src/ui/use-assistant/useVercelUseAssistantRuntime.tsx b/packages/react-ai-sdk/src/ui/use-assistant/useVercelUseAssistantRuntime.tsx
@@ -10,7 +10,9 @@ import { vercelAttachmentAdapter } from "../utils/vercelAttachmentAdapter";
 import { ExternalStoreAdapter } from "@assistant-ui/react";
 
 export type VercelUseChatAdapter = {
-  adapters?: Omit<ExternalStoreAdapter["adapters"], "attachments"> | undefined;
+  adapters?:
+    | Omit<NonNullable<ExternalStoreAdapter["adapters"]>, "attachments">
+    | undefined;
 };
 
 export const useVercelUseAssistantRuntime = (
@@ -29,15 +31,27 @@ export const useVercelUseAssistantRuntime = (
     onNew: async (message) => {
       await assistantHelpers.append(await toCreateMessage(message));
     },
-    onSwitchToNewThread: () => {
-      assistantHelpers.messages = [];
-      assistantHelpers.input = "";
-      assistantHelpers.setMessages([]);
-      assistantHelpers.setInput("");
-    },
     adapters: {
       attachments: vercelAttachmentAdapter,
       ...adapter.adapters,
+      threadList: new Proxy(adapter.adapters?.threadList ?? {}, {
+        get(target, prop, receiver) {
+          if (prop === "onSwitchToNewThread") {
+            return () => {
+              assistantHelpers.messages = [];
+              assistantHelpers.input = "";
+              assistantHelpers.setMessages([]);
+              assistantHelpers.setInput("");
+
+              if (typeof target.onSwitchToNewThread === "function") {
+                return target.onSwitchToNewThread.call(target);
+              }
+            };
+          }
+
+          return Reflect.get(target, prop, receiver);
+        },
+      }),
     },
   });
 

diff --git a/packages/react-ai-sdk/src/ui/use-chat/useVercelUseChatRuntime.tsx b/packages/react-ai-sdk/src/ui/use-chat/useVercelUseChatRuntime.tsx
@@ -12,7 +12,9 @@ import { getVercelAIMessages } from "../getVercelAIMessages";
 import { ExternalStoreAdapter } from "@assistant-ui/react";
 
 export type VercelUseChatAdapter = {
-  adapters?: Omit<ExternalStoreAdapter["adapters"], "attachments"> | undefined;
+  adapters?:
+    | Omit<NonNullable<ExternalStoreAdapter["adapters"]>, "attachments">
+    | undefined;
 };
 
 export const useVercelUseChatRuntime = (
@@ -52,15 +54,27 @@ export const useVercelUseChatRuntime = (
     onAddToolResult: ({ toolCallId, result }) => {
       chatHelpers.addToolResult({ toolCallId, result });
     },
-    onSwitchToNewThread: () => {
-      chatHelpers.messages = [];
-      chatHelpers.input = "";
-      chatHelpers.setMessages([]);
-      chatHelpers.setInput("");
-    },
     adapters: {
       attachments: vercelAttachmentAdapter,
       ...adapter.adapters,
+      threadList: new Proxy(adapter.adapters?.threadList ?? {}, {
+        get(target, prop, receiver) {
+          if (prop === "onSwitchToNewThread") {
+            return () => {
+              chatHelpers.messages = [];
+              chatHelpers.input = "";
+              chatHelpers.setMessages([]);
+              chatHelpers.setInput("");
+
+              if (typeof target.onSwitchToNewThread === "function") {
+                return target.onSwitchToNewThread.call(target);
+              }
+            };
+          }
+
+          return Reflect.get(target, prop, receiver);
+        },
+      }),
     },
   });
 

diff --git a/packages/react-ai-sdk/src/ui/utils/convertMessage.ts b/packages/react-ai-sdk/src/ui/utils/convertMessage.ts
@@ -22,6 +22,7 @@ export const convertMessage: useExternalMessageConverter.Callback<Message> = (
               type: "file",
               name: attachment.name ?? attachment.url,
               content: [],
+              contentType: attachment.contentType ?? "unknown/unknown",
               status: { type: "complete" },
             }) satisfies CompleteAttachment,
         ),

diff --git a/packages/react-ai-sdk/src/ui/utils/toCreateMessage.ts b/packages/react-ai-sdk/src/ui/utils/toCreateMessage.ts
@@ -19,7 +19,7 @@ export const toCreateMessage = async (
     experimental_attachments: [
       ...images,
       ...(await Promise.all(
-        (message.attachments ?? []).map(async (m) => {
+        message.attachments.map(async (m) => {
           if (m.file == null)
             throw new Error("Attachment did not contain a file");
           return {

diff --git a/packages/react-langgraph/src/useLangGraphRuntime.ts b/packages/react-langgraph/src/useLangGraphRuntime.ts
@@ -69,13 +69,27 @@ export const useLangGraphRuntime = ({
   });
 
   return useExternalStoreRuntime({
-    threadId,
     isRunning,
     messages: threadMessages,
     adapters: {
       attachments: unstable_allowImageAttachments
         ? new SimpleImageAttachmentAdapter()
         : undefined,
+      threadList: {
+        threadId,
+        onSwitchToNewThread: !onSwitchToNewThread
+          ? undefined
+          : async () => {
+              await onSwitchToNewThread();
+              setMessages([]);
+            },
+        onSwitchToThread: !onSwitchToThread
+          ? undefined
+          : async (threadId) => {
+              const { messages } = await onSwitchToThread(threadId);
+              setMessages(messages);
+            },
+      },
     },
     onNew: (msg) => {
       const cancellations =
@@ -93,7 +107,7 @@ export const useLangGraphRuntime = ({
 
       const allContent = [
         ...msg.content,
-        ...(msg.attachments?.flatMap((a) => a.content) ?? []),
+        ...msg.attachments.flatMap((a) => a.content),
       ];
 
       return handleSendMessage([
@@ -133,17 +147,5 @@ export const useLangGraphRuntime = ({
         },
       ]);
     },
-    onSwitchToNewThread: !onSwitchToNewThread
-      ? undefined
-      : async () => {
-          await onSwitchToNewThread();
-          setMessages([]);
-        },
-    onSwitchToThread: !onSwitchToThread
-      ? undefined
-      : async (threadId) => {
-          const { messages } = await onSwitchToThread(threadId);
-          setMessages(messages);
-        },
   });
 };
diff --git a/packages/react-markdown/src/ui/useCopyToClipboard.tsx b/packages/react-markdown/src/ui/useCopyToClipboard.tsx
@@ -1,7 +1,8 @@
 import { useState } from "react";
-import { UseActionBarCopyProps } from "@assistant-ui/react";
 
-export type useCopyToClipboardProps = UseActionBarCopyProps;
+export type useCopyToClipboardProps = {
+  copiedDuration?: number;
+};
 
 export const useCopyToClipboard = ({
   copiedDuration = 3000,

diff --git a/packages/react-playground/src/components/payload-editor-button.tsx b/packages/react-playground/src/components/payload-editor-button.tsx
@@ -32,7 +32,7 @@ export const PayloadEditorButton: FC = () => {
     const config = runtime.useModelConfig.getState();
     const options: EdgeRuntimeRequestOptions = {
       modelName: config.config?.modelName ?? "gpt-4o",
-      messages: toCoreMessages(runtime.messages),
+      messages: toCoreMessages(runtime.getState().messages),
       tools: toLanguageModelTools(config.tools ?? {}),
       ...config.callSettings,
     };

diff --git a/packages/react-playground/src/components/ui/assistant-ui/thread.tsx b/packages/react-playground/src/components/ui/assistant-ui/thread.tsx
@@ -113,7 +113,7 @@ const Composer: FC = () => {
   const performAdd = () => {
     threadRuntime.append({
       role,
-      content: [{ type: "text", text: composerRuntime.text }],
+      content: [{ type: "text", text: composerRuntime.getState().text }],
     });
     composerRuntime.reset();