feat: Update user active status on login/logout and improve chat UI

frontend/src/routes/+layout.server.ts

 import { type ServerLoad, redirect } from '@sveltejs/kit';
+import { patchUserAPI } from '$lib/api/users';
 
 const publicly_allowed = ['/login', '/register', '/tests', '/surveys', '/tutor/register'];
 
@@ -11,10 +12,17 @@ const isPublic = (path: string) => {
 	return false;
 };
 
-export const load: ServerLoad = async ({ locals, url }) => {
+export const load: ServerLoad = async ({ locals, url, fetch }) => {
+
 	if (locals.user == null || locals.user == undefined) {
 		if (!isPublic(url.pathname)) {
-			redirect(303, `/login`);
+			throw redirect(303, `/login`);
+		}
+	} else {
+		try {
+			await patchUserAPI(fetch, locals.user.id, { is_active: true });
+		} catch (error) {
+			console.error('Failed to update user status:', error);
 		}
 	}
 

frontend/src/routes/logout/+page.server.ts

 import { type ServerLoad, redirect } from '@sveltejs/kit';
+import { patchUserAPI } from '$lib/api/users';
+
+export const load: ServerLoad = async ({ cookies, locals, fetch }) => {
+	if (locals.user) {
+		try {
+			const success = await patchUserAPI(fetch, locals.user.id, { is_active: false });
+			if (!success) {
+				console.error('Failed to update user status.');
+			}
+		} catch (error) {
+			console.error('Error updating user status:', error);
+		}
+	}
 
-export const load: ServerLoad = async ({ cookies }) => {
 	cookies.set('access_token_cookie', '', { maxAge: -1, path: '/' });
 	cookies.set('refresh_token_cookie', '', { maxAge: -1, path: '/' });
 
-	redirect(303, '/login');
+	locals.user = null;
+
+	throw redirect(303, '/login');
 };

frontend/src/routes/sessions/[id]/Message.svelte

@@ -186,28 +186,20 @@
 		await message.deleteFeedback(feedback);
 	}
 
-	function getUserStatus(user: User, isInConversation: boolean): string {
-		console.log('status', user.is_active);
+	function getUserStatus(user: User | null, isInConversation: boolean): string {
+		if (!user) {
+			return 'red';
+		}
+
 		if (!user.is_active) {
 			return 'red';
 		}
+
 		if (isInConversation) {
 			return 'green';
 		}
-		return 'orange';
-	}
 
-	function getUserStatusTooltip(status: string): string {
-		switch (status) {
-			case 'green':
-				return 'User is in this conversation';
-			case 'orange':
-				return 'User is connected but not in this conversation';
-			case 'red':
-				return 'User is not connected to LL';
-			default:
-				return '';
-		}
+		return 'orange';
 	}
 </script>
 
@@ -229,9 +221,7 @@
 					? 'bg-green-500'
 					: getUserStatus(message.user, false) === 'orange'
 						? 'bg-orange-500'
-						: getUserStatus(message.user, false) === 'red'
-							? 'bg-red-500'
-							: ''
+						: 'bg-red-500'
 			}`}
 		></div>
 	</div>