Refactor AIChat and MentionTextArea components to improve focus handl…

…ing and input management. Introduced focusRef in AIChat for better input focus control after chat creation and selection. Updated MentionTextArea to support focus registration, enhancing user experience during text input. This update streamlines chat interactions and ensures a more intuitive interface for users.

packages/xgen/layouts/components/Neo/components/AIChat/MentionTextArea/index.tsx

@@ -12,6 +12,7 @@ interface MentionTextAreaProps {
 	placeholder?: string
 	autoSize?: { minRows: number; maxRows: number }
 	clear?: (fn: () => void) => void
+	focus?: (fn: () => void) => void
 }
 
 const MentionTextArea: React.FC<MentionTextAreaProps> = ({
@@ -22,7 +23,8 @@ const MentionTextArea: React.FC<MentionTextAreaProps> = ({
 	onPaste,
 	placeholder,
 	autoSize = { minRows: 4, maxRows: 16 },
-	clear
+	clear,
+	focus
 }) => {
 	const [mentionListVisible, setMentionListVisible] = useState(false)
 	const [mentionKeyword, setMentionKeyword] = useState('')
@@ -313,6 +315,15 @@ const MentionTextArea: React.FC<MentionTextAreaProps> = ({
 		handleInput()
 	}
 
+	// Add useEffect for focus registration
+	useEffect(() => {
+		if (focus) {
+			focus(() => {
+				editorRef.current?.focus()
+			})
+		}
+	}, [focus])
+
 	return (
 		<div className={styles.mentionTextArea}>
 			<div

packages/xgen/layouts/components/Neo/components/AIChat/index.tsx

@@ -123,6 +123,7 @@ const AIChat = (props: AIChatProps) => {
 	}, [initialized, chat_id])
 
 	const clearRef = useRef<(() => void) | null>(null)
+	const focusRef = useRef<(() => void) | null>(null)
 
 	const handleSend = () => {
 		const message = inputValue.trim()
@@ -186,29 +187,23 @@ const AIChat = (props: AIChatProps) => {
 		setChatId(new_chat_id)
 		setMessages([])
 		setAttachments([])
-
-		// Update global chat_id
 		global.setNeoChatId(new_chat_id)
-
-		// Set untitled as title
 		setTitle(is_cn ? '未命名' : 'Untitled')
 
-		// Handle optional content
 		if (options?.content) {
 			setInputValue(options.content)
 		}
 
-		// Handle optional attachments
 		if (options?.attachments?.length) {
 			options.attachments.forEach((attachment) => {
 				addAttachment(attachment)
 			})
 		}
 
-		// Focus the input after creating new chat
+		// Focus using the new method
 		setTimeout(() => {
-			inputRef.current?.focus()
-		}, 0)
+			focusRef.current?.()
+		}, 100)
 
 		onNew?.()
 	}
@@ -388,25 +383,21 @@ const AIChat = (props: AIChatProps) => {
 	}
 
 	const handleHistorySelect = useMemoizedFn(async (chatId?: string) => {
-		// Handle empty chatId or undefined case by creating new chat
 		if (!chatId || typeof chatId === undefined) {
 			handleNewChat()
 			return
 		}
 
-		// Update chat ID
 		setChatId(chatId)
-		global.setNeoChatId(chatId) // Update global chat ID
-
-		// Reset messages and attachments
+		global.setNeoChatId(chatId)
 		setMessages([])
 		setAttachments([])
-		setInitialized(false) // Set initialized to false to trigger loading
+		setInitialized(false)
 
-		// Focus the input after switching chat
+		// Focus using the new method
 		setTimeout(() => {
-			inputRef.current?.focus()
-		}, 0)
+			focusRef.current?.()
+		}, 100)
 	})
 
 	const handleOnFloat = useMemoizedFn(() => {
@@ -565,6 +556,7 @@ const AIChat = (props: AIChatProps) => {
 						placeholder={loading ? 'Please wait for response...' : 'Type your message here...'}
 						autoSize={{ minRows: 4, maxRows: 16 }}
 						clear={(fn) => (clearRef.current = fn)}
+						focus={(fn) => (focusRef.current = fn)}
 					/>
 					<Button
 						type='text'