Index: frontend/src/App.tsx
===================================================================
--- frontend/src/App.tsx	(revision ebdd3d48efef8374b874c7bf90d571fa73c18f19)
+++ frontend/src/App.tsx	(revision dc30259a457c1232ee6ee1f6096c9fa50172e058)
@@ -1,6 +1,12 @@
-import { useState } from "react";
-import { createBrowserRouter, Outlet, RouterProvider } from "react-router-dom";
+import { useEffect, useState } from "react";
+import {
+	createBrowserRouter,
+	Outlet,
+	RouterProvider,
+	useLocation,
+} from "react-router-dom";
 import { ToastContainer } from "react-toastify";
 import "react-toastify/dist/ReactToastify.css";
+import LoadingSpinner from "./components/LoadingSpinner";
 import Sidebar from "./components/Sidebar";
 import { useAuth } from "./context/authContext";
@@ -15,5 +21,15 @@
 const MainLayout = () => {
 	const { user } = useAuth();
-	const [isSidebarOpen, setIsSidebarOpen] = useState(!!user);
+	const location = useLocation();
+	// show sidebar only if user is logged in and is on the landing page
+	const isLandingPage = location.pathname === "/";
+	const [isSidebarOpen, setIsSidebarOpen] = useState(!!user && isLandingPage);
+
+	// Open sidebar when user logs in and navigates to landing page
+	useEffect(() => {
+		if (user && isLandingPage) {
+			setIsSidebarOpen(true);
+		}
+	}, [user, isLandingPage]);
 
 	return (
@@ -51,9 +67,5 @@
 
 	if (isAuthLoading) {
-		return (
-			<div className="flex h-screen items-center justify-center bg-[#121212]">
-				<div className="w-12 h-12 border-4 border-white/10 border-t-[#1db954] rounded-full animate-spin"></div>
-			</div>
-		);
+		return <LoadingSpinner />;
 	}