Allow threads to run in the background

packages/react-headless/src/hooks/useThread.ts

@@ -12,6 +12,7 @@ import type {
 type ThreadSlice = ThreadState & ThreadActions;
 type ThreadListSlice = ThreadListState & ThreadListActions;
 
+// The active thread lives directly in the store's flat fields.
 const threadSelector = (s: ChatStore): ThreadSlice => ({
   messages: s.messages,
   isRunning: s.isRunning,
@@ -32,6 +33,7 @@ const threadListSelector = (s: ChatStore): ThreadListSlice => ({
   threadListError: s.threadListError,
   selectedThreadId: s.selectedThreadId,
   hasMoreThreads: s.hasMoreThreads,
+  isCreatingThread: s.isCreatingThread,
   loadThreads: s.loadThreads,
   loadMoreThreads: s.loadMoreThreads,
   switchToNewThread: s.switchToNewThread,

packages/react-headless/src/hooks/useThreadState.ts

@@ -0,0 +1,26 @@
+import { useStore } from "zustand";
+import { useShallow } from "zustand/react/shallow";
+import { useChatStore } from "../store/ChatContext";
+
+/**
+ * Per-thread UI state for a thread **by id** (e.g. a sidebar row). Returns a state
+ * object rather than a bare value so it can grow more fields without a breaking
+ * change; for now it exposes only {@link ThreadStateView.isStreaming}.
+ */
+export interface ThreadStateView {
+  /** Whether the thread is streaming in the **background** */
+  isStreaming: boolean;
+}
+
+/**
+ * @category Hooks
+ */
+export function useThreadState(threadId: string | null): ThreadStateView {
+  const store = useChatStore();
+  return useStore(
+    store,
+    useShallow((s) => ({
+      isStreaming: threadId != null && threadId in s.inFlightThreads,
+    })),
+  );
+}

packages/react-headless/src/index.ts

@@ -6,6 +6,8 @@ export { useDetailedView } from "./hooks/useDetailedView";
 export { useDetailedViewPortalTarget } from "./hooks/useDetailedViewPortalTarget";
 export { MessageContext, MessageProvider, useMessage } from "./hooks/useMessage";
 export { useThread, useThreadList } from "./hooks/useThread";
+export { useThreadState } from "./hooks/useThreadState";
+export type { ThreadStateView } from "./hooks/useThreadState";
 export { useToolActivities } from "./hooks/useToolActivities";
 
 export { defineArtifactCategories } from "./store/artifactCategories";
@@ -78,6 +80,7 @@ export type {
   ThreadListActions,
   ThreadListState,
   ThreadState,
+  ThreadStateEntry,
 } from "./store/types";
 
 export type {