feat(chat): improve focus management for chat input after sending messages

This commit is contained in:
Abhimanyu Saharan
2026-02-07 15:30:07 +05:30
parent 7ec6506d72
commit 7ef1f3e2f8

View File

@@ -1,6 +1,6 @@
"use client"; "use client";
import { memo, useCallback, useState } from "react"; import { memo, useCallback, useEffect, useRef, useState } from "react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Textarea } from "@/components/ui/textarea"; import { Textarea } from "@/components/ui/textarea";
@@ -17,12 +17,22 @@ function BoardChatComposerImpl({
onSend, onSend,
}: BoardChatComposerProps) { }: BoardChatComposerProps) {
const [value, setValue] = useState(""); const [value, setValue] = useState("");
const textareaRef = useRef<HTMLTextAreaElement | null>(null);
const shouldFocusAfterSendRef = useRef(false);
useEffect(() => {
if (isSending) return;
if (!shouldFocusAfterSendRef.current) return;
shouldFocusAfterSendRef.current = false;
textareaRef.current?.focus();
}, [isSending]);
const send = useCallback(async () => { const send = useCallback(async () => {
if (isSending) return; if (isSending) return;
const trimmed = value.trim(); const trimmed = value.trim();
if (!trimmed) return; if (!trimmed) return;
const ok = await onSend(trimmed); const ok = await onSend(trimmed);
shouldFocusAfterSendRef.current = true;
if (ok) { if (ok) {
setValue(""); setValue("");
} }
@@ -31,6 +41,7 @@ function BoardChatComposerImpl({
return ( return (
<div className="mt-4 space-y-2"> <div className="mt-4 space-y-2">
<Textarea <Textarea
ref={textareaRef}
value={value} value={value}
onChange={(event) => setValue(event.target.value)} onChange={(event) => setValue(event.target.value)}
onKeyDown={(event) => { onKeyDown={(event) => {