From 7e08e187853c4bed00a73f0a7cb079ee551c60f6 Mon Sep 17 00:00:00 2001
From: Izalia Mae <izalia@barkshark.xyz>
Date: Fri, 21 Jun 2024 02:37:13 -0400
Subject: [PATCH] add help tooltips to config page

---
 relay/frontend/page/admin-config.haml |  6 ++++++
 relay/frontend/static/style.css       |  6 +++++-
 relay/views/frontend.py               | 13 ++++++++++++-
 3 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/relay/frontend/page/admin-config.haml b/relay/frontend/page/admin-config.haml
index 57fde84..8dc0ad9 100644
--- a/relay/frontend/page/admin-config.haml
+++ b/relay/frontend/page/admin-config.haml
@@ -11,19 +11,25 @@
 
 		.grid-2col
 			%label(for="name") << Name
+			%i(class="bi bi-question-circle-fill" title="{{desc.name}}")
 			%input(id = "name" placeholder="Relay Name" value="{{config.name or ''}}")
 
 			%label(for="note") << Description
+			%i(class="bi bi-question-circle-fill" title="{{desc.note}}")
 			%textarea(id="note" value="{{config.note or ''}}") << {{config.note}}
 
 			%label(for="theme") << Color Theme
+			%i(class="bi bi-question-circle-fill" title="{{desc.theme}}")
 			=func.new_select("theme", config.theme, themes)
 
 			%label(for="log-level") << Log Level
+			%i(class="bi bi-question-circle-fill" title="{{desc.log_level}}")
 			=func.new_select("log-level", config.log_level.name, levels)
 
 			%label(for="whitelist-enabled") << Whitelist
+			%i(class="bi bi-question-circle-fill" title="{{desc.whitelist_enabled}}")
 			=func.new_checkbox("whitelist-enabled", config.whitelist_enabled)
 
 			%label(for="approval-required") << Approval Required
+			%i(class="bi bi-question-circle-fill" title="{{desc.approval_required}}")
 			=func.new_checkbox("approval-required", config.approval_required)
diff --git a/relay/frontend/static/style.css b/relay/frontend/static/style.css
index 6ec9316..f0d72f5 100644
--- a/relay/frontend/static/style.css
+++ b/relay/frontend/static/style.css
@@ -297,13 +297,13 @@ textarea {
 	border: 1px solid var(--error-border) !important;
 }
 
+/* create .grid base class and .2col and 3col classes */
 .grid-2col {
 	display: grid;
 	grid-template-columns: max-content auto;
 	grid-gap: var(--spacing);
 	margin-bottom: var(--spacing);
 	align-items: center;
-	
 }
 
 .message {
@@ -333,6 +333,10 @@ textarea {
 	justify-self: left;
 }
 
+#content.page-config .grid-2col {
+	grid-template-columns: max-content max-content auto;
+}
+
 
 @keyframes show_toast {
 	0% {
diff --git a/relay/views/frontend.py b/relay/views/frontend.py
index 5dfb43a..5ec16fc 100644
--- a/relay/views/frontend.py
+++ b/relay/views/frontend.py
@@ -199,7 +199,18 @@ class AdminConfig(View):
 		context: dict[str, Any] = {
 			'themes': tuple(THEMES.keys()),
 			'levels': tuple(level.name for level in LogLevel),
-			'message': message
+			'message': message,
+			'desc': {
+				"name": "Name of the relay to be displayed in the header of the pages and in " +
+					"the actor endpoint.",
+				"note": "Description of the relay to be displayed on the front page and as the " +
+					"bio in the actor endpoint.",
+				"theme": "Color theme to use on the web pages.",
+				"log_level": "Minimum level of logging messages to print to the console.",
+				"whitelist_enabled": "Only allow instances in the whitelist to be able to follow.",
+				"approval_required": "Require instances not on the whitelist to be approved by " +
+					"and admin. The `whitelist-enabled` setting is ignored when this is enabled."
+			}
 		}
 
 		data = self.template.render('page/admin-config.haml', self, **context)