feat: added leptos-router, picker inside timeline

This commit is contained in:
əlemi 2024-04-15 01:56:33 +02:00
parent 8ce4803db1
commit acda0768d2
Signed by: alemi
GPG key ID: A4895B84D311642C
3 changed files with 43 additions and 35 deletions

View file

@ -15,12 +15,13 @@ repository = "https://git.alemi.dev/upub.git"
log = "0.4" log = "0.4"
console_log = "1.0" console_log = "1.0"
console_error_panic_hook = "0.1" console_error_panic_hook = "0.1"
thiserror = "1"
serde = { version = "1", features = ["derive"] } serde = { version = "1", features = ["derive"] }
serde_json = "1" serde_json = "1"
dashmap = "5.5" dashmap = "5.5"
web-sys = { version = "0.3", features = ["Window", "Storage", "HtmlDocument"] }
leptos = { version = "0.6", features = ["csr"] } leptos = { version = "0.6", features = ["csr"] }
leptos-use = { version = "0.10", features = [] } leptos_router = { version = "0.6", features = ["csr"] }
leptos-use = "0.10"
reqwest = { version = "0.12", features = ["json"] } reqwest = { version = "0.12", features = ["json"] }
apb = { path = "../apb", features = ["unstructured"] } apb = { path = "../apb", features = ["unstructured"] }
futures = "0.3.30" futures = "0.3.30"

View file

@ -182,12 +182,12 @@ pub fn Activity(activity: serde_json::Value) -> impl IntoView {
#[component] #[component]
pub fn Timeline( pub fn Timeline(
feed: ReadSignal<String>,
token: Signal<Option<String>>, token: Signal<Option<String>>,
) -> impl IntoView { ) -> impl IntoView {
let (timeline, set_timeline) = create_signal(format!("{BASE_URL}/inbox/page"));
let users : Arc<DashMap<String, serde_json::Value>> = Arc::new(DashMap::new()); let users : Arc<DashMap<String, serde_json::Value>> = Arc::new(DashMap::new());
let _users = users.clone(); // TODO i think there is syntactic sugar i forgot? let _users = users.clone(); // TODO i think there is syntactic sugar i forgot?
let items = create_resource(move || feed.get(), move |feed_url| { let items = create_resource(move || timeline.get(), move |feed_url| {
let __users = _users.clone(); // TODO lmao this is meme tier let __users = _users.clone(); // TODO lmao this is meme tier
async move { async move {
let mut req = reqwest::Client::new().get(feed_url); let mut req = reqwest::Client::new().get(feed_url);
@ -234,29 +234,32 @@ pub fn Timeline(
out out
} }
}); });
move || match items.get() { view! {
None => view! { <p>loading...</p> }.into_view(), <div class="ml-1">
Some(data) => { <TimelinePicker tx=set_timeline rx=timeline />
view! { {move || match items.get() {
<div class="ml-1"> None => view! { <p>loading...</p> }.into_view(),
<For Some(data) => {
each=move || data.clone() // TODO wtf this clone?? view! {
key=|x| x.id().unwrap_or("").to_string() <For
children=move |x: serde_json::Value| { each=move || data.clone() // TODO wtf this clone??
let actor = x.actor().extract().unwrap_or_else(|| key=|x| x.id().unwrap_or("").to_string()
serde_json::Value::String(x.actor().id().unwrap_or_default()) children=move |x: serde_json::Value| {
); let actor = x.actor().extract().unwrap_or_else(||
view! { serde_json::Value::String(x.actor().id().unwrap_or_default())
<div class="post-card ml-1 mr-1"> );
<Actor object=actor /> view! {
<Activity activity=x /> <div class="post-card ml-1 mr-1">
</div> <Actor object=actor />
<hr/ > <Activity activity=x />
</div>
<hr/ >
}
} }
} />
/> }.into_view()
</div> },
}.into_view() }}
}, </div>
} }
} }

View file

@ -1,21 +1,21 @@
use leptos::*; use leptos::*;
use leptos_router::*;
use leptos_use::{use_cookie, utils::FromToStringCodec}; use leptos_use::{use_cookie, utils::FromToStringCodec};
use upub_web::{ use upub_web::{
LoginBox, PostBox, TimelinePicker, Timeline LoginBox, PostBox, Timeline
}; };
fn main() { fn main() {
_ = console_log::init_with_level(log::Level::Debug); _ = console_log::init_with_level(log::Level::Debug);
console_error_panic_hook::set_once(); console_error_panic_hook::set_once();
let (cookie, set_cookie) = use_cookie::<String, FromToStringCodec>("token"); let (cookie, set_cookie) = use_cookie::<String, FromToStringCodec>("token");
let (timeline, set_timeline) = create_signal("https://feditest.alemi.dev/users/test/inbox/page".to_string());
mount_to_body( mount_to_body(
move || view! { move || view! {
<nav class="w-100"> <nav class="w-100">
<p> <p>
<code>μpub</code> <code>μpub</code>
<small class="ml-1 mr-1" ><a class="clean" href="/" >micro social network, federated</a></small> <small class="ml-1 mr-1" ><a class="clean" href="/web" >micro social network, federated</a></small>
/* TODO kinda jank with the float but whatever, will do for now */ /* TODO kinda jank with the float but whatever, will do for now */
<small style="float: right" ><a href="https://git.alemi.dev/upub.git" >src</a></small> <small style="float: right" ><a href="https://git.alemi.dev/upub.git" >src</a></small>
</p> </p>
@ -33,11 +33,15 @@ fn main() {
<hr /> <hr />
</div> </div>
<div class="col-main"> <div class="col-main">
<TimelinePicker tx=set_timeline rx=timeline /> <Router>
<Timeline <main>
feed=timeline <Routes>
token=cookie <Route path="/" view=move || view! { <Timeline token=cookie /> } />
/> // <Route path="/user/:id" view=Actor />
// <Route path="/object/:id" view=Object />
</Routes>
</main>
</Router>
</div> </div>
</div> </div>
</div> </div>