self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-24 10:27:10 +02:00
Code Issues Releases Activity

Desktop: Fixes #4124: Fix note list blank space display problems (#7888)

Browse Source
This commit is contained in:
Arun Kumar 2023-03-10 17:36:30 +05:30 committed by GitHub
parent d871b3c7d6
commit 5c6e17bc89
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 27 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/app-desktop/gui/ItemList.tsx
View File

@ -1,4 +1,7 @@
import * as React from 'react';
import Logger from '@joplin/lib/Logger';
const logger = Logger.create('ItemList');
interface Props {
style: any;
@ -47,6 +50,15 @@ class ItemList extends React.Component<Props, State> {
let bottomItemIndex = topItemIndex + (visibleItemCount - 1);
if (bottomItemIndex >= props.items.length) bottomItemIndex = props.items.length - 1;
// EDGE CASE:
// ref: https://github.com/laurent22/joplin/issues/4124
// when the note list is hidden, visibleItemCount is negative, and scroll top is positive when a note is selected
if (visibleItemCount < 0 && this.scrollTop_ > 0) {
logger.warn('Resetting scrollTop to 0. visibleItemCount is negative, scrollTop is positive.');
// we will reset the scroll top so that there is no blank space at the top of note list
this.scrollTop_ = 0;
}
this.setState({
topItemIndex: topItemIndex,
bottomItemIndex: bottomItemIndex,
@ -69,6 +81,21 @@ class ItemList extends React.Component<Props, State> {
this.updateStateItemIndexes(newProps);
}
public componentDidUpdate(): void {
// EDGE CASE
// scroll top is not updated when item list visibility is toggled
// if the user was at the bottom of the item list before hiding, blank spaces are added at the bottom of the item list
if (this.offsetScroll() !== this.listRef.current?.scrollTop) {
logger.warn(`scrollTop mismatch. Updating scrollTop with current listRef scrollTop(${this.listRef.current.scrollTop})`);
// update scroll postion once if there is a mismatch in scroll position after showing item list
this.onScroll({
target: {
scrollTop: this.listRef.current.scrollTop,
},
});
}
}
public onScroll(event: any) {
this.scrollTop_ = event.target.scrollTop;
this.updateStateItemIndexes();