mirror of
https://github.com/He4eT/elseifplayer.git
synced 2026-05-04 17:07:22 +00:00
Add autoscroll for textBuffer
This commit is contained in:
parent
6fda37feb5
commit
f6fd5da6f7
1 changed files with 10 additions and 2 deletions
|
|
@ -1,5 +1,5 @@
|
|||
import { h } from 'preact'
|
||||
import { useState, useEffect } from 'preact/hooks'
|
||||
import { useEffect, useRef, useState } from 'preact/hooks'
|
||||
|
||||
import TextMessage from './TextMessage'
|
||||
|
||||
|
|
@ -48,6 +48,7 @@ const parseInbox = (inbox, currentWindow) => {
|
|||
|
||||
export default function ({ inbox, currentWindow }) {
|
||||
const [messages, setMessages] = useState([])
|
||||
const textBufferEl = useRef(null)
|
||||
|
||||
useEffect(() => {
|
||||
const { incoming, clear } =
|
||||
|
|
@ -56,10 +57,17 @@ export default function ({ inbox, currentWindow }) {
|
|||
setMessages(clear
|
||||
? incoming
|
||||
: messages.concat(incoming))
|
||||
|
||||
setTimeout(() => {
|
||||
textBufferEl.current.scrollTop =
|
||||
textBufferEl.current.scrollHeight * 2
|
||||
}, 0)
|
||||
}, [inbox])
|
||||
|
||||
return (
|
||||
<section className='textBuffer'>
|
||||
<section
|
||||
ref={textBufferEl}
|
||||
className='textBuffer'>
|
||||
{messages.map(TextMessage)}
|
||||
</section>
|
||||
)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue