+layout.svelte RawHistoryFolder

1<script lang="ts">
2	import '../app.css';
3	import DesktopIcons from '$lib/components/desktop-icons.svelte';
4	import ChatRoom from '$lib/components/chat-room.svelte';
5	import { chatState } from '$lib/states/chat.svelte';
6
7	let { children, data } = $props();
8
9	$effect(() => {
10		console.debug('Layout reactive update - Session state:', {
11			timestamp: new Date().toISOString(),
12			hasUser: !!data.user,
13			userDetails: data.user ? {
14				nickname: data.user.nickname,
15				status: data.user.status,
16				id: data.user.id
17			} : null,
18			hasSession: !!data.session,
19			sessionDetails: data.session ? {
20				id: data.session.id,
21				expiresAt: new Date(data.session.expiresAt)
22			} : null,
23			cookiePresent: document.cookie.includes('session=')
24		});
25	});
26
27	$effect(() => {
28		console.debug('Updating global chatState with data.user:', data.user);
29		chatState.setCurrentUser(data.user);
30	});
31</script>
32
33<div class="windows-xp-bg">
34	{@render children()}
35</div>
36
37<style>
38	.windows-xp-bg {
39		position: fixed;
40		top: 0;
41		left: 0;
42		width: 100vw;
43		height: 100vh;
44		margin: 0;
45		padding: 0;
46		overflow: hidden;
47		background: linear-gradient(
48			to bottom,
49			#2195f2 0%,    /* Lighter blue at the top */
50			#4aa6e2 25%,   /* Mid-light blue */
51			#7ab8e0 50%,   /* Mid blue */
52			#86c55c 75%,   /* Blue-green transition */
53			#90d047 100%   /* Bright green at the bottom */
54		);
55	}
56</style>