'use client'; import { useState, useEffect } from 'react'; import Link from 'next/link'; import Image from 'next/image'; import { Geist, Geist_Mono } from "next/font/google"; import "../../globals.css"; import DatabaseInitializer from "@/lib/components/DatabaseInitializer"; import UserMenu from "@/lib/components/UserMenu"; import ThemeToggle from "@/lib/components/ThemeToggle"; import { ThemeProvider } from "@/lib/context/ThemeContext"; const geistSans = Geist({ variable: "--font-geist-sans", subsets: ["latin"], }); const geistMono = Geist_Mono({ variable: "--font-geist-mono", subsets: ["latin"], }); interface User { id: string; username: string; avatar: string | null; } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode; }>) { const [user, setUser] = useState(null); const [isLoading, setIsLoading] = useState(true); useEffect(() => { const fetchUser = async () => { try { const response = await fetch('/api/auth'); const data = await response.json(); if (data.authenticated) { setUser(data.user); } } catch (error) { console.error('Error fetching user:', error); } finally { setIsLoading(false); } }; fetchUser(); }, []); if (isLoading) { return (

Loading...

); } return (
{children}
 ); }