paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-23 04:52:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

recent_view: Extract function to check when to render more items.

Browse Source 
This will be used in inbox channel view for rendering topics list.
This commit is contained in:
Aman Agrawal
2025-05-26 14:09:43 +05:30
committed by Tim Abbott
parent ed2cdb9435
commit bc55c831ea
2 changed files with 18 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
web/src/recent_view_ui.ts
View File

@@ -1267,22 +1267,6 @@ function recenter_focus_if_off_screen(): void {
}
}
function is_scroll_position_for_render(): boolean {
const scroll_position = window.scrollY;
const window_height = window.innerHeight;
// We allocate `--max-unmaximized-compose-height` in empty space
// below the last rendered row in recent view.
//
// We don't want user to see this empty space until there are no
// new rows to render when the user is scrolling to the bottom of
// the view. So, we render new rows when user has scrolled 2 / 3
// of (the total scrollable height - the empty space).
const compose_max_height = $("html").css("--max-unmaximized-compose-height");
assert(typeof compose_max_height === "string");
const scroll_max = document.body.scrollHeight - Number.parseInt(compose_max_height, 10);
return scroll_position + window_height >= (2 / 3) * scroll_max;
}
function callback_after_render(): void {
// It is important to restore the scroll position as soon
// as the rendering is complete to avoid scroll jumping.
@@ -1385,7 +1369,7 @@ export function complete_rerender(): void {
html_selector: get_topic_row,
$simplebar_container: $("html"),
callback_after_render,
is_scroll_position_for_render,
is_scroll_position_for_render: views_util.is_scroll_position_for_render,
post_scroll__pre_render_callback() {
// Update the focused element for keyboard navigation if needed.
recenter_focus_if_off_screen();

17
web/src/views_util.ts
View File

@@ -1,4 +1,5 @@
import $ from "jquery";
import assert from "minimalistic-assert";
import type * as tippy from "tippy.js";
import * as activity_ui from "./activity_ui.ts";
@@ -151,3 +152,19 @@ export function is_in_focus(): boolean {
!$(".navbar-item").is(":focus")
);
}
export function is_scroll_position_for_render(): boolean {
const scroll_position = window.scrollY;
const window_height = window.innerHeight;
// We allocate `--max-unmaximized-compose-height` in empty space
// below the last rendered row in recent view.
//
// We don't want user to see this empty space until there are no
// new rows to render when the user is scrolling to the bottom of
// the view. So, we render new rows when user has scrolled 2 / 3
// of (the total scrollable height - the empty space).
const compose_max_height = $("html").css("--max-unmaximized-compose-height");
assert(typeof compose_max_height === "string");
const scroll_max = document.body.scrollHeight - Number.parseInt(compose_max_height, 10);
return scroll_position + window_height >= (2 / 3) * scroll_max;
}