Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Desktop: Fixes #5178: NoteListItem's height can be properly styled using CSS for v2.8+ #6542

Merged
merged 2 commits into from
Jun 8, 2022

Conversation

ken1kob
Copy link
Contributor

@ken1kob ken1kob commented May 29, 2022

The bug reported in issue #5178 is fixed.
This PR is the replacement of PR #5271 and is for the refactored NoteList function component in v2.8+.

The following spec is the same with the before, but its implementation is more effecient, because it's based on the efficiency of the React function component.

Specification

When the height of NoteListItem is styled using userchrome.css as below, the number of displayed note items is correctly calcurated, and there is no unused dead area in the NoteList panel.

.note-list .list-item-container,
.note-list .list-item-container div {
    height: 25px !important;
}

By applying this fix, you see what people expects as below shown in issue #5178.

joplin_bug_20210711_expected

Comment on lines 456 to 462
useEffect(() => {
const noteItem = Object.values<any>(itemAnchorRefs_.current)[0]?.current;
const actualItemHeight = noteItem?.getHeight() ?? 0;
if (actualItemHeight >= 8) { // To avoid generating too many narrow items
setItemHeight(actualItemHeight);
}
});
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please add a comment to explain why this is needed

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

@laurent22 laurent22 merged commit fb9e78d into laurent22:dev Jun 8, 2022
@Daeraxa
Copy link
Collaborator

Daeraxa commented Jul 3, 2022

Somebody on discord found a bug in the dev version and I think I've traced it back to this commit.
Replication steps:

  • Enable custom sorting on a notebook
  • Drag a note to reorder
    -> Notelist items shrink

image

Size is restored on restart

@laurent22
Copy link
Owner

I can replicate this too

@ken1kob
Copy link
Contributor Author

ken1kob commented Jul 4, 2022

  • Drag a note to reorder
    -> Notelist items shrink

If you create an issue, I can start working on it.

@Daeraxa
Copy link
Collaborator

Daeraxa commented Jul 4, 2022

Sure, just wanted to make you aware in case I had overlooked something

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants