@tambo-ai/react 0.73.0 → 0.74.0

package/dist/v1/hooks/use-tambo-v1.test.js

@@ -1,21 +1,63 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_query_1 = require("@tanstack/react-query");
 const react_1 = require("@testing-library/react");
-const react_2 = __importDefault(require("react"));
+const react_2 = __importStar(require("react"));
 const tambo_client_provider_1 = require("../../providers/tambo-client-provider");
 const tambo_registry_provider_1 = require("../../providers/tambo-registry-provider");
 const tambo_v1_stream_context_1 = require("../providers/tambo-v1-stream-context");
+const event_accumulator_1 = require("../utils/event-accumulator");
 const use_tambo_v1_1 = require("./use-tambo-v1");
 jest.mock("../../providers/tambo-client-provider", () => ({
     useTamboClient: jest.fn(),
+    useTamboQueryClient: jest.fn(),
 }));
+const tambo_client_provider_2 = require("../../providers/tambo-client-provider");
 describe("useTamboV1", () => {
+    let queryClient;
     const mockTamboClient = {
         apiKey: "",
-        threads: {},
+        threads: {
+            messages: {
+                list: jest.fn().mockResolvedValue({ messages: [], hasMore: false }),
+            },
+            runs: {
+                delete: jest.fn().mockResolvedValue({}),
+            },
+        },
     };
     const mockRegistry = {
         componentList: {},
@@ -35,11 +77,35 @@ describe("useTamboV1", () => {
         registerResourceSource: jest.fn(),
     };
     function TestWrapper({ children }) {
-        return (react_2.default.createElement(tambo_registry_provider_1.TamboRegistryContext.Provider, { value: mockRegistry },
-            react_2.default.createElement(tambo_v1_stream_context_1.TamboV1StreamProvider, null, children)));
+        return (react_2.default.createElement(react_query_1.QueryClientProvider, { client: queryClient },
+            react_2.default.createElement(tambo_registry_provider_1.TamboRegistryContext.Provider, { value: mockRegistry },
+                react_2.default.createElement(tambo_v1_stream_context_1.TamboV1StreamProvider, null, children))));
+    }
+    function createWrapperWithState(state, registry = mockRegistry) {
+        const noopDispatch = () => { };
+        return function WrapperWithState({ children, }) {
+            return (react_2.default.createElement(react_query_1.QueryClientProvider, { client: queryClient },
+                react_2.default.createElement(tambo_registry_provider_1.TamboRegistryContext.Provider, { value: registry },
+                    react_2.default.createElement(tambo_v1_stream_context_1.TamboV1StreamProvider, { state: state, dispatch: noopDispatch }, children))));
+        };
+    }
+    // Wrapper that uses the real reducer so state updates properly
+    function createWrapperWithRealReducer(initialState) {
+        return function WrapperWithRealReducer({ children, }) {
+            const [state, dispatch] = (0, react_2.useReducer)(event_accumulator_1.streamReducer, initialState);
+            return (react_2.default.createElement(react_query_1.QueryClientProvider, { client: queryClient },
+                react_2.default.createElement(tambo_registry_provider_1.TamboRegistryContext.Provider, { value: mockRegistry },
+                    react_2.default.createElement(tambo_v1_stream_context_1.TamboV1StreamProvider, { state: state, dispatch: dispatch }, children))));
+        };
     }
     beforeEach(() => {
+        queryClient = new react_query_1.QueryClient({
+            defaultOptions: {
+                queries: { retry: false },
+            },
+        });
         jest.mocked(tambo_client_provider_1.useTamboClient).mockReturnValue(mockTamboClient);
+        jest.mocked(tambo_client_provider_2.useTamboQueryClient).mockReturnValue(queryClient);
         jest.clearAllMocks();
     });
     it("returns client from useTamboClient", () => {
@@ -58,20 +124,23 @@ describe("useTamboV1", () => {
         expect(result.current.componentList).toBe(mockRegistry.componentList);
         expect(result.current.toolRegistry).toBe(mockRegistry.toolRegistry);
     });
-    it("returns undefined thread when no threadId provided", () => {
+    it("returns placeholder thread when no threadId provided", () => {
         const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
             wrapper: TestWrapper,
         });
-        expect(result.current.thread).toBeUndefined();
+        // Default state has placeholder thread for optimistic UI
+        expect(result.current.thread).toBeDefined();
+        expect(result.current.thread?.thread.id).toBe("placeholder");
         expect(result.current.messages).toEqual([]);
     });
-    it("returns thread state when threadId provided", () => {
-        const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)("thread_123"), {
+    it("returns thread state when switched to a thread", () => {
+        const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
             wrapper: TestWrapper,
         });
-        // Initialize thread first
+        // Initialize and switch to thread
         (0, react_1.act)(() => {
             result.current.initThread("thread_123");
+            result.current.switchThread("thread_123");
         });
         expect(result.current.thread).toBeDefined();
         expect(result.current.thread?.thread.id).toBe("thread_123");
@@ -87,12 +156,13 @@ describe("useTamboV1", () => {
         expect(result.current.isWaiting).toBe(false);
     });
     it("returns thread streaming state when thread loaded", () => {
-        const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)("thread_123"), {
+        const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
             wrapper: TestWrapper,
         });
-        // Initialize thread first
+        // Initialize and switch to thread
         (0, react_1.act)(() => {
             result.current.initThread("thread_123");
+            result.current.switchThread("thread_123");
         });
         expect(result.current.streamingState.status).toBe("idle");
         expect(result.current.isIdle).toBe(true);
@@ -117,9 +187,10 @@ describe("useTamboV1", () => {
         const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
             wrapper: TestWrapper,
         });
-        // Initially no current thread
-        expect(result.current.currentThreadId).toBeNull();
-        expect(result.current.thread).toBeUndefined();
+        // Initially has placeholder thread for optimistic UI
+        expect(result.current.currentThreadId).toBe("placeholder");
+        expect(result.current.thread).toBeDefined();
+        expect(result.current.thread?.thread.id).toBe("placeholder");
         // Initialize a new thread
         (0, react_1.act)(() => {
             result.current.initThread("new_thread_1");
@@ -138,7 +209,7 @@ describe("useTamboV1", () => {
         (0, react_1.act)(() => {
             newThreadId = result.current.startNewThread();
         });
-        expect(newThreadId).toMatch(/^temp_/);
+        expect(newThreadId).toBe("placeholder");
         expect(result.current.currentThreadId).toBe(newThreadId);
         expect(result.current.thread).toBeDefined();
     });
@@ -155,5 +226,807 @@ describe("useTamboV1", () => {
         expect(result.current.currentThreadId).toBe("thread_123");
         expect(result.current.thread?.thread.id).toBe("thread_123");
     });
+    describe("component content transformation", () => {
+        const createComponentContent = (id, name, props) => ({
+            type: "component",
+            id,
+            name,
+            props,
+            streamingState: "done",
+        });
+        it("adds renderedComponent to component content blocks", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        createComponentContent("comp_1", "TestComponent", {
+                                            title: "Hello",
+                                        }),
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            expect(result.current.messages).toHaveLength(1);
+            const content = result.current.messages[0].content[0];
+            expect(content.type).toBe("component");
+            expect(content.renderedComponent).toBeDefined();
+        });
+        it("preserves non-component content blocks unchanged", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        { type: "text", text: "Hello world" },
+                                        createComponentContent("comp_1", "TestComponent", {
+                                            title: "Hi",
+                                        }),
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            expect(result.current.messages).toHaveLength(1);
+            const textContent = result.current.messages[0].content[0];
+            expect(textContent.type).toBe("text");
+            expect(textContent).toEqual({ type: "text", text: "Hello world" });
+            const componentContent = result.current.messages[0].content[1];
+            expect(componentContent.type).toBe("component");
+            expect(componentContent.renderedComponent).toBeDefined();
+        });
+        it("caches rendered components and returns same reference when props unchanged", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        createComponentContent("comp_1", "TestComponent", {
+                                            title: "Hello",
+                                        }),
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result, rerender } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const firstRender = result.current.messages[0].content[0].renderedComponent;
+            // Re-render with same state
+            rerender();
+            const secondRender = result.current.messages[0].content[0].renderedComponent;
+            // Should return the same cached element reference
+            expect(secondRender).toBe(firstRender);
+        });
+        it("handles empty props on components", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        createComponentContent("comp_1", "TestComponent", {}),
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.type).toBe("component");
+            expect(content.renderedComponent).toBeDefined();
+        });
+        it("handles undefined props on components", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "component",
+                                            id: "comp_1",
+                                            name: "TestComponent",
+                                            props: undefined,
+                                            streamingState: "done",
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.type).toBe("component");
+            expect(content.renderedComponent).toBeDefined();
+        });
+        it("handles multiple component content blocks in same message", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        createComponentContent("comp_1", "ComponentA", {
+                                            value: 1,
+                                        }),
+                                        createComponentContent("comp_2", "ComponentB", {
+                                            value: 2,
+                                        }),
+                                        createComponentContent("comp_3", "ComponentC", {
+                                            value: 3,
+                                        }),
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            expect(result.current.messages[0].content).toHaveLength(3);
+            result.current.messages[0].content.forEach((content) => {
+                expect(content.type).toBe("component");
+                expect(content.renderedComponent).toBeDefined();
+            });
+        });
+        it("uses currentThreadId from stream state", () => {
+            const state = {
+                threadMap: {
+                    placeholder: {
+                        thread: {
+                            id: "placeholder",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        createComponentContent("comp_1", "TestComponent", {
+                                            title: "Hello",
+                                        }),
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "placeholder",
+            };
+            // No explicit threadId - uses currentThreadId from state
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            // Component should render using the placeholder thread
+            const content = result.current.messages[0].content[0];
+            expect(content.type).toBe("component");
+            expect(content.renderedComponent).toBeDefined();
+        });
+    });
+    describe("tool_use content transformation", () => {
+        it("adds computed properties to tool_use content", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getWeather",
+                                            input: { location: "NYC" },
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.type).toBe("tool_use");
+            expect(content.hasCompleted).toBe(false);
+            expect(content.statusMessage).toBe("Calling getWeather");
+            expect(content.tamboDisplayProps).toBeDefined();
+        });
+        it("sets hasCompleted to true when matching tool_result exists", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getWeather",
+                                            input: { location: "NYC" },
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                                {
+                                    id: "msg_2",
+                                    role: "user",
+                                    content: [
+                                        {
+                                            type: "tool_result",
+                                            toolUseId: "tool_1",
+                                            content: [{ type: "text", text: "Sunny" }],
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.hasCompleted).toBe(true);
+            expect(content.statusMessage).toBe("Called getWeather");
+        });
+        it("uses _tambo_statusMessage when tool is in progress", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getWeather",
+                                            input: {
+                                                location: "NYC",
+                                                _tambo_statusMessage: "Fetching weather for NYC...",
+                                            },
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.statusMessage).toBe("Fetching weather for NYC...");
+            expect(content.tamboDisplayProps?._tambo_statusMessage).toBe("Fetching weather for NYC...");
+        });
+        it("uses _tambo_completionStatusMessage when tool is completed", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getWeather",
+                                            input: {
+                                                location: "NYC",
+                                                _tambo_statusMessage: "Fetching weather...",
+                                                _tambo_completionStatusMessage: "Got weather for NYC",
+                                            },
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                                {
+                                    id: "msg_2",
+                                    role: "user",
+                                    content: [
+                                        {
+                                            type: "tool_result",
+                                            toolUseId: "tool_1",
+                                            content: [{ type: "text", text: "Sunny" }],
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.hasCompleted).toBe(true);
+            expect(content.statusMessage).toBe("Got weather for NYC");
+        });
+        it("filters _tambo_* properties from input", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getWeather",
+                                            input: {
+                                                location: "NYC",
+                                                units: "celsius",
+                                                _tambo_statusMessage: "Fetching...",
+                                                _tambo_completionStatusMessage: "Done",
+                                                _tambo_displayMessage: "Weather lookup",
+                                            },
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            // Input should only have non-_tambo_ properties
+            expect(content.input).toEqual({ location: "NYC", units: "celsius" });
+            expect(content.input._tambo_statusMessage).toBeUndefined();
+            expect(content.input._tambo_completionStatusMessage).toBeUndefined();
+            expect(content.input._tambo_displayMessage).toBeUndefined();
+        });
+        it("handles tool_use with empty input", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getCurrentTime",
+                                            input: {},
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.input).toEqual({});
+            expect(content.hasCompleted).toBe(false);
+            expect(content.statusMessage).toBe("Calling getCurrentTime");
+        });
+        it("handles tool_use with undefined input", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getCurrentTime",
+                                            input: undefined,
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const content = result.current.messages[0].content[0];
+            expect(content.input).toEqual({});
+            expect(content.hasCompleted).toBe(false);
+        });
+        it("handles multiple tool_use blocks with different completion states", () => {
+            const state = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [
+                                {
+                                    id: "msg_1",
+                                    role: "assistant",
+                                    content: [
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_1",
+                                            name: "getWeather",
+                                            input: { location: "NYC" },
+                                        },
+                                        {
+                                            type: "tool_use",
+                                            id: "tool_2",
+                                            name: "getTime",
+                                            input: { timezone: "EST" },
+                                        },
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                                {
+                                    id: "msg_2",
+                                    role: "user",
+                                    content: [
+                                        {
+                                            type: "tool_result",
+                                            toolUseId: "tool_1",
+                                            content: [{ type: "text", text: "Sunny" }],
+                                        },
+                                        // tool_2 has no result yet
+                                    ],
+                                    createdAt: new Date().toISOString(),
+                                },
+                            ],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithState(state),
+            });
+            const tool1 = result.current.messages[0].content[0];
+            const tool2 = result.current.messages[0].content[1];
+            expect(tool1.hasCompleted).toBe(true);
+            expect(tool1.statusMessage).toBe("Called getWeather");
+            expect(tool2.hasCompleted).toBe(false);
+            expect(tool2.statusMessage).toBe("Calling getTime");
+        });
+    });
+    describe("cancelRun", () => {
+        it("sets thread to idle and lastRunCancelled to true when cancelled", async () => {
+            const initialState = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [],
+                            status: "streaming",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "streaming", runId: "run_456" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithRealReducer(initialState),
+            });
+            // Before cancel: streaming and lastRunCancelled is false
+            expect(result.current.isStreaming).toBe(true);
+            expect(result.current.isIdle).toBe(false);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(false);
+            await (0, react_1.act)(async () => {
+                await result.current.cancelRun();
+            });
+            // After cancel: idle and lastRunCancelled is true
+            expect(result.current.isStreaming).toBe(false);
+            expect(result.current.isIdle).toBe(true);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(true);
+            // Verify API was called to cancel the run
+            expect(mockTamboClient.threads.runs.delete).toHaveBeenCalledWith("run_456", { threadId: "thread_123" });
+        });
+        it("is a no-op when there is no active run", async () => {
+            const initialState = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [],
+                            status: "idle",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "idle" }, // No runId
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithRealReducer(initialState),
+            });
+            // Idle before
+            expect(result.current.isIdle).toBe(true);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(false);
+            await (0, react_1.act)(async () => {
+                await result.current.cancelRun();
+            });
+            // Still idle, lastRunCancelled unchanged
+            expect(result.current.isIdle).toBe(true);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(false);
+            // API should not have been called
+            expect(mockTamboClient.threads.runs.delete).not.toHaveBeenCalled();
+        });
+        it("is a no-op when on a placeholder thread", async () => {
+            const initialState = {
+                threadMap: {
+                    placeholder: {
+                        thread: {
+                            id: "placeholder",
+                            messages: [],
+                            status: "streaming",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "streaming", runId: "run_123" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "placeholder",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithRealReducer(initialState),
+            });
+            // Before: streaming on placeholder
+            expect(result.current.isStreaming).toBe(true);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(false);
+            await (0, react_1.act)(async () => {
+                await result.current.cancelRun();
+            });
+            // After: state should be unchanged (placeholder threads are skipped)
+            expect(result.current.isStreaming).toBe(true);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(false);
+            // API should not have been called for placeholder threads
+            expect(mockTamboClient.threads.runs.delete).not.toHaveBeenCalled();
+        });
+        it("still updates local state even if API call fails", async () => {
+            const consoleWarnSpy = jest
+                .spyOn(console, "warn")
+                .mockImplementation(() => { });
+            // Make the API call fail
+            jest
+                .mocked(mockTamboClient.threads.runs.delete)
+                .mockRejectedValueOnce(new Error("Network error"));
+            const initialState = {
+                threadMap: {
+                    thread_123: {
+                        thread: {
+                            id: "thread_123",
+                            messages: [],
+                            status: "streaming",
+                            createdAt: new Date().toISOString(),
+                            updatedAt: new Date().toISOString(),
+                            lastRunCancelled: false,
+                        },
+                        streaming: { status: "streaming", runId: "run_456" },
+                        accumulatingToolArgs: new Map(),
+                    },
+                },
+                currentThreadId: "thread_123",
+            };
+            const { result } = (0, react_1.renderHook)(() => (0, use_tambo_v1_1.useTamboV1)(), {
+                wrapper: createWrapperWithRealReducer(initialState),
+            });
+            await (0, react_1.act)(async () => {
+                await result.current.cancelRun();
+            });
+            // Local state should still be updated (optimistic update)
+            expect(result.current.isIdle).toBe(true);
+            expect(result.current.thread?.thread.lastRunCancelled).toBe(true);
+            // Warning should have been logged
+            expect(consoleWarnSpy).toHaveBeenCalledWith("Failed to cancel run on server:", expect.any(Error));
+            consoleWarnSpy.mockRestore();
+        });
+    });
 });
 //# sourceMappingURL=use-tambo-v1.test.js.map