Why show reasoning
Showing model reasoning builds user trust and helps with debugging. Users can understand why the model made certain decisions.
The Gateway API can stream reasoning tokens separately from final outputs, enabling "thinking" animations in your UI.
Streaming reasoning tokens
The Gateway API streams thinking tokens with a distinct event type. Handle these separately from content tokens in your UI.
const eventSource = new EventSource('/v1/chat/completions?stream=true');
eventSource.onmessage = (event) => {
const data = JSON.parse(event.data);
if (data.type === 'thinking') {
updateThinkingUI(data.content);
} else if (data.type === 'content') {
updateResponseUI(data.content);
}
};UX patterns for reasoning display
Design your UI to show reasoning in a way that builds trust without overwhelming users.
- Use a collapsible section for detailed reasoning.
- Show a brief summary or "thinking..." indicator.
- Allow users to expand full reasoning on demand.
- Consider hiding reasoning for simple queries.