fix: nightmode toggle out of sync on page load

frontend/src/App.vue

@@ -57,8 +57,6 @@ const { openModal, closeCurrentModal } = modalsStore;
 const aModalIsOpen = computed(() => Object.keys(activeModals.value).length > 0);
 
 const toggleNightMode = () => {
-	localStorage.setItem("nightmode", `${!nightmode.value}`);
-
 	if (loggedIn.value) {
 		socket.dispatch(
 			"users.updatePreferences",

frontend/src/components/MainHeader.vue

@@ -65,8 +65,7 @@ watch(localNightmode, nightmode => {
 });
 
 onMounted(async () => {
-	localNightmode.value = JSON.parse(localStorage.getItem("nightmode"));
-	if (localNightmode.value === null) localNightmode.value = false;
+	localNightmode.value = localStorage.getItem("nightmode") === "true";
 
 	frontendDomain.value = await lofig.get("frontendDomain");
 	siteSettings.value = await lofig.get("siteSettings");

frontend/src/main.ts

@@ -375,7 +375,6 @@ createSocket().then(async socket => {
 			changeAutoSkipDisliked(preferences.autoSkipDisliked);
 
 		if (preferences.nightmode !== undefined) {
-			localStorage.setItem("nightmode", preferences.nightmode);
 			changeNightmode(preferences.nightmode);
 		}
 

frontend/src/stores/userPreferences.ts

@@ -11,6 +11,7 @@ export const useUserPreferencesStore = defineStore("userPreferences", {
 	actions: {
 		changeNightmode(nightmode) {
 			this.nightmode = nightmode;
+			localStorage.setItem("nightmode", `${nightmode}`);
 		},
 		changeAutoSkipDisliked(autoSkipDisliked) {
 			this.autoSkipDisliked = autoSkipDisliked;