chore: persists user profile theme changes also in session cache, so …

…it's not lost on page reload.
arnoldknott · Feb 28, 2025 · 305fb87 · 305fb87
1 parent 8ae12cb
commit 305fb87
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 15 deletions.
diff --git a/frontend_svelte/src/routes/(layout)/+layout.svelte b/frontend_svelte/src/routes/(layout)/+layout.svelte
@@ -256,15 +256,15 @@
 				>
 					<form
 						method="POST"
-						action="/?putMe"
+						action="?/putme"
 						id="user_profile_and_account"
 						use:enhance={updateProfileAccount}
 						bind:this={profileAccountForm}
 					>
 						<li class="flex items-center gap-2">
 							<span class="icon-[material-symbols--palette-outline] size-6"></span>
 							<span class="grow"> Theming</span>
-							<button aria-label="modeToggler">
+							<button aria-label="modeToggler" type="button">
 								<label id="modeToggler" class="swap swap-rotate">
 									<input type="checkbox" onclick={toggleMode} />
 									<span class="icon-[tabler--sun] swap-on size-6"></span>

diff --git a/frontend_svelte/src/routes/(layout)/+page.server.ts b/frontend_svelte/src/routes/(layout)/+page.server.ts
@@ -1,19 +1,18 @@
 import type { Actions } from './$types';
 import { backendAPI } from '$lib/server/apis';
 import { fail } from '@sveltejs/kit';
+import { redisCache } from '$lib/server/cache';
 
 export const actions: Actions = {
-	default: async ({ locals, request }) => {
+	putme: async ({ locals, request }) => {
 		const data = await request.formData();
 		const sessionId = locals.sessionData.sessionId;
-		console.log('=== layout - layout.server - putProfile - sessionData.userProfile.id ===');
-		console.log(locals.sessionData.userProfile?.id);
-		console.log('=== layout - layout.server - putProfile - data ===');
-		console.log(data);
+		// console.log('=== layout - layout.server - putProfile - sessionData.userProfile.id ===');
+		// console.log(locals.sessionData.userProfile?.id);
+		// console.log('=== layout - layout.server - putProfile - data ===');
+		// console.log(data);
 		if (locals.sessionData.userProfile?.id) {
 			const variant = data.get('variant-picker');
-			console.log('=== layout - layout.server - putProfile - variant ===');
-			console.log(variant);
 			const contrast = parseFloat(data.get('contrast') as string);
 
 			const payload = {
@@ -31,12 +30,27 @@ export const actions: Actions = {
 			}
 			// console.log('=== layout - layout.server - putProfile - locals.sessionData.userProfile ===');
 			// console.log(locals.sessionData.userProfile);
-			locals.sessionData.userProfile.user_profile.theme_color = payload.user_profile.theme_color;
-			locals.sessionData.userProfile.user_profile.theme_variant =
-				payload.user_profile.theme_variant;
-			locals.sessionData.userProfile.user_profile.contrast = payload.user_profile.contrast;
-			console.log('=== layout - layout.server - putProfile - locals.sessionData.userProfile ===');
-			console.log(locals.sessionData.userProfile);
+			await redisCache.setSession(
+				sessionId,
+				'$.userProfile.user_profile.theme_color',
+				JSON.stringify(payload.user_profile.theme_color)
+			);
+			await redisCache.setSession(
+				sessionId,
+				'$.userProfile.user_profile.theme_variant',
+				JSON.stringify(payload.user_profile.theme_variant)
+			);
+			await redisCache.setSession(
+				sessionId,
+				'$.userProfile.user_profile.contrast',
+				JSON.stringify(payload.user_profile.contrast)
+			);
+			// locals.sessionData.userProfile.user_profile.theme_color = payload.user_profile.theme_color;
+			// locals.sessionData.userProfile.user_profile.theme_variant =
+			// 	payload.user_profile.theme_variant;
+			// locals.sessionData.userProfile.user_profile.contrast = payload.user_profile.contrast;
+			// console.log('=== layout - layout.server - putProfile - locals.sessionData.userProfile ===');
+			// console.log(locals.sessionData.userProfile);
 		}
 	}
 };