pass headers through

Author: ianmacartney

example/convex/_generated/api.d.ts

@@ -8,6 +8,7 @@
  * @module
  */
 
+import type * as auth from "../auth.js";
 import type * as chat from "../chat.js";
 import type * as http from "../http.js";
 import type * as messages from "../messages.js";
@@ -28,6 +29,7 @@ import type {
  * ```
  */
 declare const fullApi: ApiFromModules<{
+  auth: typeof auth;
   chat: typeof chat;
   http: typeof http;
   messages: typeof messages;

example/convex/http.ts

@@ -1,8 +1,10 @@
 import { httpRouter } from "convex/server";
 import { streamChat } from "./chat";
 import { httpAction } from "./_generated/server";
+import { auth } from "./auth";
 
 const http = httpRouter();
+auth.addHttpRoutes(http);
 
 http.route({
   path: "/chat-stream",

src/react/index.ts

@@ -37,7 +37,13 @@ export function useStream(
   >,
   streamUrl: URL,
   driven: boolean,
-  streamId?: StreamId
+  streamId: StreamId | undefined,
+  opts?: {
+    // If provided, this will be passed as the Authorization header.
+    authToken?: string | null;
+    // If provided, these will be passed as additional headers.
+    headers?: Record<string, string>;
+  }
 ) {
   const [streamEnded, setStreamEnded] = useState(null as boolean | null);
 
@@ -56,20 +62,30 @@ export function useStream(
     // Otherwise, we'll try to drive the stream and use the HTTP response.
     return false;
   }, [driven, streamId, streamEnded]);
-//  console.log("usePersistence", usePersistence);
+  //  console.log("usePersistence", usePersistence);
   const persistentBody = useQuery(
     getPersistentBody,
-    usePersistence && streamId ? { streamId: streamId! } : "skip"
+    usePersistence && streamId ? { streamId } : "skip"
   );
   const [streamBody, setStreamBody] = useState<string>("");
 
   useEffect(() => {
     if (driven && streamId && !streamStarted.current) {
       // Kick off HTTP action.
       void (async () => {
-        const success = await startStreaming(streamUrl, streamId, (text) => {
-          setStreamBody((prev) => prev + text);
-        });
+        const success = await startStreaming(
+          streamUrl,
+          streamId,
+          (text) => {
+            setStreamBody((prev) => prev + text);
+          },
+          {
+            ...opts?.headers,
+            ...(opts?.authToken
+              ? { Authorization: `Bearer ${opts.authToken}` }
+              : {}),
+          }
+        );
         setStreamEnded(success);
       })();
       // If we get remounted, we don't want to start a new stream.
@@ -119,14 +135,15 @@ export function useStream(
 async function startStreaming(
   url: URL,
   streamId: StreamId,
-  onUpdate: (text: string) => void
+  onUpdate: (text: string) => void,
+  headers: Record<string, string>
 ) {
   const response = await fetch(url, {
     method: "POST",
     body: JSON.stringify({
       streamId: streamId,
     }),
-    headers: { "Content-Type": "application/json" },
+    headers: { "Content-Type": "application/json", ...headers },
   });
   // Adapted from https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_readable_streams
   if (response.status === 205) {