feat: added leptos-router, picker inside timeline

web/Cargo.toml

@@ -15,12 +15,13 @@ repository = "https://git.alemi.dev/upub.git"
 log = "0.4"
 console_log = "1.0"
 console_error_panic_hook = "0.1"
+thiserror = "1"
 serde = { version = "1", features = ["derive"] }
 serde_json = "1"
 dashmap = "5.5"
-web-sys = { version = "0.3", features = ["Window", "Storage", "HtmlDocument"] }
 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"] }
 apb = { path = "../apb", features = ["unstructured"] }
 futures = "0.3.30"

web/src/lib.rs

@@ -182,12 +182,12 @@ pub fn Activity(activity: serde_json::Value) -> impl IntoView {
 
 #[component]
 pub fn Timeline(
-	feed: ReadSignal<String>,
 	token: Signal<Option<String>>,
 ) -> 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 = 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
 		async move {
 			let mut req = reqwest::Client::new().get(feed_url);
@@ -234,11 +234,13 @@ pub fn Timeline(
 			out
 		}
 	});
-	move || match items.get() {
+	view! {
+		<div class="ml-1">
+			<TimelinePicker tx=set_timeline rx=timeline />
+			{move || match items.get() {
 				None => view! { <p>loading...</p> }.into_view(),
 				Some(data) => {
 					view! {
-				<div class="ml-1">
 						<For
 							each=move || data.clone() // TODO wtf this clone??
 							key=|x| x.id().unwrap_or("").to_string()
@@ -255,8 +257,9 @@ pub fn Timeline(
 								}
 							}
 						/>
-				</div>
 					}.into_view()
 				},
+			}}
+		</div>
 	}
 }

web/src/main.rs

@@ -1,21 +1,21 @@
 use leptos::*;
+use leptos_router::*;
 
 use leptos_use::{use_cookie, utils::FromToStringCodec};
 use upub_web::{
-	LoginBox, PostBox, TimelinePicker, Timeline
+	LoginBox, PostBox, Timeline
 };
 
 fn main() {
 	_ = console_log::init_with_level(log::Level::Debug);
 	console_error_panic_hook::set_once();
 	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(
 		move || view! {
 			<nav class="w-100">
 				<p>
 					<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 */
 					<small style="float: right" ><a href="https://git.alemi.dev/upub.git" >src</a></small>
 				</p>
@@ -33,11 +33,15 @@ fn main() {
 						<hr />
 					</div>
 					<div class="col-main">
-						<TimelinePicker tx=set_timeline rx=timeline />
-						<Timeline
-							feed=timeline
-							token=cookie
-						/>
+						<Router>
+							<main>
+								<Routes>
+									<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>