fix(threads): Improve useThreads DX with clearer names and direct type hints

Author: BenTaylorDev

packages/react-core/src/v2/hooks/__tests__/use-threads.test.tsx

@@ -383,6 +383,60 @@ describe("useThreads", () => {
     });
   });
 
+  it("exposes thread-scoped pagination properties", async () => {
+    fetchMock
+      .mockReturnValueOnce(
+        jsonResponse({
+          threads: sampleThreads,
+          joinCode: "jc-1",
+          nextCursor: "cursor-abc",
+        }),
+      )
+      .mockReturnValueOnce(jsonResponse({ joinToken: "jt-1" }));
+
+    const { result } = renderHook(() => useThreads(defaultInput));
+
+    await waitFor(() => {
+      expect(result.current.isLoading).toBe(false);
+    });
+
+    expect(result.current).toHaveProperty("hasMoreThreads");
+    expect(result.current).toHaveProperty("isFetchingMoreThreads");
+    expect(result.current).toHaveProperty("fetchMoreThreads");
+    expect(result.current).not.toHaveProperty("hasNextPage");
+    expect(result.current).not.toHaveProperty("isFetchingNextPage");
+    expect(result.current).not.toHaveProperty("fetchNextPage");
+
+    expect(result.current.hasMoreThreads).toBe(true);
+    expect(result.current.isFetchingMoreThreads).toBe(false);
+    expect(typeof result.current.fetchMoreThreads).toBe("function");
+  });
+
+  it("does not expose organizationId or createdById on threads", async () => {
+    fetchMock
+      .mockReturnValueOnce(
+        jsonResponse({ threads: sampleThreads, joinCode: "jc-1" }),
+      )
+      .mockReturnValueOnce(jsonResponse({ joinToken: "jt-1" }));
+
+    const { result } = renderHook(() => useThreads(defaultInput));
+
+    await waitFor(() => {
+      expect(result.current.isLoading).toBe(false);
+    });
+
+    for (const thread of result.current.threads) {
+      expect(thread).not.toHaveProperty("organizationId");
+      expect(thread).not.toHaveProperty("createdById");
+      expect(thread).toHaveProperty("id");
+      expect(thread).toHaveProperty("agentId");
+      expect(thread).toHaveProperty("name");
+      expect(thread).toHaveProperty("archived");
+      expect(thread).toHaveProperty("createdAt");
+      expect(thread).toHaveProperty("updatedAt");
+    }
+  });
+
   it("tears down sockets after repeated connection failures", async () => {
     fetchMock
       .mockReturnValueOnce(

packages/react-core/src/v2/hooks/use-threads.tsx

@@ -6,7 +6,6 @@ import {
   ɵselectThreadsIsLoading,
   ɵselectHasNextPage,
   ɵselectIsFetchingNextPage,
-  type ɵThread as CoreThread,
   type ɵThreadRuntimeContext,
   type ɵThreadStore,
 } from "@copilotkit/core";
@@ -24,7 +23,14 @@ import {
  * Each thread has a unique `id`, an optional human-readable `name`, and
  * timestamp fields tracking creation and update times.
  */
-export interface Thread extends CoreThread {}
+export interface Thread {
+  id: string;
+  agentId: string;
+  name: string | null;
+  archived: boolean;
+  createdAt: string;
+  updatedAt: string;
+}
 
 /**
  * Configuration for the {@link useThreads} hook.
@@ -68,18 +74,18 @@ export interface UseThreadsResult {
   error: Error | null;
   /**
    * `true` when there are more threads available to fetch via
-   * {@link fetchNextPage}. Only meaningful when `limit` is set.
+   * {@link fetchMoreThreads}. Only meaningful when `limit` is set.
    */
-  hasNextPage: boolean;
+  hasMoreThreads: boolean;
   /**
    * `true` while a subsequent page of threads is being fetched.
    */
-  isFetchingNextPage: boolean;
+  isFetchingMoreThreads: boolean;
   /**
-   * Fetch the next page of threads. No-op when {@link hasNextPage} is
-   * `false` or a page fetch is already in progress.
+   * Fetch the next page of threads. No-op when {@link hasMoreThreads} is
+   * `false` or a fetch is already in progress.
    */
-  fetchNextPage: () => void;
+  fetchMoreThreads: () => void;
   /**
    * Rename a thread on the platform.
    * Resolves when the server confirms the update; rejects on failure.
@@ -169,11 +175,25 @@ export function useThreads({
     }),
   );
 
-  const threads = useThreadStoreSelector(store, ɵselectThreads);
+  const coreThreads = useThreadStoreSelector(store, ɵselectThreads);
+  const threads: Thread[] = useMemo(
+    () =>
+      coreThreads.map(
+        ({ id, agentId, name, archived, createdAt, updatedAt }) => ({
+          id,
+          agentId,
+          name,
+          archived,
+          createdAt,
+          updatedAt,
+        }),
+      ),
+    [coreThreads],
+  );
   const storeIsLoading = useThreadStoreSelector(store, ɵselectThreadsIsLoading);
   const storeError = useThreadStoreSelector(store, ɵselectThreadsError);
-  const hasNextPage = useThreadStoreSelector(store, ɵselectHasNextPage);
-  const isFetchingNextPage = useThreadStoreSelector(
+  const hasMoreThreads = useThreadStoreSelector(store, ɵselectHasNextPage);
+  const isFetchingMoreThreads = useThreadStoreSelector(
     store,
     ɵselectIsFetchingNextPage,
   );
@@ -240,15 +260,15 @@ export function useThreads({
     [store],
   );
 
-  const fetchNextPage = useCallback(() => store.fetchNextPage(), [store]);
+  const fetchMoreThreads = useCallback(() => store.fetchNextPage(), [store]);
 
   return {
     threads,
     isLoading,
     error,
-    hasNextPage,
-    isFetchingNextPage,
-    fetchNextPage,
+    hasMoreThreads,
+    isFetchingMoreThreads,
+    fetchMoreThreads,
     renameThread,
     archiveThread,
     deleteThread,