fix(frontend): Refocus ChatInput after voice transcription completes

This allows users to immediately use spacebar+enter to record and send
their prompt after transcription finishes, improving the voice input UX.
This commit is contained in:
Otto
2026-01-30 05:04:20 +00:00
parent 3b822cdaf7
commit 715384eb06
2 changed files with 11 additions and 1 deletions

View File

@@ -57,6 +57,7 @@ export function ChatInput({
isStreaming,
value,
baseHandleKeyDown,
inputId,
});
return (

View File

@@ -15,6 +15,7 @@ interface Args {
isStreaming?: boolean;
value: string;
baseHandleKeyDown: (event: KeyboardEvent<HTMLTextAreaElement>) => void;
inputId?: string;
}
export function useVoiceRecording({
@@ -23,6 +24,7 @@ export function useVoiceRecording({
isStreaming = false,
value,
baseHandleKeyDown,
inputId,
}: Args) {
const [isRecording, setIsRecording] = useState(false);
const [isTranscribing, setIsTranscribing] = useState(false);
@@ -101,9 +103,16 @@ export function useVoiceRecording({
console.error("Transcription error:", err);
} finally {
setIsTranscribing(false);
// Refocus the input after transcription so user can continue typing or send
if (inputId) {
const inputElement = document.getElementById(inputId);
if (inputElement) {
inputElement.focus();
}
}
}
},
[handleTranscription],
[handleTranscription, inputId],
);
const stopRecording = useCallback(() => {