feat(web): object page and some initial routing
This commit is contained in:
parent
ee26596568
commit
c28b5fd49c
3 changed files with 82 additions and 21 deletions
|
@ -15,7 +15,7 @@ pub struct Context {
|
|||
|
||||
#[derive(Debug, Default)]
|
||||
pub struct Cache {
|
||||
pub user: DashMap<String, serde_json::Value>,
|
||||
pub actors: DashMap<String, serde_json::Value>,
|
||||
}
|
||||
|
||||
#[derive(Debug, Default)]
|
||||
|
|
|
@ -15,6 +15,14 @@ struct LoginForm {
|
|||
password: String,
|
||||
}
|
||||
|
||||
fn web_uri(kind: &str, url: &str) -> String {
|
||||
if url.starts_with(URL_BASE) {
|
||||
format!("/web/{kind}/{}", url.split('/').last().unwrap_or_default().to_string())
|
||||
} else {
|
||||
format!("/web/{kind}/+{}", url.replace("https://", "").replace('/', "@"))
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
pub fn LoginBox(
|
||||
rx: Signal<Option<String>>,
|
||||
|
@ -114,7 +122,8 @@ pub fn ActorBanner(object: serde_json::Value) -> impl IntoView {
|
|||
<div><b>{id}</b></div>
|
||||
},
|
||||
serde_json::Value::Object(_) => {
|
||||
let uid = object.id().unwrap_or_default().split('/').last().unwrap_or_default().to_string();
|
||||
let uid = object.id().unwrap_or_default().to_string();
|
||||
let uri = web_uri("users", &uid);
|
||||
let avatar_url = object.icon().get().map(|x| x.url().id().unwrap_or_default()).unwrap_or_default();
|
||||
let display_name = object.name().unwrap_or_default().to_string();
|
||||
let username = object.preferred_username().unwrap_or_default().to_string();
|
||||
|
@ -127,7 +136,7 @@ pub fn ActorBanner(object: serde_json::Value) -> impl IntoView {
|
|||
<td><b>{display_name}</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="top" ><a class="clean" href={format!("/web/users/{uid}")} ><small>{username}@{domain}</small></a></td>
|
||||
<td class="top" ><a class="clean" href={uri} ><small>{username}@{domain}</small></a></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
@ -145,7 +154,7 @@ pub fn Actor() -> impl IntoView {
|
|||
let actor = create_local_resource(move || params.get().get("id").cloned().unwrap_or_default(), |uid| {
|
||||
async move {
|
||||
let uid = format!("{URL_BASE}/users/{uid}");
|
||||
match CTX.cache.user.get(&uid) {
|
||||
match CTX.cache.actors.get(&uid) {
|
||||
Some(x) => x.clone(),
|
||||
None => reqwest::get(uid)
|
||||
.await
|
||||
|
@ -163,16 +172,16 @@ pub fn Actor() -> impl IntoView {
|
|||
<div class="ml-3 mr-3 mt-3">
|
||||
<ActorBanner object=x.clone() />
|
||||
<p
|
||||
class="center pb-2 pt-2 pr-2 pl-2"
|
||||
class="pb-2 pt-2 pr-2 pl-2"
|
||||
style={format!(
|
||||
"background-image: url({}); background-size: cover;",
|
||||
x.image().get().map(|x| x.url().id().unwrap_or_default()).unwrap_or_default()
|
||||
)}
|
||||
>
|
||||
<b>{x.actor_type().unwrap_or(apb::ActorType::Person).as_ref().to_string()}</b>
|
||||
{x.summary().unwrap_or("").to_string()}
|
||||
</p>
|
||||
<p><small>{x.summary().unwrap_or("").to_string()}</small></p>
|
||||
<ul>
|
||||
<li><code>type</code>" "<b>{x.actor_type().unwrap_or(apb::ActorType::Person).as_ref().to_string()}</b></li>
|
||||
<li><code>following</code>" "<b>{x.following().get().map(|x| x.total_items().unwrap_or(0))}</b></li>
|
||||
<li><code>followers</code>" "<b>{x.followers().get().map(|x| x.total_items().unwrap_or(0))}</b></li>
|
||||
<li><code>created</code>" "{x.published().map(|x| x.to_rfc3339())}</li>
|
||||
|
@ -184,11 +193,60 @@ pub fn Actor() -> impl IntoView {
|
|||
}
|
||||
|
||||
#[component]
|
||||
pub fn Activity(activity: serde_json::Value) -> impl IntoView {
|
||||
pub fn ObjectPage() -> impl IntoView {
|
||||
let params = use_params_map();
|
||||
let object = create_local_resource(move || params.get().get("id").cloned().unwrap_or_default(), |oid| {
|
||||
async move {
|
||||
let uid = format!("{URL_BASE}/objects/{oid}");
|
||||
match CTX.cache.actors.get(&uid) {
|
||||
Some(x) => x.clone(),
|
||||
None => reqwest::get(uid)
|
||||
.await
|
||||
.unwrap()
|
||||
.json::<serde_json::Value>()
|
||||
.await
|
||||
.unwrap(),
|
||||
}
|
||||
}
|
||||
});
|
||||
view! {
|
||||
{move || match object.get() {
|
||||
Some(o) => view!{ <Object object=o /> }.into_view(),
|
||||
None => view! { <p> loading ... </p> }.into_view(),
|
||||
}}
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
pub fn Object(object: serde_json::Value) -> impl IntoView {
|
||||
let summary = object.summary().unwrap_or_default().to_string();
|
||||
let content = object.content().unwrap_or_default().to_string();
|
||||
let date = object.published().map(|x| x.to_rfc3339()).unwrap_or_default();
|
||||
let author_id = object.attributed_to().id().unwrap_or_default();
|
||||
let author = CTX.cache.actors.get(&author_id).map(|x| view! { <ActorBanner object=x.clone() /> });
|
||||
view! {
|
||||
{author}
|
||||
<table>
|
||||
<tr>
|
||||
<td>{summary}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{content}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{date}</td>
|
||||
</tr>
|
||||
</table>
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
pub fn InlineActivity(activity: serde_json::Value) -> impl IntoView {
|
||||
let object = activity.clone().object().extract().unwrap_or_else(||
|
||||
serde_json::Value::String(activity.object().id().unwrap_or_default())
|
||||
);
|
||||
let object_id = object.id().unwrap_or_default().to_string();
|
||||
let object_uri = web_uri("objects", &object_id);
|
||||
let content = dissolve::strip_html_tags(object.content().unwrap_or_default());
|
||||
let addressed = activity.addressed();
|
||||
let audience = format!("[ {} ]", addressed.join(", "));
|
||||
|
@ -200,7 +258,9 @@ pub fn Activity(activity: serde_json::Value) -> impl IntoView {
|
|||
"[private]"
|
||||
};
|
||||
let title = object.summary().unwrap_or_default().to_string();
|
||||
let date = object.published().map(|x| x.to_rfc3339()).unwrap_or_default();
|
||||
let date = object.published().map(|x| x.to_rfc3339()).unwrap_or_else(||
|
||||
activity.published().map(|x| x.to_rfc3339()).unwrap_or_default()
|
||||
);
|
||||
let kind = activity.activity_type().unwrap_or(apb::ActivityType::Activity);
|
||||
view! {
|
||||
{match kind {
|
||||
|
@ -208,16 +268,17 @@ pub fn Activity(activity: serde_json::Value) -> impl IntoView {
|
|||
apb::ActivityType::Create => view! {
|
||||
<div>
|
||||
<p><i>{title}</i></p>
|
||||
<For
|
||||
each=move || content.clone() // TODO wtf this clone??
|
||||
key=|x| x.to_string() // TODO what about this clone?
|
||||
children=move |x: String| view! { <p>{x}</p> }
|
||||
/>
|
||||
{
|
||||
content
|
||||
.into_iter()
|
||||
.map(|x| view! { <p>{x}</p> }.into_view())
|
||||
.collect::<Vec<View>>()
|
||||
}
|
||||
</div>
|
||||
},
|
||||
kind => view! {
|
||||
<div>
|
||||
<b>{kind.as_ref().to_string()}</b>" >> "<i>{object_id}</i>
|
||||
<b>{kind.as_ref().to_string()}</b>" >> "<a href={object_uri}>{object_id}</a>
|
||||
</div>
|
||||
},
|
||||
}}
|
||||
|
@ -240,7 +301,7 @@ pub fn Timeline(
|
|||
view! {
|
||||
<div class="ml-1">
|
||||
<TimelinePicker tx=set_timeline rx=timeline />
|
||||
<div class="boxscroll mt-1" >
|
||||
<div class="boxscroll" >
|
||||
<ErrorBoundary fallback=move |err| view! { <p>{format!("{:?}", err.get())}</p> } >
|
||||
{move || items.with(|x| match x {
|
||||
None => Ok(view! { <p>loading...</p> }.into_view()),
|
||||
|
@ -256,7 +317,7 @@ pub fn Timeline(
|
|||
view! {
|
||||
<div class="ml-1 mr-1 mt-1">
|
||||
<ActorBanner object=actor />
|
||||
<Activity activity=object.clone() />
|
||||
<InlineActivity activity=object.clone() />
|
||||
</div>
|
||||
<hr/ >
|
||||
}
|
||||
|
@ -297,7 +358,7 @@ async fn fetch_activities_with_users(
|
|||
let mut out = Vec::new();
|
||||
for x in activities {
|
||||
if let Some(uid) = x.actor().id() {
|
||||
if let Some(actor) = CTX.cache.user.get(&uid) {
|
||||
if let Some(actor) = CTX.cache.actors.get(&uid) {
|
||||
out.push(x.set_actor(apb::Node::object(actor.clone())))
|
||||
} else {
|
||||
let mut req = reqwest::Client::new()
|
||||
|
@ -309,7 +370,7 @@ async fn fetch_activities_with_users(
|
|||
|
||||
// TODO don't fail whole timeline fetch when one user fails fetching...
|
||||
let actor = req.send().await?.json::<serde_json::Value>().await?;
|
||||
CTX.cache.user.insert(uid, actor.clone());
|
||||
CTX.cache.actors.insert(uid, actor.clone());
|
||||
|
||||
out.push(x.set_actor(apb::Node::object(actor)))
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@ use leptos_router::*;
|
|||
|
||||
use leptos_use::{use_cookie, utils::FromToStringCodec};
|
||||
use upub_web::{
|
||||
Actor, LoginBox, PostBox, Timeline
|
||||
Actor, LoginBox, ObjectPage, PostBox, Timeline
|
||||
};
|
||||
|
||||
|
||||
|
@ -45,7 +45,7 @@ fn main() {
|
|||
<Route path="/" view=move || view! { <Redirect path="/web" /> } />
|
||||
<Route path="/web" view=move || view! { <Timeline token=cookie /> } />
|
||||
<Route path="/web/users/:id" view=Actor />
|
||||
// <Route path="/object/:id" view=Object />
|
||||
<Route path="/web/objects/:id" view=ObjectPage />
|
||||
</Routes>
|
||||
</main>
|
||||
</Router>
|
||||
|
|
Loading…
Reference in a new issue