From 8affbfdb4aed6bbc6a29ebf5e77273090f553590 Mon Sep 17 00:00:00 2001
From: Wentao Lyu <35-wentao.lyu@users.noreply.git.stereye.tech>
Date: Tue, 14 Mar 2023 01:12:11 +0800
Subject: [PATCH] feat: auto focus

---
 client/src/components/Main/TextChat.jsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/client/src/components/Main/TextChat.jsx b/client/src/components/Main/TextChat.jsx
index 41c9d35b5c..12efc7c123 100644
--- a/client/src/components/Main/TextChat.jsx
+++ b/client/src/components/Main/TextChat.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { SSE } from '~/utils/sse';
 import SubmitButton from './SubmitButton';
 import Regenerate from './Regenerate';
@@ -14,6 +14,7 @@ import { setText } from '~/store/textSlice';
 
 export default function TextChat({ messages }) {
   const [errorMessage, setErrorMessage] = useState('');
+  const inputRef = useRef(null)
   const dispatch = useDispatch();
   const convo = useSelector((state) => state.convo);
   const { initial } = useSelector((state) => state.models);
@@ -22,6 +23,11 @@ export default function TextChat({ messages }) {
   const { text } = useSelector((state) => state.text);
   const { error } = convo;
 
+  // auto focus to input, when enter a conversation.
+  useEffect(() => {
+    inputRef.current?.focus();
+  }, [convo?.conversationId, ])
+
   const messageHandler = (data, currentState) => {
     const { messages, currentMsg, sender } = currentState;
     dispatch(setMessages([...messages, currentMsg, { sender, text: data }]));
@@ -282,6 +288,8 @@ export default function TextChat({ messages }) {
               <ModelMenu />
               <TextareaAutosize
                 tabIndex="0"
+                autoFocus
+                ref={inputRef}
                 // style={{maxHeight: '200px', height: '24px', overflowY: 'hidden'}}
                 rows="1"
                 value={text}