web: add spinner when loading next page in catchup mode

This commit is contained in:
2025-11-26 13:46:19 -08:00
parent 01fd53e467
commit 3c48076996
2 changed files with 35 additions and 8 deletions

View File

@@ -78,6 +78,10 @@ mod tw_classes {
}
pub fn view(model: &Model) -> Node<Msg> {
let is_loading = match model.refreshing_state {
RefreshingState::Loading => true,
_ => false,
};
match &model.context {
Context::None => normal_view(
div![h1!["Loading"]],
@@ -96,6 +100,7 @@ pub fn view(model: &Model) -> Node<Msg> {
thread(thread_data, open_messages, &model.content_el, true),
&catchup.items,
model.read_completion_ratio,
is_loading,
)
} else {
normal_view(
@@ -117,6 +122,7 @@ pub fn view(model: &Model) -> Node<Msg> {
news_post(post, &model.content_el, true),
&catchup.items,
model.read_completion_ratio,
is_loading,
)
} else {
normal_view(
@@ -186,6 +192,7 @@ fn catchup_view(
content: Node<Msg>,
items: &[CatchupItem],
read_completion_ratio: f64,
is_loading: bool,
) -> Node<Msg> {
div![
C!["w-full", "relative", "text-white"],
@@ -201,13 +208,17 @@ fn catchup_view(
"bg-black/50",
],
div![
C!["absolute", "top-0", "right-4", "text-gray-500", "p-4"],
span![i![C!["fas", "fa-x"]]],
ev(Ev::Click, move |_| Msg::CatchupExit)
C!["absolute", "top-0", "left-4", "text-green-200", "p-4"],
IF!(is_loading=>span![i![C!["animate-spin", "fas", "fa-spinner"]]])
],
h1![
C!["text-center"],
format!("{} left ", items.iter().filter(|i| !i.seen).count(),)
],
div![
C!["absolute", "top-0", "right-4", "text-gray-500", "p-4"],
span![i![C!["fas", "fa-x"]]],
ev(Ev::Click, move |_| Msg::CatchupExit)
]
],
div![C!["mt-12", "mb-20"], content],