Real-time Streaming

POST /api/v1/chat/completions
Content-Type: application/json

{
  "session_id": "session-uuid",
  "message": "Summarize the Q4 report",
  "stream": true
}

event: <event_type>
data: <json_payload>

event: message_start
data: {"conversation_id": "abc-123", "message_id": "msg-456"}

event: llm_call_start
data: {"model": "gpt-4o", "provider": "openai"}

event: agent_tool_call
data: {"tool_name": "search_knowledge", "arguments": {"query": "Q4 revenue figures"}}

event: agent_tool_result
data: {"tool_name": "search_knowledge", "result": "Q4 revenue was $12.3M, up 15% YoY..."}

event: agent_thinking
data: {"content": "The knowledge base contains the Q4 figures. Let me summarize the key points."}

event: text_chunk
data: {"content": "Based on the Q4 report, "}

event: text_chunk
data: {"content": "revenue reached $12.3 million, "}

event: text_chunk
data: {"content": "representing a 15% year-over-year increase."}

event: llm_call_end
data: {"model": "gpt-4o", "latency_ms": 1240}

event: token_usage
data: {"prompt_tokens": 850, "completion_tokens": 62, "total_tokens": 912}

event: cost_update
data: {"cost_usd": 0.0048, "model": "gpt-4o"}

event: suggested_questions
data: {"questions": ["What drove the revenue growth?", "How does Q4 compare to Q3?", "What are the projections for next quarter?"]}

event: done
data: {}

ws://localhost:8000/ws/chat/{session_id}

const ws = new WebSocket(`ws://localhost:8000/ws/chat/${sessionId}`);

// Receive events from the server
ws.onmessage = (event) => {
  const data = JSON.parse(event.data);
  switch (data.type) {
    case 'text_chunk':
      appendToResponse(data.content);
      break;
    case 'agent_tool_call':
      showToolInvocation(data.tool_name, data.arguments);
      break;
    case 'done':
      finalizeResponse();
      break;
  }
};

// Send a message to the agent
ws.send(JSON.stringify({
  type: 'message',
  content: 'What are the key takeaways from the report?'
}));

// Cancel an in-progress response
ws.send(JSON.stringify({
  type: 'cancel'
}));

import { useAgentSSE } from '@/hooks/useAgentSSE';

function ChatPanel({ sessionId }) {
  const {
    sendMessage,
    response,        // accumulated response text
    isStreaming,     // whether a response is in progress
    toolCalls,       // list of tool calls with results
    tokenUsage,      // { prompt_tokens, completion_tokens, total_tokens }
    suggestedQuestions,
    error,
  } = useAgentSSE(sessionId);

  return (
    <div>
      <MessageList messages={response} />
      {isStreaming && <StreamingIndicator />}
      {toolCalls.map(tc => <ToolCallCard key={tc.id} {...tc} />)}
      {suggestedQuestions && <SuggestionChips questions={suggestedQuestions} />}
      <MessageInput onSend={sendMessage} disabled={isStreaming} />
    </div>
  );
}

import { AgentExecutionMonitor } from '@/components/AgentExecutionMonitor';

function WorkflowChat({ sessionId }) {
  return (
    <div>
      <ChatPanel sessionId={sessionId} />
      <AgentExecutionMonitor
        sessionId={sessionId}
        showNodeDetails={true}
        showTokenUsage={true}
        collapsible={true}
      />
    </div>
  );
}

event: error
data: {"code": "rate_limit", "message": "OpenAI rate limit exceeded. Retrying in 5 seconds."}