autofocus textarea (#103)
This commit is contained in:
		
							parent
							
								
									42c48f290f
								
							
						
					
					
						commit
						7ce2d5ec2c
					
				|  | @ -27,6 +27,8 @@ export const Chat: FC<Props> = ({ conversation, models, apiKey, messageIsStreami | |||
| 
 | ||||
|   const messagesEndRef = useRef<HTMLDivElement>(null); | ||||
|   const chatContainerRef = useRef<HTMLDivElement>(null); | ||||
|   const textareaRef = useRef<HTMLTextAreaElement>(null); | ||||
| 
 | ||||
| 
 | ||||
|   const scrollToBottom = () => { | ||||
|     if (autoScrollEnabled) { | ||||
|  | @ -49,6 +51,8 @@ export const Chat: FC<Props> = ({ conversation, models, apiKey, messageIsStreami | |||
| 
 | ||||
|   useEffect(() => { | ||||
|     scrollToBottom(); | ||||
|     textareaRef.current?.focus() | ||||
| 
 | ||||
|   }, [conversation.messages]); | ||||
| 
 | ||||
|   useEffect(() => { | ||||
|  | @ -136,6 +140,7 @@ export const Chat: FC<Props> = ({ conversation, models, apiKey, messageIsStreami | |||
|           ) : ( | ||||
|             <ChatInput | ||||
|               stopConversationRef={stopConversationRef} | ||||
|               textareaRef={textareaRef} | ||||
|               messageIsStreaming={messageIsStreaming} | ||||
|               onSend={(message) => { | ||||
|                 setCurrentMessage(message); | ||||
|  |  | |||
|  | @ -7,14 +7,13 @@ interface Props { | |||
|   onSend: (message: Message) => void; | ||||
|   model: OpenAIModel; | ||||
|   stopConversationRef: MutableRefObject<boolean>; | ||||
|   textareaRef: MutableRefObject<HTMLTextAreaElement | null>; | ||||
| } | ||||
| 
 | ||||
| export const ChatInput: FC<Props> = ({ onSend, messageIsStreaming, model, stopConversationRef }) => { | ||||
| export const ChatInput: FC<Props> = ({ onSend, messageIsStreaming, model, stopConversationRef, textareaRef }) => { | ||||
|   const [content, setContent] = useState<string>(); | ||||
|   const [isTyping, setIsTyping] = useState<boolean>(false); | ||||
| 
 | ||||
|   const textareaRef = useRef<HTMLTextAreaElement>(null); | ||||
| 
 | ||||
|   const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => { | ||||
|     const value = e.target.value; | ||||
|     const maxLength = model.id === OpenAIModelID.GPT_3_5 ? 12000 : 24000; | ||||
|  | @ -68,6 +67,7 @@ export const ChatInput: FC<Props> = ({ onSend, messageIsStreaming, model, stopCo | |||
|     } | ||||
|   }, [content]); | ||||
| 
 | ||||
| 
 | ||||
|   function handleStopConversation() { | ||||
|     stopConversationRef.current = true; | ||||
|     setTimeout(() => { | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue