Force load of newer/older messages if, on load, all messages visible

This commit is contained in:
Scott Nonnenberg 2021-05-25 11:34:34 -07:00 committed by GitHub
parent 9693700dd2
commit 07c1505782
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -504,6 +504,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
const {
unreadCount,
haveNewest,
haveOldest,
isLoadingMessages,
items,
loadNewerMessages,
@ -519,24 +520,38 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
return;
}
const { newest } = this.visibleRows;
if (!newest || !newest.id) {
const { newest, oldest } = this.visibleRows;
if (!newest || !oldest) {
return;
}
markMessageRead(newest.id);
const rowCount = this.getRowCount();
const newestRow = this.getRowCount() - 1;
const oldestRow = this.fromItemIndexToRow(0);
const lastId = items[items.length - 1];
// Loading newer messages (that go below current messages) is pain-free and quick
// we'll just kick these off immediately.
if (
!isLoadingMessages &&
!haveNewest &&
newest.row > rowCount - LOAD_MORE_THRESHOLD
newest.row > newestRow - LOAD_MORE_THRESHOLD
) {
const lastId = items[items.length - 1];
loadNewerMessages(lastId);
}
// Loading older messages is more destructive, as they requires a recalculation of
// all locations of things below. So we need to be careful with these loads.
// Generally we hid this behind a countdown spinner at the top of the window, but
// this is a special-case for the situation where the window is so large and that
// all the messages are visible.
const oldestVisible = oldestRow === oldest.row;
const newestVisible = newestRow === newest.row;
if (oldestVisible && newestVisible && !haveOldest) {
this.loadOlderMessages();
}
const lastIndex = items.length - 1;
const lastItemRow = this.fromItemIndexToRow(lastIndex);
const areUnreadBelowCurrentPosition = Boolean(
@ -548,7 +563,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
const shouldShowScrollDownButton = Boolean(
!haveNewest ||
areUnreadBelowCurrentPosition ||
newest.row < rowCount - SCROLL_DOWN_BUTTON_THRESHOLD
newest.row < newestRow - SCROLL_DOWN_BUTTON_THRESHOLD
);
this.setState({