From 5b4c278b837ae58309afbcace5c9c031403da7e6 Mon Sep 17 00:00:00 2001
From: JustTemmie <47639983+JustTemmie@users.noreply.github.com>
Date: Fri, 11 Jul 2025 23:48:03 +0200
Subject: [PATCH] refactor: load and save settings from a single object

---
 app.vue                                       | 18 ++++++----------
 .../Settings/AppSettings/Appearance.vue       |  4 +++-
 utils/settingLoad.ts                          | 19 +++++++++++++++++
 utils/settingSave.ts                          | 21 +++++++++++++++++++
 4 files changed, 49 insertions(+), 13 deletions(-)
 create mode 100644 utils/settingLoad.ts
 create mode 100644 utils/settingSave.ts

diff --git a/app.vue b/app.vue
index 758cde0..beab80b 100644
--- a/app.vue
+++ b/app.vue
@@ -8,6 +8,7 @@
 <script lang="ts" setup>
 import ContextMenu from '~/components/ContextMenu.vue';
 import { render } from 'vue';
+import settingLoad from './utils/settingLoad';
 
 const banner = useState("banner", () => false);
 
@@ -43,21 +44,14 @@ function contextMenuHandler(e: MouseEvent) {
 	//]);
 }
 
-let currentTheme = "dark" // default theme
-const savedTheme = localStorage.getItem("selectedTheme");
-if (savedTheme) {
-	currentTheme = savedTheme;
-}
-
+const currentTheme = settingLoad("selectedThemeUrl") ?? "dark"
 const baseURL = useRuntimeConfig().app.baseURL;
 
 useHead({
-  link: [
-    {
-      rel: "stylesheet",
-      href: `${baseURL}themes/${currentTheme}.css`
-    }
-  ]
+  link: [{
+		rel: "stylesheet",
+		href: `${baseURL}themes/${currentTheme}.css`
+	}]
 })
 </script>
 
diff --git a/components/Settings/AppSettings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue
index 3adfda6..a35e719 100644
--- a/components/Settings/AppSettings/Appearance.vue
+++ b/components/Settings/AppSettings/Appearance.vue
@@ -26,6 +26,8 @@
 </template>
 
 <script lang="ts" setup>
+import settingSave from '~/utils/settingSave';
+
 const runtimeConfig = useRuntimeConfig()
 const defaultThemes = runtimeConfig.public.defaultThemes
 const baseURL = runtimeConfig.app.baseURL;
@@ -46,7 +48,7 @@ function changeTheme(id: string, url: string) {
     return;
   }
 
-  localStorage.setItem("selectedTheme", id);
+  settingSave("selectedThemeUrl", id)
 
   // if the theme didn't originally load for some reason, create it
   if (!themeLinkElement) {
diff --git a/utils/settingLoad.ts b/utils/settingLoad.ts
new file mode 100644
index 0000000..d0f315c
--- /dev/null
+++ b/utils/settingLoad.ts
@@ -0,0 +1,19 @@
+export default (key: string): any => {
+	let clientSettingsItem: string | null = localStorage.getItem("clientSettings")
+	if (typeof clientSettingsItem != "string") {
+		clientSettingsItem = "{}"
+	}
+
+	let clientSettings: { [key: string]: any } = {}
+	try {
+		clientSettings = JSON.parse(clientSettingsItem)
+	} catch {
+		clientSettings = {}
+	}
+
+	if (typeof clientSettings !== "object") {
+		clientSettings = {}
+	}
+
+	return clientSettings[key]
+}
\ No newline at end of file
diff --git a/utils/settingSave.ts b/utils/settingSave.ts
new file mode 100644
index 0000000..fbdefd7
--- /dev/null
+++ b/utils/settingSave.ts
@@ -0,0 +1,21 @@
+export default (key: string, value: any): void => {
+	let clientSettingsItem: string | null = localStorage.getItem("clientSettings")
+	if (typeof clientSettingsItem != "string") {
+		clientSettingsItem = "{}"
+	}
+
+	let clientSettings: { [key: string]: any } = {}
+	try {
+		clientSettings = JSON.parse(clientSettingsItem)
+	} catch {
+		clientSettings = {}
+	}
+
+	if (typeof clientSettings !== "object") {
+		clientSettings = {}
+	}
+
+	clientSettings[key] = value
+
+	localStorage.setItem("clientSettings", JSON.stringify(clientSettings))
+}
\ No newline at end of file