fixing client tool stalling (#58)

Author: jherr

examples/ts-react-chat/src/routes/api.tanchat.ts

@@ -2,7 +2,7 @@ import { createFileRoute } from '@tanstack/react-router'
 import { chat, maxIterations, toStreamResponse } from '@tanstack/ai'
 import { openai } from '@tanstack/ai-openai'
 // import { ollama } from "@tanstack/ai-ollama";
-import { anthropic } from '@tanstack/ai-anthropic'
+// import { anthropic } from '@tanstack/ai-anthropic'
 // import { gemini } from "@tanstack/ai-gemini";
 import { allTools } from '@/lib/guitar-tools'
 

packages/typescript/ai-client/src/chat-client.ts

@@ -15,7 +15,12 @@ import {
 } from './message-updaters'
 import { DefaultChatClientEventEmitter } from './events'
 import type { ModelMessage } from '@tanstack/ai'
-import type { ChatClientOptions, ToolCallPart, UIMessage } from './types'
+import type {
+  ChatClientOptions,
+  ToolCallPart,
+  ToolResultState,
+  UIMessage,
+} from './types'
 import type { ConnectionAdapter } from './connection-adapters'
 import type { ChunkStrategy, StreamParser } from './stream/types'
 import type { ChatClientEventEmitter } from './events'
@@ -392,17 +397,45 @@ export class ChatClient {
       result.state || 'output-available',
     )
 
-    // Update the tool call part with the output
-    this.setMessages(
-      updateToolCallWithOutput(
-        this.messages,
-        result.toolCallId,
-        result.output,
-        result.state === 'output-error' ? 'input-complete' : undefined,
-        result.errorText,
+    // Find the message containing this tool call
+    const messageWithToolCall = this.messages.find((msg) =>
+      msg.parts.some(
+        (p): p is ToolCallPart =>
+          p.type === 'tool-call' && p.id === result.toolCallId,
       ),
     )
 
+    // Step 1: Update the tool call part with the output
+    let updatedMessages = updateToolCallWithOutput(
+      this.messages,
+      result.toolCallId,
+      result.output,
+      result.state === 'output-error' ? 'input-complete' : undefined,
+      result.errorText,
+    )
+
+    // Step 2: Also create a tool-result part (needed for LLM conversation history)
+    if (messageWithToolCall) {
+      const content =
+        typeof result.output === 'string'
+          ? result.output
+          : JSON.stringify(result.output)
+      const toolResultState: ToolResultState = result.errorText
+        ? 'error'
+        : 'complete'
+
+      updatedMessages = updateToolResultPart(
+        updatedMessages,
+        messageWithToolCall.id,
+        result.toolCallId,
+        content,
+        toolResultState,
+        result.errorText,
+      )
+    }
+
+    this.setMessages(updatedMessages)
+
     // Check if we should auto-send
     if (this.shouldAutoSend()) {
       // Continue the flow without adding a new message

packages/typescript/ai-openai/src/openai-adapter.ts

@@ -275,6 +275,32 @@ export class OpenAI extends BaseAdapter<
           yield handleContentPart(contentPart)
         }
 
+        // handle content deltas - this is where streaming happens!
+        if (chunk.type === 'response.output_text.delta') {
+          accumulatedContent += chunk.delta
+          yield {
+            type: 'content',
+            id: responseId || generateId(),
+            model: model || options.model,
+            timestamp,
+            delta: chunk.delta,
+            content: accumulatedContent,
+            role: 'assistant',
+          }
+        }
+
+        if (chunk.type === 'response.reasoning_text.delta') {
+          accumulatedReasoning += chunk.delta
+          yield {
+            type: 'thinking',
+            id: responseId || generateId(),
+            model: model || options.model,
+            timestamp,
+            delta: chunk.delta,
+            content: accumulatedReasoning,
+          }
+        }
+
         if (chunk.type === 'response.content_part.done') {
           const contentPart = chunk.part