This question evaluates debugging and implementation skills across frontend-backend interaction, including authentication/configuration, client-side state management, streamed response handling, request cancellation, and reasoning about API payload contracts.
You are given a small codebase for a web chat UI that calls an LLM API (similar to a ChatGPT-style interface). You can run it locally. During a 60-minute interview, you must debug issues and implement small features.
Assume a typical setup:
When starting the app and sending a message, the browser console (or network response) shows an error like api key invalid.
After submitting a message, the UI receives a response but renders empty content.
Add a button that clears:
You are told the store already has an action/helper that can reset/initialize state—use it rather than re-implementing.
Add a button (like the “stop generating” square icon) that, while an assistant response is streaming, immediately stops/cancels the in-flight stream and leaves the partially-generated text as-is (or per your chosen UX, but be consistent).
Consider:
isStreaming
,
currentRequestId
)
AbortController
)