From 01beeeca5c3daf1feedfe579a0aa09a77c8032d9 Mon Sep 17 00:00:00 2001
From: alemi <me@alemi.dev>
Date: Mon, 13 May 2024 01:20:48 +0200
Subject: [PATCH] fix(web): better config page, debug under config

---
 web/src/app.rs  |  4 ++--
 web/src/page.rs | 62 ++++++++++++++++++++-----------------------------
 2 files changed, 27 insertions(+), 39 deletions(-)

diff --git a/web/src/app.rs b/web/src/app.rs
index 735d88a4..16c6d672 100644
--- a/web/src/app.rs
+++ b/web/src/app.rs
@@ -107,13 +107,13 @@ 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=move || view! { <ConfigPage setter=set_config /> } />
 											<Route path="/web/about" view=AboutPage />
+											<Route path="/web/config" view=move || view! { <ConfigPage setter=set_config /> } />
+											<Route path="/web/config/dev" view=DebugPage />
 
 											<Route path="/web/users/:id" view=move || view! { <UserPage tl=user_tl /> } />
 											<Route path="/web/objects/:id" view=move || view! { <ObjectPage tl=context_tl /> } />
 
-											<Route path="/web/debug" view=DebugPage />
 											<Route path="/web/search" view=SearchPage />
 
 											<Route path="/" view=move || view! { <Redirect path="/web" /> } />
diff --git a/web/src/page.rs b/web/src/page.rs
index 6f3562cb..9379fdc1 100644
--- a/web/src/page.rs
+++ b/web/src/page.rs
@@ -53,46 +53,34 @@ pub fn ConfigPage(setter: WriteSignal<Config>) -> impl IntoView {
 	view! {
 		<div>
 			<Breadcrumb>config</Breadcrumb>
+			<p class="center mt-0"><small>config is saved in your browser local storage</small></p>
 			<p>
-				<input type="checkbox" title="likes" class="mr-1"
-					prop:checked=get_cfg!(loop_videos)
-					on:input=set_cfg!(loop_videos)
-				/> loop videos
+				<span title="embedded video attachments will loop like gifs if this option is enabled">
+					<input type="checkbox" class="mr-1"
+						prop:checked=get_cfg!(loop_videos)
+						on:input=set_cfg!(loop_videos)
+					/> loop videos
+				</span>
 			</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
+				<span title="any post with a summary is considered to have a content warning, and collapsed by default if this option is enabled">
+					<input type="checkbox" class="mr-1"
+						prop:checked=get_cfg!(collapse_content_warnings)
+						on:input=set_cfg!(collapse_content_warnings)
+					/> collapse content warnings
+				</span>
 			</p>
-			<div class="mt-s mb-s" >
-				<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>
+			<hr />
+			<p><code title="unchecked elements won't show in timelines">filters</code></p>
+			<ul>
+					<li><span title="like activities"><input type="checkbox" prop:checked=get_cfg!(filter likes) on:input=set_cfg!(filter likes) />" likes"</span></li>
+					<li><span title="create activities with object"><input type="checkbox" prop:checked=get_cfg!(filter creates) on:input=set_cfg!(filter creates)/>" creates"</span></li>
+					<li><span title="announce activities with object"><input type="checkbox" prop:checked=get_cfg!(filter announces) on:input=set_cfg!(filter announces) />" announces"</span></li>
+					<li><span title="follow, accept and reject activities"><input type="checkbox" prop:checked=get_cfg!(filter follows) on:input=set_cfg!(filter follows) />" follows"</span></li>
+					<li><span title="objects without a related activity to display"><input type="checkbox" prop:checked=get_cfg!(filter orphans) on:input=set_cfg!(filter orphans) />" orphans"</span></li>
+			</ul>
+			<hr />
+			<p><a href="/web/config/dev" title="access the devtools page">devtools</a></p>
 		</div>
 	}
 }
@@ -359,7 +347,7 @@ pub fn DebugPage() -> impl IntoView {
 	let (query, set_query) = create_signal("".to_string());
 	view! {
 		<div>
-			<Breadcrumb back=true>debug</Breadcrumb>
+			<Breadcrumb back=true>config :: devtools</Breadcrumb>
 			<div class="mt-1" >
 				<form on:submit=move|ev| {
 					ev.prevent_default();