Single-Turn State Machine: Idle to Stale
Explore how to build a single-turn state machine for chat UIs that explicitly manages message states like idle, generating, stopped, completed, error, and stale. Understand how to use a reducer to enforce state transitions and prevent mixed or delayed updates. This lesson helps you create predictable and stable streaming responses by controlling update permissions, user affordances, and error handling in real time.
A chat UI can look correct until timing shifts. The assistant is streaming tokens into the transcript, the user sends a second prompt quickly, and for a moment the visible assistant message contains mixed output from both turns. Nothing crashed, but the view accepted updates from two different requests.
That glitch happens because streaming makes UI state time-dependent. A delta arrives late, a paint happens later than expected, and the UI still applies an update even though the user has already moved on. Preventing it requires the UI to track more than messages. It must track turn, generation status, and whether incoming stream events are still allowed to mutate the visible assistant message.
The six states and their UI contracts
Once the mixed-output failure is visible, the next step is to name the smallest state machine that can forbid it. A single-turn state machine models one user send and the assistant response lifecycle, and it makes update permission explicit rather than implicit.
...