fix: textarea should resize after sending

This commit is contained in:
0xSage 2023-10-13 15:32:43 +08:00
parent 855e9ee9df
commit 0180937262

View File

@ -18,6 +18,8 @@ const BasicPromptInput: React.FC = () => {
const { initModel } = useInitModel(); const { initModel } = useInitModel();
const textareaRef = useRef<HTMLTextAreaElement>(null);
const handleKeyDown = async ( const handleKeyDown = async (
event: React.KeyboardEvent<HTMLTextAreaElement> event: React.KeyboardEvent<HTMLTextAreaElement>
) => { ) => {
@ -40,12 +42,19 @@ const BasicPromptInput: React.FC = () => {
} }
}; };
useEffect(() => {
adjustTextareaHeight();
}, [currentPrompt]);
const handleMessageChange = (event: ChangeEvent<HTMLTextAreaElement>) => {
setCurrentPrompt(event.target.value);
};
// Auto adjust textarea height based on content // Auto adjust textarea height based on content
const textareaRef = useRef<HTMLTextAreaElement>(null);
const MAX_ROWS = 10; const MAX_ROWS = 10;
const adjustTextareaHeight = () => { const adjustTextareaHeight = () => {
if (textareaRef.current) { if (textareaRef.current) {
textareaRef.current.style.height = "auto"; textareaRef.current.style.height = "auto"; // 1 row
const scrollHeight = textareaRef.current.scrollHeight; const scrollHeight = textareaRef.current.scrollHeight;
const maxScrollHeight = const maxScrollHeight =
parseInt(window.getComputedStyle(textareaRef.current).lineHeight, 10) * parseInt(window.getComputedStyle(textareaRef.current).lineHeight, 10) *
@ -57,15 +66,6 @@ const BasicPromptInput: React.FC = () => {
} }
}; };
useEffect(() => {
adjustTextareaHeight();
}, []);
const handleMessageChange = (event: ChangeEvent<HTMLTextAreaElement>) => {
setCurrentPrompt(event.target.value);
adjustTextareaHeight();
};
return ( return (
<div className="overflow-hidden rounded-lg shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-indigo-600"> <div className="overflow-hidden rounded-lg shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-indigo-600">
<textarea <textarea