nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2025-02-20 02:32:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

Fix chat history scroll

Browse Source
This commit is contained in:
Bill 2022-03-16 22:19:54 -04:00
parent 34b8f855e4
commit a89b2b963b
1 changed files with 2 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/chat-history/ChatHistoryView.tsx
View File

@ -1,7 +1,6 @@
import { ILinkEventTracker } from '@nitrots/nitro-renderer'; import { ILinkEventTracker } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { AutoSizer, CellMeasurer, CellMeasurerCache, List, ListRowProps, ListRowRenderer, Size } from 'react-virtualized'; import { AutoSizer, CellMeasurer, CellMeasurerCache, List, ListRowProps, ListRowRenderer, Size } from 'react-virtualized';
import { RenderedRows } from 'react-virtualized/dist/es/List';
import { AddEventLinkTracker, LocalizeText, RemoveLinkEventTracker } from '../../api'; import { AddEventLinkTracker, LocalizeText, RemoveLinkEventTracker } from '../../api';
import { Flex, NitroCardContentView, NitroCardHeaderView, NitroCardView, Text } from '../../common'; import { Flex, NitroCardContentView, NitroCardHeaderView, NitroCardView, Text } from '../../common';
import { BatchUpdates } from '../../hooks'; import { BatchUpdates } from '../../hooks';
@ -15,7 +14,6 @@ import { RoomHistoryState } from './common/RoomHistoryState';
export const ChatHistoryView: FC<{}> = props => export const ChatHistoryView: FC<{}> = props =>
{ {
const [ isVisible, setIsVisible ] = useState(false); const [ isVisible, setIsVisible ] = useState(false);
const [ needsScroll, setNeedsScroll ] = useState(false);
const [ chatHistoryUpdateId, setChatHistoryUpdateId ] = useState(-1); const [ chatHistoryUpdateId, setChatHistoryUpdateId ] = useState(-1);
const [ roomHistoryUpdateId, setRoomHistoryUpdateId ] = useState(-1); const [ roomHistoryUpdateId, setRoomHistoryUpdateId ] = useState(-1);
const [ chatHistoryState, setChatHistoryState ] = useState(new ChatHistoryState()); const [ chatHistoryState, setChatHistoryState ] = useState(new ChatHistoryState());
@ -51,16 +49,6 @@ export const ChatHistoryView: FC<{}> = props =>
const onResize = (info: Size) => cache.clearAll(); const onResize = (info: Size) => cache.clearAll();
const onRowsRendered = (info: RenderedRows) =>
{
if(elementRef && elementRef.current && isVisible && needsScroll)
{
elementRef.current.scrollToRow(chatHistoryState.chats.length);
setNeedsScroll(false);
}
}
const linkReceived = useCallback((url: string) => const linkReceived = useCallback((url: string) =>
{ {
const parts = url.split('/'); const parts = url.split('/');
@ -118,10 +106,8 @@ export const ChatHistoryView: FC<{}> = props =>
useEffect(() => useEffect(() =>
{ {
if(elementRef && elementRef.current && isVisible) elementRef.current.scrollToRow(chatHistoryState.chats.length); if(elementRef && elementRef.current && isVisible) elementRef.current.scrollToRow(-1);
}, [ isVisible ]);
setNeedsScroll(true);
}, [ isVisible, chatHistoryState.chats, chatHistoryUpdateId ]);
return ( return (
<ChatHistoryContextProvider value={ { chatHistoryState, roomHistoryState } }> <ChatHistoryContextProvider value={ { chatHistoryState, roomHistoryState } }>
@ -142,7 +128,6 @@ export const ChatHistoryView: FC<{}> = props =>
rowHeight={ cache.rowHeight } rowHeight={ cache.rowHeight }
className={ 'chat-history-list' } className={ 'chat-history-list' }
rowRenderer={ RowRenderer } rowRenderer={ RowRenderer }
onRowsRendered={ onRowsRendered }
deferredMeasurementCache={ cache } /> deferredMeasurementCache={ cache } />
) )
} } } }