feat(web): default to timelines, nav to about

This commit is contained in:
əlemi 2024-04-17 15:51:50 +02:00
parent 5dd4f0e19d
commit a38302219c
Signed by: alemi
GPG key ID: A4895B84D311642C
2 changed files with 34 additions and 18 deletions

View file

@ -92,7 +92,7 @@ pub fn LoginBox(
} }
#[component] #[component]
pub fn TimelineNavigation() -> impl IntoView { pub fn Navigator() -> impl IntoView {
let auth = use_context::<Signal<Option<String>>>().expect("missing auth context"); let auth = use_context::<Signal<Option<String>>>().expect("missing auth context");
view! { view! {
<a href="/web/home" > <a href="/web/home" >
@ -111,6 +111,14 @@ pub fn TimelineNavigation() -> impl IntoView {
value="server timeline" value="server timeline"
/> />
</a> </a>
<a href="/web/about" >
<input
class="w-100"
// class:active=move || use_location().pathname.get().ends_with("/server")
type="submit"
value="about"
/>
</a>
} }
} }
@ -250,7 +258,7 @@ pub fn UserPage() -> impl IntoView {
view! { view! {
<div> <div>
<div class="tl-header w-100 center mb-s" >view::user</div> <div class="tl-header w-100 center mb-s" >view::user</div>
<div class="boxscroll" > <div>
{move || match actor.get() { {move || match actor.get() {
None => view! { <p>loading...</p> }.into_view(), None => view! { <p>loading...</p> }.into_view(),
Some(None) => view! { <p><code>error loading</code></p> }.into_view(), Some(None) => view! { <p><code>error loading</code></p> }.into_view(),
@ -306,7 +314,7 @@ pub fn ObjectPage() -> impl IntoView {
view! { view! {
<div> <div>
<div class="tl-header w-100 center mb-s" >view::object</div> <div class="tl-header w-100 center mb-s" >view::object</div>
<div class="boxscroll ma-2" > <div class="ma-2" >
{move || match object.get() { {move || match object.get() {
Some(Some(o)) => view!{ <Object object=o /> }.into_view(), Some(Some(o)) => view!{ <Object object=o /> }.into_view(),
Some(None) => view! { <p><code>loading failed</code></p> }.into_view(), Some(None) => view! { <p><code>loading failed</code></p> }.into_view(),
@ -418,9 +426,9 @@ pub fn InlineActivity(activity: serde_json::Value) -> impl IntoView {
pub fn About() -> impl IntoView { pub fn About() -> impl IntoView {
view! { view! {
<div> <div>
<div class="tl-header w-100 center mb-s" >landing</div> <div class="tl-header w-100 center mb-s" >about</div>
<div class="boxscroll mt-s mb-s" > <div class="mt-s mb-s" >
nothing to see here! pick a timeline to start browsing <p><code>μpub</code>" is a micro social network powered by "<a href="">ActivityPub</a></p>
</div> </div>
</div> </div>
} }
@ -435,7 +443,7 @@ pub fn TimelinePage(name: &'static str, tl: Timeline) -> impl IntoView {
view! { view! {
<div> <div>
<div class="tl-header w-100 center mb-s" >{name}</div> <div class="tl-header w-100 center mb-s" >{name}</div>
<div class="boxscroll mt-s mb-s" > <div class="mt-s mb-s" >
<TimelineFeed tl=tl /> <TimelineFeed tl=tl />
</div> </div>
</div> </div>

View file

@ -4,15 +4,15 @@ use leptos_router::*;
use leptos_use::{use_cookie, utils::FromToStringCodec}; use leptos_use::{use_cookie, utils::FromToStringCodec};
use upub_web::{ use upub_web::{
URL_BASE, context::Timeline, About, LoginBox, MaybeToken, ObjectPage, PostBox, URL_BASE, context::Timeline, About, LoginBox, MaybeToken, ObjectPage, PostBox,
TimelinePage, TimelineNavigation, UserPage TimelinePage, Navigator, UserPage
}; };
fn main() { fn main() {
_ = console_log::init_with_level(log::Level::Info); _ = console_log::init_with_level(log::Level::Info);
console_error_panic_hook::set_once(); console_error_panic_hook::set_once();
let (cookie, set_cookie) = use_cookie::<String, FromToStringCodec>("token"); let (token, set_token) = use_cookie::<String, FromToStringCodec>("token");
let (username, set_username) = use_cookie::<String, FromToStringCodec>("username"); let (username, set_username) = use_cookie::<String, FromToStringCodec>("username");
provide_context(cookie); provide_context(token);
let home_tl = Timeline::new(format!("{URL_BASE}/users/{}/inbox/page", username.get().unwrap_or_default())); let home_tl = Timeline::new(format!("{URL_BASE}/users/{}/inbox/page", username.get().unwrap_or_default()));
let server_tl = Timeline::new(format!("{URL_BASE}/inbox/page")); let server_tl = Timeline::new(format!("{URL_BASE}/inbox/page"));
@ -20,14 +20,14 @@ fn main() {
let (menu, set_menu) = create_signal(false); let (menu, set_menu) = create_signal(false);
spawn_local(async move { spawn_local(async move {
if let Err(e) = server_tl.more(cookie).await { if let Err(e) = server_tl.more(token).await {
console_error(&format!("error populating timeline: {e}")); console_error(&format!("error populating timeline: {e}"));
} }
}); });
if cookie.get().is_some() { if token.get().is_some() {
spawn_local(async move { spawn_local(async move {
if let Err(e) = home_tl.more(cookie).await { if let Err(e) = home_tl.more(token).await {
console_error(&format!("error populating timeline: {e}")); console_error(&format!("error populating timeline: {e}"));
} }
}); });
@ -36,7 +36,7 @@ fn main() {
mount_to_body( mount_to_body(
move || view! { move || view! {
<nav class="w-100 mt-1 mb-1 pb-s"> <nav class="w-100 mt-1 mb-1 pb-s">
<code class="color ml-3" ><a class="upub-title" href=move || if cookie.get().present() { "/web/home" } else { "/web/server" } >μpub</a></code> <code class="color ml-3" ><a class="upub-title" href=move || if token.get().present() { "/web/home" } else { "/web/server" } >μpub</a></code>
<small class="ml-1 mr-1 hidden-on-tiny" ><a class="clean" href="/web/server" >micro social network, federated</a></small> <small class="ml-1 mr-1 hidden-on-tiny" ><a class="clean" href="/web/server" >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 */
<input type="submit" class="mr-2 rev" on:click=move |_| set_menu.set(!menu.get()) value="menu" style="float: right" /> <input type="submit" class="mr-2 rev" on:click=move |_| set_menu.set(!menu.get()) value="menu" style="float: right" />
@ -46,14 +46,14 @@ fn main() {
<div class="two-col" > <div class="two-col" >
<div class="col-side sticky" class:hidden=move || menu.get() > <div class="col-side sticky" class:hidden=move || menu.get() >
<LoginBox <LoginBox
token_tx=set_cookie token_tx=set_token
token=cookie token=token
username_tx=set_username username_tx=set_username
username=username username=username
home_tl=home_tl home_tl=home_tl
/> />
<hr class="mt-1 mb-1" /> <hr class="mt-1 mb-1" />
<TimelineNavigation /> <Navigator />
<hr class="mt-1 mb-1" /> <hr class="mt-1 mb-1" />
<PostBox username=username /> <PostBox username=username />
</div> </div>
@ -75,11 +75,19 @@ fn main() {
view! { view! {
<main> <main>
<Routes> <Routes>
<Route path="/web" view=About /> <Route path="/web" view=move ||
if token.get().is_some() {
view! { <Redirect path="/web/home" /> }
} else {
view! { <Redirect path="/web/server" /> }
}
/>
<Route path="/web/home" view=move || view! { <TimelinePage name="home" tl=home_tl /> } /> <Route path="/web/home" view=move || view! { <TimelinePage name="home" tl=home_tl /> } />
<Route path="/web/server" view=move || view! { <TimelinePage name="server" tl=server_tl /> } /> <Route path="/web/server" view=move || view! { <TimelinePage name="server" tl=server_tl /> } />
<Route path="/web/about" view=About />
<Route path="/web/users/:id" view=UserPage /> <Route path="/web/users/:id" view=UserPage />
<Route path="/web/objects/:id" view=ObjectPage /> <Route path="/web/objects/:id" view=ObjectPage />