opt: auto-scroll behavior to reactivate only on user scroll

This commit is contained in:
Memory 2025-09-23 12:18:25 +08:00 committed by GitHub
parent bd49f1884a
commit 848f6277cb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -44,6 +44,7 @@ const Logs: React.FC = () => {
return localStorage.getItem(LOGS_FILTER_KEY) || '' return localStorage.getItem(LOGS_FILTER_KEY) || ''
}) })
const [trace, setTrace] = useState(true) const [trace, setTrace] = useState(true)
const containerRef = useRef<HTMLDivElement>(null)
const virtuosoRef = useRef<VirtuosoHandle>(null) const virtuosoRef = useRef<VirtuosoHandle>(null)
const filteredLogs = useMemo(() => { const filteredLogs = useMemo(() => {
@ -57,6 +58,22 @@ const Logs: React.FC = () => {
localStorage.setItem(LOGS_FILTER_KEY, filter) localStorage.setItem(LOGS_FILTER_KEY, filter)
}, [filter]) }, [filter])
useEffect(() => {
if (!trace) {
const container = containerRef.current
if (container) {
const handleScroll = () => {
setTrace(true)
container.removeEventListener('wheel', handleScroll)
}
container.addEventListener('wheel', handleScroll)
return () => {
container.removeEventListener('wheel', handleScroll)
}
}
}
}, [trace])
useEffect(() => { useEffect(() => {
if (!trace) return if (!trace) return
virtuosoRef.current?.scrollToIndex({ virtuosoRef.current?.scrollToIndex({
@ -96,7 +113,9 @@ const Logs: React.FC = () => {
variant={trace ? 'solid' : 'bordered'} variant={trace ? 'solid' : 'bordered'}
title={t('logs.autoScroll')} title={t('logs.autoScroll')}
onPress={() => { onPress={() => {
setTrace((prev) => !prev) if (trace) {
setTrace(false)
}
}} }}
> >
<IoLocationSharp className="text-lg" /> <IoLocationSharp className="text-lg" />
@ -117,7 +136,7 @@ const Logs: React.FC = () => {
</div> </div>
<Divider /> <Divider />
</div> </div>
<div className="h-[calc(100vh-100px)] mt-px"> <div className="h-[calc(100vh-100px)] mt-px" ref={containerRef}>
<Virtuoso <Virtuoso
ref={virtuosoRef} ref={virtuosoRef}
data={filteredLogs} data={filteredLogs}