chore: fix auto focus chat input
This commit is contained in:
parent
46943a1cf7
commit
adc90167d4
@ -3,6 +3,7 @@
|
|||||||
import TextareaAutosize from 'react-textarea-autosize'
|
import TextareaAutosize from 'react-textarea-autosize'
|
||||||
import { cn } from '@/lib/utils'
|
import { cn } from '@/lib/utils'
|
||||||
import { usePrompt } from '@/hooks/usePrompt'
|
import { usePrompt } from '@/hooks/usePrompt'
|
||||||
|
import { useThreads } from '@/hooks/useThreads'
|
||||||
import { useCallback, useEffect, useRef, useState } from 'react'
|
import { useCallback, useEffect, useRef, useState } from 'react'
|
||||||
import { Button } from '@/components/ui/button'
|
import { Button } from '@/components/ui/button'
|
||||||
import { ArrowRight } from 'lucide-react'
|
import { ArrowRight } from 'lucide-react'
|
||||||
@ -47,6 +48,7 @@ const ChatInput = ({
|
|||||||
const { streamingContent, updateTools, abortControllers, loadingModel } =
|
const { streamingContent, updateTools, abortControllers, loadingModel } =
|
||||||
useAppState()
|
useAppState()
|
||||||
const { prompt, setPrompt } = usePrompt()
|
const { prompt, setPrompt } = usePrompt()
|
||||||
|
const { currentThreadId } = useThreads()
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
const { spellCheckChatInput } = useGeneralSetting()
|
const { spellCheckChatInput } = useGeneralSetting()
|
||||||
const { tokenSpeed } = useAppState()
|
const { tokenSpeed } = useAppState()
|
||||||
@ -95,12 +97,30 @@ const ChatInput = ({
|
|||||||
return unsubscribe
|
return unsubscribe
|
||||||
}, [updateTools])
|
}, [updateTools])
|
||||||
|
|
||||||
|
// Focus when component mounts
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (textareaRef.current) {
|
if (textareaRef.current) {
|
||||||
textareaRef.current.focus()
|
textareaRef.current.focus()
|
||||||
}
|
}
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
// Focus when thread changes
|
||||||
|
useEffect(() => {
|
||||||
|
if (textareaRef.current) {
|
||||||
|
textareaRef.current.focus()
|
||||||
|
}
|
||||||
|
}, [currentThreadId])
|
||||||
|
|
||||||
|
// Focus when streaming content finishes
|
||||||
|
useEffect(() => {
|
||||||
|
if (!streamingContent && textareaRef.current) {
|
||||||
|
// Small delay to ensure UI has updated
|
||||||
|
setTimeout(() => {
|
||||||
|
textareaRef.current?.focus()
|
||||||
|
}, 10)
|
||||||
|
}
|
||||||
|
}, [streamingContent])
|
||||||
|
|
||||||
const stopStreaming = useCallback(
|
const stopStreaming = useCallback(
|
||||||
(threadId: string) => {
|
(threadId: string) => {
|
||||||
abortControllers[threadId]?.abort()
|
abortControllers[threadId]?.abort()
|
||||||
@ -227,7 +247,9 @@ const ChatInput = ({
|
|||||||
{showSpeedToken && (
|
{showSpeedToken && (
|
||||||
<div className="flex items-center gap-1 text-main-view-fg/60 text-xs">
|
<div className="flex items-center gap-1 text-main-view-fg/60 text-xs">
|
||||||
<IconBrandSpeedtest size={18} />
|
<IconBrandSpeedtest size={18} />
|
||||||
<span>{Math.round(tokenSpeed?.tokenSpeed ?? 0)} tokens/sec</span>
|
<span>
|
||||||
|
{Math.round(tokenSpeed?.tokenSpeed ?? 0)} tokens/sec
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user