From 42ae2633f2dd2624a0c974e539234a0dd186a539 Mon Sep 17 00:00:00 2001
From: alemi <me@alemi.dev>
Date: Wed, 12 Jun 2024 15:21:37 +0200
Subject: [PATCH] fix(web): more reliable infinite scroll

since there's no button anymore it really needs to work always
---
 web/src/app.rs           | 21 ++++++++++++++-------
 web/src/timeline/feed.rs |  9 +--------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/web/src/app.rs b/web/src/app.rs
index 3f4159fb..47df9775 100644
--- a/web/src/app.rs
+++ b/web/src/app.rs
@@ -2,7 +2,7 @@ use leptos::*;
 use leptos_router::*;
 use crate::prelude::*;
 
-use leptos_use::{signal_throttled, storage::use_local_storage, use_cookie, use_element_size, use_window_scroll, utils::{FromToStringCodec, JsonCodec}, UseElementSizeReturn};
+use leptos_use::{signal_debounced, signal_debounced_with_options, signal_throttled, signal_throttled_with_options, storage::use_local_storage, use_cookie, use_element_size, use_window_scroll, utils::{FromToStringCodec, JsonCodec}, DebounceOptions, ThrottleOptions, UseElementSizeReturn};
 
 #[derive(Clone, Copy)]
 pub struct Feeds {
@@ -184,7 +184,7 @@ fn Scrollable() -> impl IntoView {
 		}
 	});
 	let element = create_node_ref();
-	let should_load = use_scroll_limit(element, 1750.0);
+	let should_load = use_scroll_limit(element, 500.0);
 	provide_context(should_load);
 	view! {
 		<div class="mb-1" node_ref=element>
@@ -223,15 +223,22 @@ where
 {
 	let (load, set_load) = create_signal(false);
 	let (_x, y) = use_window_scroll();
+	let UseElementSizeReturn { height: screen_height, .. } = use_element_size("html");
 	let UseElementSizeReturn { height, .. } = use_element_size(el);
-	let scroll_state = Signal::derive(move || (y.get(), height.get()));
-	let scroll_state_throttled = signal_throttled(scroll_state, 200.);
+	let scroll_state = Signal::derive(move || (y.get(), height.get(), screen_height.get()));
+	let scroll_state_throttled = signal_debounced(
+		scroll_state,
+		50.
+	);
 	let _ = watch(
 		move || scroll_state_throttled.get(),
-		move |(y, height), _, _| {
+		move |(y, height, screen), _, _| {
 			let before = load.get();
-			let after = y + offset >= *height;
-			if after != before { set_load.set(after) };
+			let after = *height <= *screen || y + screen + offset >= *height;
+			let force = *y + screen >= *height;
+			if force || after != before || *height < *screen {
+				set_load.set(after)
+			}
 		},
 		false,
 	);
diff --git a/web/src/timeline/feed.rs b/web/src/timeline/feed.rs
index 9f636fcc..06a5a1a2 100644
--- a/web/src/timeline/feed.rs
+++ b/web/src/timeline/feed.rs
@@ -8,14 +8,7 @@ pub fn Feed(tl: Timeline) -> impl IntoView {
 	if let Some(auto_scroll) = use_context::<Signal<bool>>() {
 		let _ = leptos::watch(
 			move || auto_scroll.get(),
-			move |new, old, _| {
-				match old {
-					None => tl.spawn_more(auth), // always do it first time
-					Some(old) => if *new && new != old {
-						tl.spawn_more(auth);
-					},
-				}
-			},
+			move |at_end, _, _| if *at_end { tl.spawn_more(auth) },
 			true,
 		);
 	}