@deltakit/react 0.2.0 → 0.2.1

package/dist/index.js

@@ -85,8 +85,9 @@ function useAutoScroll(dependencies, options) {
 }
 
 // src/use-stream-chat.ts
-import { parseSSEStream } from "@deltakit/core";
-import { useCallback as useCallback2, useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
+
+// src/chat-controller.ts
 var counter = 0;
 function generateId() {
   return `msg_${Date.now()}_${++counter}`;
@@ -94,30 +95,403 @@ function generateId() {
 function createMessage(role, parts) {
   return { id: generateId(), role, parts };
 }
+function createChatTransportContext(options) {
+  const helpers = {
+    appendPart: options.appendPart,
+    appendText: options.appendText,
+    setMessages: options.setMessages
+  };
+  return {
+    emit: (event) => {
+      options.eventHandler(event, helpers);
+    },
+    ensureAssistantMessage: () => {
+      options.setMessages((prev) => {
+        const last = prev[prev.length - 1];
+        if (last?.role === "assistant") {
+          return prev;
+        }
+        return [...prev, createMessage("assistant", [])];
+      });
+    },
+    fail: (error) => {
+      options.setError(error);
+      options.onError?.(error);
+      options.setIsLoading(false);
+      options.setRunId(null);
+    },
+    finish: () => {
+      options.setIsLoading(false);
+      options.setRunId(null);
+      const finalMessages = options.getMessages();
+      const lastMessage = finalMessages[finalMessages.length - 1];
+      if (lastMessage?.role === "assistant") {
+        options.onMessage?.(lastMessage);
+      }
+      options.onFinish?.(finalMessages);
+    },
+    getMessages: options.getMessages,
+    setRunId: (runId) => {
+      options.setRunId(runId);
+    }
+  };
+}
+
+// src/transports.ts
+import { parseSSEStream } from "@deltakit/core";
+function toError(error) {
+  return error instanceof Error ? error : new Error(String(error));
+}
+function isAbortError(error) {
+  return error instanceof DOMException && error.name === "AbortError";
+}
+function resolveRunId(response) {
+  if (!response || typeof response !== "object") {
+    throw new Error("Background SSE start response did not contain a run id");
+  }
+  const maybeRunId = "runId" in response ? response.runId : "job_id" in response ? response.job_id : null;
+  if (typeof maybeRunId !== "string" || maybeRunId.length === 0) {
+    throw new Error("Background SSE start response did not contain a run id");
+  }
+  return maybeRunId;
+}
+function resolveUrl(url, runId) {
+  return typeof url === "function" ? url(runId) : url.replace(":runId", runId);
+}
+async function streamFetchSSE(response, context, signal) {
+  if (!response.ok) {
+    throw new Error(
+      `SSE request failed: ${response.status} ${response.statusText}`
+    );
+  }
+  if (!response.body) {
+    throw new Error("Response body is null \u2014 SSE streaming not supported");
+  }
+  for await (const event of parseSSEStream(response.body, signal)) {
+    context.emit(event);
+  }
+}
+function createDirectSSETransport(config) {
+  return {
+    start: ({ context, message }) => {
+      const controller = new AbortController();
+      const run = {
+        close: () => {
+          controller.abort();
+        },
+        stop: () => {
+          controller.abort();
+        }
+      };
+      const fetchImpl = config.fetch ?? fetch;
+      void (async () => {
+        try {
+          const response = await fetchImpl(config.api, {
+            body: JSON.stringify({ message, ...config.body }),
+            headers: {
+              "Content-Type": "application/json",
+              ...config.headers
+            },
+            method: config.method ?? "POST",
+            signal: controller.signal
+          });
+          await streamFetchSSE(response, context, controller.signal);
+          context.finish();
+        } catch (error) {
+          if (!isAbortError(error)) {
+            context.fail(toError(error));
+          }
+        }
+      })();
+      return run;
+    }
+  };
+}
+function createBackgroundSSETransport(config) {
+  const fetchImpl = config.fetch ?? fetch;
+  const connect = (runId, context) => {
+    const controller = new AbortController();
+    void (async () => {
+      try {
+        context.ensureAssistantMessage();
+        const response = await fetchImpl(resolveUrl(config.eventsApi, runId), {
+          headers: config.eventHeaders,
+          method: "GET",
+          signal: controller.signal
+        });
+        await streamFetchSSE(response, context, controller.signal);
+        context.finish();
+      } catch (error) {
+        if (!isAbortError(error)) {
+          context.fail(toError(error));
+        }
+      }
+    })();
+    return {
+      close: () => {
+        controller.abort();
+      },
+      stop: () => {
+        controller.abort();
+        if (config.cancelApi) {
+          void fetchImpl(resolveUrl(config.cancelApi, runId), {
+            method: "POST"
+          });
+        }
+      },
+      runId
+    };
+  };
+  return {
+    resume: ({ context, runId }) => {
+      context.setRunId(runId);
+      return connect(runId, context);
+    },
+    start: ({ context, message }) => {
+      const startController = new AbortController();
+      let activeRun;
+      void (async () => {
+        try {
+          const response = await fetchImpl(config.startApi, {
+            body: JSON.stringify({ message, ...config.startBody }),
+            headers: {
+              "Content-Type": "application/json",
+              ...config.startHeaders
+            },
+            method: config.startMethod ?? "POST",
+            signal: startController.signal
+          });
+          if (!response.ok) {
+            throw new Error(
+              `Background SSE start failed: ${response.status} ${response.statusText}`
+            );
+          }
+          const data = await response.json();
+          const runId = (config.resolveRunId ?? resolveRunId)(data);
+          context.setRunId(runId);
+          activeRun = connect(runId, context);
+        } catch (error) {
+          if (!isAbortError(error)) {
+            context.fail(toError(error));
+          }
+        }
+      })();
+      return {
+        close: () => {
+          startController.abort();
+          void activeRun?.close?.();
+        },
+        stop: () => {
+          startController.abort();
+          activeRun?.stop?.();
+        },
+        runId: null
+      };
+    }
+  };
+}
+function defaultParseWebSocketMessage(data) {
+  if (typeof data !== "string") {
+    return null;
+  }
+  const parsed = JSON.parse(data);
+  return parsed;
+}
+function createWebSocketTransport(config) {
+  const parseMessage = config.parseMessage ?? defaultParseWebSocketMessage;
+  const serializeMessage = config.serializeMessage ?? JSON.stringify;
+  let resolvedRunId = null;
+  const applyIncomingEvents = (parsed, context) => {
+    const events = Array.isArray(parsed) ? parsed : parsed ? [parsed] : [];
+    for (const item of events) {
+      const nextRunId = config.resolveRunId?.(item) ?? null;
+      if (nextRunId) {
+        resolvedRunId = nextRunId;
+        context.setRunId(nextRunId);
+      }
+      context.emit(item);
+      if (item.type === "done") {
+        context.finish();
+      } else if (item.type === "error") {
+        context.fail(
+          new Error(
+            "message" in item && typeof item.message === "string" ? item.message : "Stream error"
+          )
+        );
+      }
+    }
+  };
+  return {
+    resume: ({ context, runId }) => {
+      context.setRunId(runId);
+      context.ensureAssistantMessage();
+      const socket = new WebSocket(
+        typeof config.url === "function" ? config.url(runId) : config.url,
+        config.protocols
+      );
+      let manuallyClosed = false;
+      let sentResumePayload = false;
+      const sendResumePayload = () => {
+        if (sentResumePayload || socket.readyState !== WebSocket.OPEN) {
+          return;
+        }
+        sentResumePayload = true;
+        const payload = config.buildResumePayload?.(runId) ?? { [config.runIdKey ?? "runId"]: runId };
+        socket.send(serializeMessage(payload));
+      };
+      socket.onopen = sendResumePayload;
+      socket.onmessage = (event) => {
+        try {
+          applyIncomingEvents(parseMessage(event.data), context);
+        } catch (error) {
+          context.fail(toError(error));
+        }
+      };
+      socket.onerror = () => {
+        context.fail(new Error("WebSocket connection failed"));
+      };
+      socket.onclose = () => {
+        if (!manuallyClosed) {
+          context.finish();
+        }
+      };
+      queueMicrotask(sendResumePayload);
+      return {
+        close: () => {
+          manuallyClosed = true;
+          socket.close();
+        },
+        stop: () => {
+          manuallyClosed = true;
+          const stopRunId = resolvedRunId ?? runId;
+          if (stopRunId && config.cancelUrl) {
+            void fetch(resolveUrl(config.cancelUrl, stopRunId), {
+              method: "POST"
+            });
+          }
+          socket.close();
+        },
+        runId
+      };
+    },
+    start: ({ context, message }) => {
+      const runId = config.runId ?? config.getResumeKey?.() ?? null;
+      const socket = new WebSocket(
+        typeof config.url === "function" ? config.url(runId) : config.url,
+        config.protocols
+      );
+      let manuallyClosed = false;
+      let sentStartPayload = false;
+      const sendStartPayload = () => {
+        if (sentStartPayload || socket.readyState !== WebSocket.OPEN) {
+          return;
+        }
+        sentStartPayload = true;
+        context.ensureAssistantMessage();
+        const payload = {
+          message,
+          ...config.body
+        };
+        if (runId) {
+          payload[config.runIdKey ?? "runId"] = runId;
+        }
+        socket.send(serializeMessage(payload));
+      };
+      socket.onopen = sendStartPayload;
+      socket.onmessage = (event) => {
+        try {
+          applyIncomingEvents(parseMessage(event.data), context);
+        } catch (error) {
+          context.fail(toError(error));
+        }
+      };
+      socket.onerror = () => {
+        context.fail(new Error("WebSocket connection failed"));
+      };
+      socket.onclose = () => {
+        if (!manuallyClosed) {
+          context.finish();
+        }
+      };
+      queueMicrotask(sendStartPayload);
+      return {
+        close: () => {
+          manuallyClosed = true;
+          socket.close();
+        },
+        stop: () => {
+          manuallyClosed = true;
+          const stopRunId = resolvedRunId ?? runId;
+          if (stopRunId && config.cancelUrl) {
+            void fetch(resolveUrl(config.cancelUrl, stopRunId), {
+              method: "POST"
+            });
+          }
+          socket.close();
+        },
+        runId
+      };
+    }
+  };
+}
+function resolveTransport(options) {
+  if (typeof options.transport === "object" && options.transport) {
+    return options.transport;
+  }
+  const transportKind = options.transport ?? "sse";
+  if (transportKind === "background-sse") {
+    const config = options.transportOptions?.backgroundSSE;
+    if (!config) {
+      throw new Error(
+        '`transportOptions.backgroundSSE` is required when transport is "background-sse"'
+      );
+    }
+    return createBackgroundSSETransport(config);
+  }
+  if (transportKind === "websocket") {
+    const config = options.transportOptions?.websocket;
+    if (!config) {
+      throw new Error(
+        '`transportOptions.websocket` is required when transport is "websocket"'
+      );
+    }
+    return createWebSocketTransport(config);
+  }
+  const sseConfig = options.transportOptions?.sse ?? {
+    api: options.api,
+    body: options.body,
+    headers: options.headers
+  };
+  if (!sseConfig.api) {
+    throw new Error(
+      "`api` or `transportOptions.sse.api` is required when using the default SSE transport"
+    );
+  }
+  return createDirectSSETransport({
+    ...sseConfig,
+    api: sseConfig.api
+  });
+}
+
+// src/use-stream-chat.ts
 function defaultOnEvent(event, helpers) {
   if (event.type === "text_delta") {
     helpers.appendText(event.delta);
   }
 }
 function useStreamChat(options) {
-  const {
-    api,
-    headers,
-    body,
-    initialMessages,
-    onEvent,
-    onMessage,
-    onError,
-    onFinish
-  } = options;
-  const [messages, setMessages] = useState2(
-    initialMessages ?? []
-  );
+  const { initialMessages, onEvent, onMessage, onError, onFinish } = options;
+  const [messages, setMessages] = useState2(initialMessages ?? []);
   const [isLoading, setIsLoading] = useState2(false);
   const [error, setError] = useState2(null);
-  const abortRef = useRef2(null);
+  const [runId, setRunId] = useState2(null);
+  const runRef = useRef2(null);
+  const resumedRunIdRef = useRef2(null);
+  const manuallyStoppedRef = useRef2(false);
   const messagesRef = useRef2(messages);
   messagesRef.current = messages;
+  const transportOptionsRef = useRef2(options.transportOptions);
+  transportOptionsRef.current = options.transportOptions;
   const appendText = useCallback2((delta) => {
     setMessages((prev) => {
       const last = prev[prev.length - 1];
@@ -133,29 +507,69 @@ function useStreamChat(options) {
       } else {
         parts.push({ type: "text", text: delta });
       }
-      const updated = { ...last, parts };
-      return [...prev.slice(0, -1), updated];
+      return [...prev.slice(0, -1), { ...last, parts }];
     });
   }, []);
   const appendPart = useCallback2((part) => {
     setMessages((prev) => {
       const last = prev[prev.length - 1];
       if (!last || last.role !== "assistant") return prev;
-      const updated = {
-        ...last,
-        parts: [...last.parts, part]
-      };
-      return [...prev.slice(0, -1), updated];
+      return [
+        ...prev.slice(0, -1),
+        {
+          ...last,
+          parts: [...last.parts, part]
+        }
+      ];
     });
   }, []);
+  const transportRef = useRef2(null);
+  if (!transportRef.current) {
+    transportRef.current = resolveTransport(options);
+  }
+  const transport = transportRef.current;
+  const eventHandler = onEvent ?? defaultOnEvent;
+  const eventHandlerRef = useRef2(eventHandler);
+  eventHandlerRef.current = eventHandler;
+  const onErrorRef = useRef2(onError);
+  onErrorRef.current = onError;
+  const onFinishRef = useRef2(onFinish);
+  onFinishRef.current = onFinish;
+  const onMessageRef = useRef2(onMessage);
+  onMessageRef.current = onMessage;
+  const transportContext = useMemo(
+    () => createChatTransportContext({
+      appendPart,
+      appendText,
+      eventHandler: (event, helpers) => eventHandlerRef.current(event, helpers),
+      getMessages: () => messagesRef.current,
+      onError: (...args) => onErrorRef.current?.(...args),
+      onFinish: (...args) => onFinishRef.current?.(...args),
+      onMessage: (...args) => onMessageRef.current?.(...args),
+      setError,
+      setIsLoading,
+      setMessages,
+      setRunId: (next) => {
+        setRunId(next);
+        transportOptionsRef.current?.backgroundSSE?.onRunIdChange?.(next);
+        transportOptionsRef.current?.websocket?.onRunIdChange?.(next);
+      }
+    }),
+    [appendPart, appendText]
+  );
   const stop = useCallback2(() => {
-    abortRef.current?.abort();
-    abortRef.current = null;
+    const activeRun = runRef.current;
+    if (!activeRun?.stop) {
+      return;
+    }
+    manuallyStoppedRef.current = true;
+    void activeRun.stop();
+    runRef.current = null;
     setIsLoading(false);
   }, []);
   const sendMessage = useCallback2(
     (text) => {
-      if (abortRef.current) {
+      if (runRef.current || isLoading) {
         return;
       }
       const userMessage = createMessage("user", [
@@ -170,85 +584,64 @@ function useStreamChat(options) {
       onMessage?.(userMessage);
       setError(null);
       setIsLoading(true);
-      const controller = new AbortController();
-      abortRef.current = controller;
-      const eventHandler = onEvent ?? defaultOnEvent;
-      const helpers = {
-        appendText,
-        appendPart,
-        setMessages
-      };
-      (async () => {
-        try {
-          const response = await fetch(api, {
-            method: "POST",
-            headers: {
-              "Content-Type": "application/json",
-              ...headers
-            },
-            body: JSON.stringify({ message: text, ...body }),
-            signal: controller.signal
-          });
-          if (!response.ok) {
-            throw new Error(
-              `SSE request failed: ${response.status} ${response.statusText}`
-            );
-          }
-          if (!response.body) {
-            throw new Error(
-              "Response body is null \u2014 SSE streaming not supported"
-            );
-          }
-          for await (const event of parseSSEStream(
-            response.body,
-            controller.signal
-          )) {
-            eventHandler(event, helpers);
-          }
-          const finalMessages = messagesRef.current;
-          const lastMessage = finalMessages[finalMessages.length - 1];
-          if (lastMessage?.role === "assistant") {
-            onMessage?.(lastMessage);
-          }
-          onFinish?.(finalMessages);
-        } catch (err) {
-          if (err instanceof DOMException && err.name === "AbortError") {
-            return;
-          }
-          const error2 = err instanceof Error ? err : new Error(String(err));
-          setError(error2);
-          onError?.(error2);
-        } finally {
-          abortRef.current = null;
-          setIsLoading(false);
-        }
-      })();
+      resumedRunIdRef.current = null;
+      manuallyStoppedRef.current = false;
+      const run = transport.start({ context: transportContext, message: text });
+      runRef.current = run ?? null;
+      if (run?.runId) {
+        setRunId(run.runId);
+      }
     },
-    [
-      api,
-      headers,
-      body,
-      onEvent,
-      onMessage,
-      onError,
-      onFinish,
-      appendText,
-      appendPart
-    ]
+    [isLoading, onMessage, transport, transportContext]
   );
+  const candidateRunId = options.transportOptions?.backgroundSSE?.runId ?? options.transportOptions?.backgroundSSE?.getResumeKey?.() ?? options.transportOptions?.websocket?.runId ?? options.transportOptions?.websocket?.getResumeKey?.() ?? null;
+  useEffect2(() => {
+    if (runRef.current) {
+      return;
+    }
+    if (!candidateRunId) {
+      return;
+    }
+    if (manuallyStoppedRef.current) {
+      return;
+    }
+    if (resumedRunIdRef.current === candidateRunId) {
+      return;
+    }
+    if (!transport.resume) {
+      return;
+    }
+    resumedRunIdRef.current = candidateRunId;
+    setError(null);
+    setIsLoading(true);
+    const run = transport.resume({
+      context: transportContext,
+      runId: candidateRunId
+    });
+    runRef.current = run ?? null;
+    setRunId(candidateRunId);
+  }, [candidateRunId, transport, transportContext]);
   useEffect2(() => {
     return () => {
-      abortRef.current?.abort();
-      abortRef.current = null;
+      void runRef.current?.close?.();
+      runRef.current = null;
     };
   }, []);
+  const prevIsLoadingRef = useRef2(isLoading);
+  useEffect2(() => {
+    if (prevIsLoadingRef.current && !isLoading) {
+      runRef.current = null;
+    }
+    prevIsLoadingRef.current = isLoading;
+  }, [isLoading]);
   return {
-    messages,
-    isLoading,
     error,
+    isLoading,
+    messages,
+    runId,
     sendMessage,
-    stop,
-    setMessages
+    setMessages,
+    stop
   };
 }
 export {