From 5075f21fe3127152186e946fe1240f7d6ce1619e Mon Sep 17 00:00:00 2001 From: Adam Cohen Hillel Date: Thu, 17 Apr 2025 02:29:59 +0100 Subject: [PATCH] streaming almost working again, no rendering and still buggy --- .../app/dashboard/agents/[threadId]/page.tsx | 100 +++++++++++++++--- 1 file changed, 86 insertions(+), 14 deletions(-) diff --git a/frontend/src/app/dashboard/agents/[threadId]/page.tsx b/frontend/src/app/dashboard/agents/[threadId]/page.tsx index a58042f9..cca135c1 100644 --- a/frontend/src/app/dashboard/agents/[threadId]/page.tsx +++ b/frontend/src/app/dashboard/agents/[threadId]/page.tsx @@ -363,6 +363,9 @@ export default function ThreadPage({ params }: { params: Promise } message?: string; name?: string; arguments?: string; + finish_reason?: string; + function_name?: string; + xml_tag_name?: string; tool_call?: { id: string; function: { @@ -374,7 +377,10 @@ export default function ThreadPage({ params }: { params: Promise } }; } | null = null; - let currentLiveToolCall: ToolCallData | null = null; + // Handle data: prefix format (SSE standard) + if (processedData.startsWith('data: ')) { + processedData = processedData.substring(6).trim(); + } try { jsonData = JSON.parse(processedData); @@ -416,11 +422,74 @@ export default function ThreadPage({ params }: { params: Promise } setAgentRunId(null); return; } + + // Handle finish message + if (jsonData?.type === 'finish') { + console.log(`[PAGE] Received finish message with reason: ${jsonData.finish_reason}`); + // If there's a specific finish reason, handle it + if (jsonData.finish_reason === 'xml_tool_limit_reached') { + // Potentially show a toast notification + toast.info('Tool execution limit reached. The agent will continue with available information.'); + } + return; + } + + // Handle content type messages (text from the agent) + if (jsonData?.type === 'content' && jsonData?.content) { + console.log('[PAGE] Adding content to stream:', jsonData.content); + setStreamContent(prev => prev + jsonData.content); + return; + } + + // Handle tool status messages + if (jsonData?.type === 'tool_status') { + console.log(`[PAGE] Tool status: ${jsonData.status} for ${jsonData.function_name}`); + + // Update UI based on tool status + if (jsonData.status === 'started') { + // Could show a loading indicator for the specific tool + const toolInfo = { + id: jsonData.xml_tag_name || `tool-${Date.now()}`, + name: jsonData.function_name || 'unknown', + arguments: '{}', + index: 0, + }; + + setToolCallData(toolInfo); + // Optionally add to stream content to show tool execution + setStreamContent(prev => + prev + `\n\nExecuting tool: ${jsonData.function_name}\n` + ); + } else if (jsonData.status === 'completed') { + // Update UI to show tool completion + setToolCallData(null); + // Optionally add to stream content + setStreamContent(prev => + prev + `\nTool execution completed: ${jsonData.function_name}\n` + ); + } + return; + } + + // Handle tool result messages + if (jsonData?.type === 'tool_result') { + console.log('[PAGE] Received tool result for:', jsonData.function_name); + + // Clear the tool data since execution is complete + setSidePanelContent(null); + setToolCallData(null); + + // Add tool result to the stream content for visibility + setStreamContent(prev => + prev + `\nReceived result from ${jsonData.function_name}\n` + ); + return; + } // --- Handle Live Tool Call Updates for Side Panel --- if (jsonData?.type === 'tool_call' && jsonData.tool_call) { console.log('[PAGE] Received tool_call update:', jsonData.tool_call); - currentLiveToolCall = { + const currentLiveToolCall: ToolCallData = { id: jsonData.tool_call.id, name: jsonData.tool_call.function.name, arguments: jsonData.tool_call.function.arguments, @@ -429,25 +498,28 @@ export default function ThreadPage({ params }: { params: Promise } setToolCallData(currentLiveToolCall); // Keep for stream content rendering setCurrentPairIndex(null); // Live data means not viewing a historical pair setSidePanelContent(currentLiveToolCall); // Update side panel + + // Add to stream content so it's visible + setStreamContent(prev => + prev + `\nCalling tool: ${currentLiveToolCall.name}\n` + ); + if (!isSidePanelOpen) { // Optionally auto-open side panel? Maybe only if user hasn't closed it recently. // setIsSidePanelOpen(true); } - } else if (jsonData?.type === 'tool_result') { - // When tool result comes in, clear the live tool from side panel? - // Or maybe wait until stream end? - console.log('[PAGE] Received tool_result, clearing live tool from side panel'); - setSidePanelContent(null); - setToolCallData(null); - // Don't necessarily clear currentPairIndex here, user might want to navigate back + return; } - // --- End Side Panel Update Logic --- + + // If we reach here and have JSON data but it's not a recognized type, + // log it for debugging purposes + console.log('[PAGE] Unhandled message type:', jsonData?.type); + } catch (e) { - console.warn('[PAGE] Failed to parse message:', e); + // If JSON parsing fails, treat it as raw text content + console.warn('[PAGE] Failed to parse as JSON, treating as raw content:', e); + setStreamContent(prev => prev + processedData); } - - // Continue with normal message processing... - // ... rest of the onMessage handler ... } catch (error) { console.error('[PAGE] Error processing message:', error); toast.error('Failed to process agent response');