feat(web): filter timelines, loop videos, open cws

Cargo.lock

@@ -4510,6 +4510,8 @@ dependencies = [
  "mdhtml",
  "reqwest",
  "serde",
+ "serde-inline-default",
+ "serde_default",
  "serde_json",
  "thiserror",
  "tracing",

web/Cargo.toml

@@ -19,6 +19,8 @@ console_error_panic_hook = "0.1"
 thiserror = "1"
 serde = { version = "1", features = ["derive"] }
 serde_json = "1"
+serde_default = "0.1"
+serde-inline-default = "0.2"
 dashmap = "5.5"
 leptos = { version = "0.6", features = ["csr", "tracing"] }
 leptos_router = { version = "0.6", features = ["csr"] }

web/src/app.rs

@@ -2,7 +2,7 @@ use leptos::*;
 use leptos_router::*;
 use crate::prelude::*;
 
-use leptos_use::{use_cookie, use_cookie_with_options, utils::FromToStringCodec, UseCookieOptions};
+use leptos_use::{storage::use_local_storage, use_cookie, use_cookie_with_options, utils::{FromToStringCodec, JsonCodec}, UseCookieOptions};
 
 
 #[component]
@@ -12,10 +12,12 @@ pub fn App() -> impl IntoView {
 		UseCookieOptions::default()
 			.max_age(1000 * 60 * 60 * 6)
 	);
+	let (config, set_config, _) = use_local_storage::<crate::Config, JsonCodec>("config");
 	let (userid, set_userid) = use_cookie::<String, FromToStringCodec>("user_id");
 
 	let auth = Auth { token, userid };
 	provide_context(auth);
+	provide_context(config);
 
 	let username = auth.userid.get_untracked()
 		.map(|x| x.split('/').last().unwrap_or_default().to_string())
@@ -105,7 +107,7 @@ pub fn App() -> impl IntoView {
 											<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/config" view=ConfigPage />
+											<Route path="/web/config" view=move || view! { <ConfigPage setter=set_config /> } />
 											<Route path="/web/about" view=AboutPage />
 
 											<Route path="/web/users/:id" view=move || view! { <UserPage tl=user_tl /> } />

web/src/components/activity.rs

@@ -33,14 +33,25 @@ pub fn ActivityLine(activity: crate::Object) -> impl IntoView {
 }
 
 #[component]
-pub fn Item(item: crate::Object) -> impl IntoView {
+pub fn Item(
+	item: crate::Object,
+	#[prop(optional)] sep: bool,
+) -> impl IntoView {
+	let config = use_context::<Signal<crate::Config>>().expect("missing config context");
 	let id = item.id().unwrap_or_default().to_string();
+	let sep = if sep { Some(view! { <hr /> }) } else { None };
 	match item.object_type() {
 		// special case for placeholder activities
-		Some(apb::ObjectType::Note) | Some(apb::ObjectType::Document(_)) =>
-			view! { <Object object=item /> }.into_view(),
+		Some(apb::ObjectType::Note) | Some(apb::ObjectType::Document(_)) => (move || {
+			if config.get().filters.orphans {
+				Some(view! { <Object object=item.clone() />{sep.clone()} })
+			} else {
+				None
+			}
+		}).into_view(),
 		// everything else
-		Some(apb::ObjectType::Activity(t)) => {
+		Some(apb::ObjectType::Activity(t)) => (move || {
+			if config.get().filters.visible(apb::ObjectType::Activity(t)) {
 				let object_id = item.object().id().unwrap_or_default();
 				let object = match t {
 					apb::ActivityType::Create | apb::ActivityType::Announce => 
@@ -52,17 +63,21 @@ pub fn Item(item: crate::Object) -> impl IntoView {
 							view! {
 								<div class="ml-1">
 									<ActorBanner object=obj />
-								<FollowRequestButtons activity_id=id actor_id=object_id />
+									<FollowRequestButtons activity_id=id.clone() actor_id=object_id />
 								</div>
 							}
 						}.into_view()),
 					_ => None,
 				};
-			view! {
-				<ActivityLine activity=item />
+				Some(view! {
+					<ActivityLine activity=item.clone() />
 					{object}
-			}.into_view()
-		},
+					{sep.clone()}
+				})
+			} else {
+				None
+			}
+		}).into_view(),
 		// should never happen
 		_ => view! { <p><code>type not implemented</code></p> }.into_view(),
 	}

web/src/components/object.rs

@@ -11,6 +11,7 @@ pub fn Attachment(
 	#[prop(optional)]
 	sensitive: bool
 ) -> impl IntoView {
+	let config = use_context::<Signal<crate::Config>>().expect("missing config context");
 	let (expand, set_expand) = create_signal(false);
 	let href = object.url().id().unwrap_or_default();
 	let media_type = object.media_type()
@@ -47,7 +48,7 @@ pub fn Attachment(
 					on:click=move |_| set_expand.set(!expand.get())
 					title={object.name().unwrap_or_default().to_string()}
 				>
-					<video controls loop class="attachment" class:expand=expand >
+					<video controls class="attachment" class:expand=expand prop:loop=move || config.get().loop_videos  >
 						{move || if sensitive && !expand.get() { None } else { Some(view! { <source src={_href.clone()} type={media_type.clone()} /> }) }}
 						<a href={href.clone()} target="_blank">video clip</a>
 					</video>
@@ -58,7 +59,7 @@ pub fn Attachment(
 		"audio" =>
 			view! {
 				<p class="center">
-					<audio controls class="w-100">
+					<audio controls class="w-100" prop:loop=move || config.get().loop_videos >
 						<source src={href.clone()} type={media_type} />
 						<a href={href} target="_blank">audio clip</a>
 					</audio>
@@ -106,7 +107,7 @@ pub fn Object(object: crate::Object) -> impl IntoView {
 		Some(view! { <div class="pb-1"></div> })
 	};
 	let post_inner = view! {
-		<Summary summary=object.summary().map(|x| x.to_string()) open=false >
+		<Summary summary=object.summary().map(|x| x.to_string()) >
 			<p inner_html={content}></p>
 			{attachments_padding}
 			{attachments}
@@ -152,11 +153,12 @@ pub fn Object(object: crate::Object) -> impl IntoView {
 }
 
 #[component]
-pub fn Summary(summary: Option<String>, open: bool, children: Children) -> impl IntoView {
+pub fn Summary(summary: Option<String>, children: Children) -> impl IntoView {
+	let config = use_context::<Signal<crate::Config>>().expect("missing config context");
 	match summary.filter(|x| !x.is_empty()) {
 		None => children().into_view(),
 		Some(summary) => view! {
-			<details class="pa-s" prop:open=open>
+			<details class="pa-s" prop:open=move || !config.get().collapse_content_warnings>
 				<summary>
 					<code class="cw center color ml-s w-100">{summary}</code>
 				</summary>

web/src/components/timeline.rs

@@ -140,8 +140,7 @@ pub fn TimelineFeed(tl: Timeline) -> impl IntoView {
 			children=move |id: String| {
 				match CACHE.get(&id) {
 					Some(i) => view! {
-						<Item item=i />
-						<hr />
+						<Item item=i sep=true />
 					}.into_view(),
 					None => view! {
 						<p><code>{id}</code>" "[<a href={uri}>go</a>]</p>

web/src/config.rs

@@ -0,0 +1,47 @@
+
+#[serde_inline_default::serde_inline_default]
+#[derive(Debug, Clone, PartialEq, Eq, serde::Serialize, serde::Deserialize, serde_default::DefaultFromSerde)]
+pub struct Config {
+	#[serde(default)]
+	pub filters: FiltersConfig,
+
+	#[serde_inline_default(true)]
+	pub collapse_content_warnings: bool,
+
+	#[serde_inline_default(true)]
+	pub loop_videos: bool,
+}
+
+#[serde_inline_default::serde_inline_default]
+#[derive(Debug, Clone, PartialEq, Eq, serde::Serialize, serde::Deserialize, serde_default::DefaultFromSerde)]
+pub struct FiltersConfig {
+	#[serde_inline_default(false)]
+	pub likes: bool,
+
+	#[serde_inline_default(true)]
+	pub creates: bool,
+
+	#[serde_inline_default(true)]
+	pub announces: bool,
+
+	#[serde_inline_default(true)]
+	pub follows: bool,
+
+	#[serde_inline_default(true)]
+	pub orphans: bool,
+}
+
+impl FiltersConfig {
+	pub fn visible(&self, object_type: apb::ObjectType) -> bool {
+		match object_type {
+			apb::ObjectType::Note | apb::ObjectType::Document(_) => self.orphans,
+			apb::ObjectType::Activity(apb::ActivityType::Like) => self.likes,
+			apb::ObjectType::Activity(apb::ActivityType::Create) => self.creates,
+			apb::ObjectType::Activity(apb::ActivityType::Announce) => self.announces,
+			apb::ObjectType::Activity(
+				apb::ActivityType::Follow | apb::ActivityType::Accept(_) | apb::ActivityType::Reject(_)
+			) => self.follows,
+			_ => true,
+		}
+	}
+}

web/src/control.rs

@@ -22,6 +22,7 @@ pub fn Navigator() -> impl IntoView {
 			<tr><td colspan="2"><a href="/web/home"><input class="w-100" type="submit" class:hidden=move || !auth.present() value="home timeline" /></a></td></tr>
 			<tr><td colspan="2"><a href="/web/server"><input class="w-100" type="submit" value="server timeline" /></a></td></tr>
 			<tr><td colspan="2"><a href="/web/about"><input class="w-100" type="submit" value="about" /></a></td></tr>
+			<tr><td colspan="2"><a href="/web/config"><input class="w-100" type="submit" value="config" /></a></td></tr>
 			<tr><td colspan="2"><a href="/web/debug"><input class="w-100" type="submit" value="debug" class:hidden=move|| !auth.present() /></a></td></tr>
 		</table>
 	}

web/src/lib.rs

@@ -3,8 +3,10 @@ mod auth;
 mod components;
 mod page;
 mod control;
+mod config;
 
 pub use app::App;
+pub use config::Config;
 
 pub mod prelude;
 

web/src/page.rs

@@ -4,7 +4,7 @@ use apb::{ActivityMut, Actor, Base, Object, ObjectMut};
 
 use leptos::*;
 use leptos_router::*;
-use crate::{prelude::*, DEFAULT_AVATAR_URL};
+use crate::{prelude::*, Config, DEFAULT_AVATAR_URL};
 
 #[component]
 pub fn AboutPage() -> impl IntoView {
@@ -21,17 +21,83 @@ pub fn AboutPage() -> impl IntoView {
 }
 
 #[component]
-pub fn ConfigPage() -> impl IntoView {
+pub fn ConfigPage(setter: WriteSignal<Config>) -> impl IntoView {
+	let config = use_context::<Signal<Config>>().expect("missing config context");
+
+	macro_rules! get_cfg {
+		(filter $field:ident) => {
+			move || config.get().filters.$field
+		};
+		($field:ident) => {
+			move || config.get().$field
+		};
+	}
+
+	macro_rules! set_cfg {
+		($field:ident) => {
+			move |ev| {
+				let mut mock = config.get();
+				mock.$field = event_target_checked(&ev);
+				setter.set(mock);
+			}
+		};
+		(filter $field:ident) => {
+			move |ev| {
+				let mut mock = config.get();
+				mock.filters.$field = event_target_checked(&ev);
+				setter.set(mock);
+			}
+		};
+	}
+
 	view! {
 		<div>
 			<Breadcrumb>config</Breadcrumb>
+			<p>
+				<input type="checkbox" title="likes" class="mr-1"
+					prop:checked=get_cfg!(loop_videos)
+					on:input=set_cfg!(loop_videos)
+				/> loop videos
+			</p>
+			<p>
+				<input type="checkbox" title="likes" class="mr-1"
+					prop:checked=get_cfg!(collapse_content_warnings)
+					on:input=set_cfg!(collapse_content_warnings)
+				/> collapse content warnings
+			</p>
 			<div class="mt-s mb-s" >
-				<p><code>"not implemented :("</code></p>
+				<table class="ma-3 center">
+					<tr>
+						<th></th>
+						<th>filters</th>
+					</tr>
+					<tr>
+						<td><input type="checkbox" prop:checked=get_cfg!(filter likes) on:input=set_cfg!(filter likes) /></td>
+						<td>likes</td>
+					</tr>
+					<tr>
+						<td><input type="checkbox" prop:checked=get_cfg!(filter creates) on:input=set_cfg!(filter creates)/></td>
+						<td>creates</td>
+					</tr>
+					<tr>
+						<td><input type="checkbox" prop:checked=get_cfg!(filter announces) on:input=set_cfg!(filter announces) /></td>
+						<td>announces</td>
+					</tr>
+					<tr>
+						<td><input type="checkbox" prop:checked=get_cfg!(filter follows) on:input=set_cfg!(filter follows) /></td>
+						<td>follows</td>
+					</tr>
+					<tr>
+						<td><input type="checkbox" prop:checked=get_cfg!(filter orphans) on:input=set_cfg!(filter orphans) /></td>
+						<td>orphans</td>
+					</tr>
+				</table>
 			</div>
 		</div>
 	}
 }
 
+
 fn send_follow_request(target: String) {
 	let auth = use_context::<Auth>().expect("missing auth context");
 	spawn_local(async move {