From 58dbf42a3ac5d065d903bd58b77febca3ac63d94 Mon Sep 17 00:00:00 2001
From: Tasia Iso <tasiaiso@proton.me>
Date: Thu, 21 Mar 2024 22:29:39 +0100
Subject: [PATCH] theme picker: preselect the saved theme

---
 apps/user_settings/app.js                 | 2 +-
 apps/user_settings/tf-identity-manager.js | 2 +-
 apps/user_settings/tf-theme-picker.js     | 9 +++++++--
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/apps/user_settings/app.js b/apps/user_settings/app.js
index b6c42063..ca60d601 100644
--- a/apps/user_settings/app.js
+++ b/apps/user_settings/app.js
@@ -21,7 +21,7 @@ tfrpc.register(async function getThemes() {
 });
 tfrpc.register(async function getTheme() {
 	// TODO
-	return 'solarized';
+	return 'gruvbox';
 });
 tfrpc.register(async function setTheme() {
 	// TODO
diff --git a/apps/user_settings/tf-identity-manager.js b/apps/user_settings/tf-identity-manager.js
index bf501b42..789e5389 100644
--- a/apps/user_settings/tf-identity-manager.js
+++ b/apps/user_settings/tf-identity-manager.js
@@ -35,7 +35,7 @@ class TfIdentityManagerElement extends LitElement {
 		try {
 			const newID = await tfrpc.rpc.addID(words);
 
-			if (newID) alert('Successfully imported a new identity');
+			if (newID) alert('Successfully imported a new identity.');
 			else alert('This identity already exists or is invalid.');
 			await tfrpc.rpc.reload();
 		} catch (err) {
diff --git a/apps/user_settings/tf-theme-picker.js b/apps/user_settings/tf-theme-picker.js
index 2a74dfb1..48d6f794 100644
--- a/apps/user_settings/tf-theme-picker.js
+++ b/apps/user_settings/tf-theme-picker.js
@@ -1,4 +1,4 @@
-import {LitElement, html} from './lit-all.min.js';
+import {LitElement, html, nothing} from './lit-all.min.js';
 import * as tfrpc from '/static/tfrpc.js';
 
 class TfThemePickerElement extends LitElement {
@@ -16,6 +16,10 @@ class TfThemePickerElement extends LitElement {
 
 	async load() {
 		this.themes = await tfrpc.rpc.getThemes();
+		this.selected = await tfrpc.rpc.getTheme();
+
+		let select = this.renderRoot?.querySelector('#theme-select');
+		select.value = this.selected;
 	}
 
 	changed(event) {
@@ -32,11 +36,12 @@ class TfThemePickerElement extends LitElement {
 
 			<select
 				name="theme"
+				id="theme-select"
 				?hidden=${!this.themes?.length}
 				@change=${this.changed}
 			>
 				${(this.themes ?? []).map(
-					(id) => html`<option value=${id}>${id}</option>`
+					(name) => html`<option value=${name}>${name}</option>`
 				)}
 			</select>
 		`;