feat(web): followers/following pages on actors

This commit is contained in:
əlemi 2024-06-10 04:45:17 +02:00
parent caf990f291
commit 81d8ee9cdf
Signed by: alemi
GPG key ID: A4895B84D311642C
3 changed files with 47 additions and 24 deletions

View file

@ -256,9 +256,18 @@
color: var(--background); color: var(--background);
cursor: pointer; cursor: pointer;
} }
.ml-1-r { .ml-1-l {
margin-left: 1em; margin-left: 1em;
} }
.ml-1-r {
margin-right: 1em;
}
.ml-3-r {
margin-left: 3em;
}
.mr-3-r {
margin-right: 3em;
}
.depth-r { .depth-r {
margin-left: .5em; margin-left: .5em;
} }
@ -269,9 +278,18 @@
.depth-r { .depth-r {
margin-left: .125em; margin-left: .125em;
} }
.ml-1-r { .ml-1-l {
margin-left: 0; margin-left: 0;
} }
.ml-1-r {
margin-right: 0;
}
.ml-3-r {
margin-left: 0;
}
.mr-3-r {
margin-right: 0;
}
.only-on-mobile { .only-on-mobile {
display: inherit; display: inherit;
} }

View file

@ -20,7 +20,7 @@ pub fn ActivityLine(activity: crate::Object) -> impl IntoView {
}; };
view! { view! {
<div> <div>
<span class="ml-1-r"> <span class="ml-1-l">
<ActorStrip object=actor /> <ActorStrip object=actor />
</span> </span>
<span style="float:right"> <span style="float:right">

View file

@ -9,6 +9,7 @@ use apb::Collection;
#[component] #[component]
pub fn FollowPage(outgoing: bool) -> impl IntoView { pub fn FollowPage(outgoing: bool) -> impl IntoView {
let follow___ = if outgoing { "following" } else { "followers" }; let follow___ = if outgoing { "following" } else { "followers" };
let symbol = if outgoing { "👥" } else { "📢" };
let params = use_params_map(); let params = use_params_map();
let auth = use_context::<Auth>().expect("missing auth context"); let auth = use_context::<Auth>().expect("missing auth context");
let user = Signal::derive(move ||{ let user = Signal::derive(move ||{
@ -19,7 +20,7 @@ pub fn FollowPage(outgoing: bool) -> impl IntoView {
move || params.get().get("id").cloned().unwrap_or_default(), move || params.get().get("id").cloned().unwrap_or_default(),
move |id| { move |id| {
async move { async move {
match Http::fetch::<crate::Object>(&format!("{URL_BASE}/actors/{id}/{follow___}/page"), auth).await { match Http::fetch::<serde_json::Value>(&format!("{URL_BASE}/actors/{id}/{follow___}/page"), auth).await {
Err(e) => { Err(e) => {
tracing::error!("failed getting {follow___} for {id}: {e}"); tracing::error!("failed getting {follow___} for {id}: {e}");
None None
@ -37,11 +38,13 @@ pub fn FollowPage(outgoing: bool) -> impl IntoView {
<Breadcrumb back=true > <Breadcrumb back=true >
actors::view::{follow___} actors::view::{follow___}
</Breadcrumb> </Breadcrumb>
<div> <div class="ml-3 mr-3">
{move || user.get().map(|x| view! { <ActorHeader object=x /> })} {move || user.get().map(|x| view! { <ActorHeader object=x /> })}
<code class="cw center color mt-1"><span class="emoji">{symbol}</span>" "<b>{follow___}</b></code>
<blockquote class="tl ml-3-r mr-3-r pl-1 pt-1 pb-1">
{move || match resource.get() { {move || match resource.get() {
None => view! { <p>"loading "<span class="dots"></span></p> }.into_view(), None => view! { <p class="center">"loading "<span class="dots"></span></p> }.into_view(),
Some(None) => view! { <code>could not load following</code> }.into_view(), Some(None) => view! { <p class="center">could not load {follow___}</p> }.into_view(),
Some(Some(arr)) => view! { Some(Some(arr)) => view! {
<For <For
each=move || arr.clone() each=move || arr.clone()
@ -53,11 +56,13 @@ pub fn FollowPage(outgoing: bool) -> impl IntoView {
}; };
view! { view! {
<ActorBanner object=actor /> <ActorBanner object=actor />
<hr />
}.into_view() }.into_view()
} }
/ > / >
}, }.into_view(),
}} }}
</blockquote>
</div> </div>
</div> </div>
} }