refactor(vercel/rsc)!: align RSC adapter function names with useExter…

…nalStoreRuntime (#542)
Yonom · Jul 20, 2024 · 7e9e774 · 7e9e774
1 parent d6aeb23
commit 7e9e774
Show file tree

Hide file tree

Showing 8 changed files with 40 additions and 17 deletions.
diff --git a/.changeset/slow-feet-heal.md b/.changeset/slow-feet-heal.md
@@ -0,0 +1,5 @@
+---
+"@assistant-ui/react-ai-sdk": patch
+---
+
+refactor: align RSC adapter function names with useExternalStore
diff --git a/apps/docs/content/docs/docs/runtimes/vercel-ai-sdk/rsc.mdx b/apps/docs/content/docs/docs/runtimes/vercel-ai-sdk/rsc.mdx
@@ -144,7 +144,7 @@ export function MyRuntimeProvider({
   const { continueConversation } = useActions();
   const [messages, setMessages] = useUIState<typeof AI>();
 
-  const append = async (m: AppendMessage) => {
+  const onNew = async (m: AppendMessage) => {
     if (m.content[0]?.type !== "text")
       throw new Error("Only text messages are supported");
 
@@ -159,7 +159,7 @@ export function MyRuntimeProvider({
     setMessages((currentConversation) => [...currentConversation, message]);
   };
 
-  const runtime = useVercelRSCRuntime({ messages, append });
+  const runtime = useVercelRSCRuntime({ messages, onNew });
 
   return (
     <AssistantRuntimeProvider runtime={runtime}>

diff --git a/apps/docs/content/docs/reference/integrations/vercel-ai-sdk.mdx b/apps/docs/content/docs/reference/integrations/vercel-ai-sdk.mdx
@@ -76,7 +76,7 @@ import { useVercelRSCRuntime } from "@assistant-ui/react-ai-sdk";
 const MyRuntimeProvider = ({ children }: { children: React.ReactNode }) => {
   const [messages, setMessages] = useUIState<typeof AI>();
 
-  const append = async (m: AppendMessage) => {
+  const onNew = async (m: AppendMessage) => {
     if (m.content[0]?.type !== "text")
       throw new Error("Only text messages are supported");
 
@@ -91,7 +91,7 @@ const MyRuntimeProvider = ({ children }: { children: React.ReactNode }) => {
     setMessages((currentConversation) => [...currentConversation, message]);
   };
 
-  const runtime = useVercelRSCRuntime({ messages, append });
+  const runtime = useVercelRSCRuntime({ messages, onNew });
 
   return (
     <AssistantRuntimeProvider runtime={runtime}>
@@ -117,17 +117,17 @@ const MyRuntimeProvider = ({ children }: { children: React.ReactNode }) => {
               description: "The messages in the thread.",
             },
             {
-              name: "append",
+              name: "onNew",
               type: "(message: AppendMessage) => Promise<void>",
               description: "A function to append a message to the thread.",
             },
             {
-              name: "edit",
+              name: "onEdit",
               type: "(message: AppendMessage) => Promise<void>",
               description: "A function to edit a message.",
             },
             {
-              name: "reload",
+              name: "onReload",
               type: "(parentId: string | null) => Promise<void>",
               description: "A function to reload a message.",
             },

diff --git a/examples/search-agent-for-e-commerce/src/app/MyRuntimeProvider.tsx b/examples/search-agent-for-e-commerce/src/app/MyRuntimeProvider.tsx
@@ -18,7 +18,7 @@ export function MyRuntimeProvider({
   const { continueConversation } = useActions();
   const [messages, setMessages] = useUIState<typeof AI>();
 
-  const append = async (m: AppendMessage) => {
+  const onNew = async (m: AppendMessage) => {
     if (m.content[0]?.type !== "text")
       throw new Error("Only text messages are supported");
 
@@ -33,7 +33,7 @@ export function MyRuntimeProvider({
     setMessages((currentConversation) => [...currentConversation, message]);
   };
 
-  const runtime = useVercelRSCRuntime({ messages, append });
+  const runtime = useVercelRSCRuntime({ messages, onNew });
 
   return (
     <AssistantRuntimeProvider runtime={runtime}>

diff --git a/examples/search-agent-for-e-commerce/tsconfig.json b/examples/search-agent-for-e-commerce/tsconfig.json
@@ -18,7 +18,9 @@
       }
     ],
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": ["./src/*"],
+      "@assistant-ui/*": ["../../packages/*/src"],
+      "@assistant-ui/react/*": ["../../packages/react/src/*"]
     }
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],

diff --git a/examples/with-vercel-ai-rsc/app/page.tsx b/examples/with-vercel-ai-rsc/app/page.tsx
@@ -25,7 +25,7 @@ const MyRuntimeProvider = ({ children }: { children: React.ReactNode }) => {
   const { continueConversation } = useActions();
   const [messages, setMessages] = useUIState<typeof AI>();
 
-  const append = async (m: AppendMessage) => {
+  const onNew = async (m: AppendMessage) => {
     if (m.content[0]?.type !== "text")
       throw new Error("Only text messages are supported");
 
@@ -40,7 +40,7 @@ const MyRuntimeProvider = ({ children }: { children: React.ReactNode }) => {
     setMessages((currentConversation) => [...currentConversation, message]);
   };
 
-  const runtime = useVercelRSCRuntime({ messages, append });
+  const runtime = useVercelRSCRuntime({ messages, onNew });
 
   return (
     <AssistantRuntimeProvider runtime={runtime}>

diff --git a/packages/react-ai-sdk/src/rsc/VercelRSCAdapter.tsx b/packages/react-ai-sdk/src/rsc/VercelRSCAdapter.tsx
@@ -8,10 +8,23 @@ type RSCMessageConverter<T> = {
 
 type VercelRSCAdapterBase<T> = {
   messages: T[];
-  append: (message: AppendMessage) => Promise<void>;
+  onNew?: (message: AppendMessage) => Promise<void>;
+  onEdit?: ((message: AppendMessage) => Promise<void>) | undefined;
+  onReload?: ((parentId: string | null) => Promise<void>) | undefined;
+  convertMessage?: ((message: T) => VercelRSCMessage) | 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;
-  convertMessage?: ((message: T) => VercelRSCMessage) | 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
@@ -26,11 +26,14 @@ const vercelToThreadMessage = <T,>(
 export const useVercelRSCRuntime = <T extends WeakKey>(
   adapter: VercelRSCAdapter<T>,
 ) => {
+  const onNew = adapter.onNew ?? adapter.append;
+  if (!onNew)
+    throw new Error("You must pass a onNew function to useVercelRSCRuntime");
   const eAdapter: ExternalStoreAdapter<any> = {
     messages: adapter.messages,
-    onNew: adapter.append,
-    onEdit: adapter.edit,
-    onReload: adapter.reload,
+    onNew,
+    onEdit: adapter.onEdit ?? adapter.edit,
+    onReload: adapter.onReload ?? adapter.reload,
     convertMessage: (m: T) =>
       vercelToThreadMessage(
         adapter.convertMessage ?? ((m) => m as VercelRSCMessage),