Merge pull request #60 from wtlyu/feat-autofocus

feat: auto focus
This commit is contained in:
Danny Avila 2023-03-13 13:15:43 -04:00 committed by GitHub
commit 6a16d31f26

View file

@ -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}