We’ve implemented createAgentUIStream and are using the timeout parameter to proactively set a timeout before a Vercel run times out in the backend (so we can adjust a job/chat status to “timeout”) before everything fails.
Problem
The last part is to communicate a timeout to the client / UI. Only I can’t seem to figure out how to communicate this to the UI / user?
Current Behavior
In the raw message stream to the browser, I see this:
data: {"type":"tool-output-available","toolCallId":"toolu_vrtx_012NzYgnvT59Qkfka5mcW113","output":"Transferred to agent-database-query"}
data: {"type":"finish-step"}
data: {"type":"abort","reason":"The operation was aborted due to timeout"}
data: [DONE]
But is there any way to capture this within the useChat function?
Hey, @turntwotech! Welcome to the Vercel Community.
From my research, I think that you can capture timeout events in the useChat hook by using the onError callback. When createAgentUIStream times out, it should trigger the error handler where you can check for timeout-specific errors. Like:
const { messages, input, handleInputChange, handleSubmit } = useChat({
api: '/api/chat',
onError: (error) => {
// Check if the error is related to timeout
if (error.message?.includes('timeout') || error.message?.includes('aborted')) {
// Handle timeout scenario
console.log('Chat timed out');
// Update UI state, show timeout message, etc.
}
},
onFinish: (message) => {
// This might not be called on timeout, so rely on onError
}
});