Mirroristas/owncast
2
0
Fork 0
mirror of https://github.com/owncast/owncast.git synced 2024-10-10 19:16:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use own scroll to bottom function instead of built-in. Closes #2500

Browse Source
This commit is contained in:
Gabe Kangas 2023-01-11 00:53:18 -08:00
parent b989e9a462
commit bb9b8a8123
No known key found for this signature in database
GPG Key ID: 4345B2060657F330
1 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
web/components/chat/ChatContainer/ChatContainer.tsx
View File

@ -171,11 +171,15 @@ export const ChatContainer: FC<ChatContainerProps> = ({
}
};
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const scrollChatToBottom = (ref, behavior = 'smooth') => {
ref.current?.scrollToIndex({
index: messages.length - 1,
behavior,
});
setTimeout(() => {
ref.current?.scrollToIndex({
index: messages.length - 1,
behavior,
});
}, 100);
setAtBottom(true);
};
@ -192,6 +196,7 @@ export const ChatContainer: FC<ChatContainerProps> = ({
() => (
<>
<Virtuoso
id="virtuoso"
style={{ height }}
className={styles.virtuoso}
ref={chatContainerRef}
@ -199,12 +204,12 @@ export const ChatContainer: FC<ChatContainerProps> = ({
itemContent={(index, message) => getViewForMessage(index, message)}
followOutput={(isAtBottom: boolean) => {
if (isAtBottom) {
return 'smooth';
scrollChatToBottom(chatContainerRef, 'smooth');
}
return false;
}}
alignToBottom
atBottomThreshold={50}
atBottomThreshold={70}
atBottomStateChange={bottom => {
setAtBottom(bottom);
}}