feat (ai/ui): allow JSONValue as data in useChat handleSubmit (#2128)

Co-authored-by: Brian Hung <[email protected]>
vercel · Jun 27, 2024 · 1894f81 · 1894f81
1 parent 9b50003
commit 1894f81
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 6 deletions.
diff --git a/.changeset/swift-boats-shout.md b/.changeset/swift-boats-shout.md
@@ -0,0 +1,6 @@
+---
+'@ai-sdk/ui-utils': patch
+'@ai-sdk/react': patch
+---
+
+feat (ai/ui): allow JSONValue as data in useChat handleSubmit
diff --git a/content/docs/07-reference/ai-sdk-ui/01-use-chat.mdx b/content/docs/07-reference/ai-sdk-ui/01-use-chat.mdx
@@ -136,7 +136,7 @@ Allows you to easily create a conversational user interface for your chatbot app
     },
     {
       name: 'experimental_prepareRequestBody',
-      type: '(options: { messages: Message[]; requestData?: Record<string, string>; requestBody?: object }) => JSONValue',
+      type: '(options: { messages: Message[]; requestData?: JSONValue; requestBody?: object }) => JSONValue',
       optional: true,
       description:
         'Experimental (React only). When a function is provided, it will be used to prepare the request body for the chat API. This can be useful for customizing the request body based on the messages and data in the chat.',
@@ -232,7 +232,7 @@ Allows you to easily create a conversational user interface for your chatbot app
             },
             {
               name: 'data',
-              type: 'Record<string,string>',
+              type: 'JSONValue',
               description: 'Additional data to be sent to the server.',
             },
           ],

diff --git a/packages/react/src/use-chat.ts b/packages/react/src/use-chat.ts
@@ -91,7 +91,7 @@ const getStreamedResponse = async (
   experimental_prepareRequestBody:
     | ((options: {
         messages: Message[];
-        requestData?: Record<string, string>;
+        requestData?: JSONValue;
         requestBody?: object;
       }) => JSONValue)
     | undefined,
@@ -220,7 +220,7 @@ export function useChat({
    */
   experimental_prepareRequestBody?: (options: {
     messages: Message[];
-    requestData?: Record<string, string>;
+    requestData?: JSONValue;
     requestBody?: object;
   }) => JSONValue;
 

diff --git a/packages/ui-utils/src/types.ts b/packages/ui-utils/src/types.ts
@@ -192,7 +192,7 @@ export type CreateMessage = Omit<Message, 'id'> & {
 export type ChatRequest = {
   messages: Message[];
   options?: RequestOptions;
-  data?: Record<string, string>;
+  data?: JSONValue;
 
   /**
    * @deprecated
@@ -272,7 +272,7 @@ The options to be passed to the fetch call.
   /**
 Additional data to be sent to the server.
    */
-  data?: Record<string, string>;
+  data?: JSONValue;
 };
 
 export type UseChatOptions = {
@@ -468,6 +468,10 @@ or to provide a custom fetch implementation for e.g. testing.
   fetch?: FetchFunction;
 };
 
+/**
+A JSON value can be a string, number, boolean, object, array, or null. 
+JSON values can be serialized and deserialized by the JSON.stringify and JSON.parse methods.
+ */
 export type JSONValue =
   | null
   | string