diff --git a/ui/src/components/ProtectedRoute.tsx b/ui/src/components/ProtectedRoute.tsx
index bb7320a..ffd179e 100644
--- a/ui/src/components/ProtectedRoute.tsx
+++ b/ui/src/components/ProtectedRoute.tsx
@@ -1,6 +1,6 @@
-import { ReactNode } from "react";
+import { ReactNode, useEffect } from "react";
 import { useSession } from "../contexts/SessionContext";
-import { Navigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 interface ProtectedRouteProps {
   children: ReactNode;
   to?: string;
@@ -8,9 +8,16 @@ interface ProtectedRouteProps {
 
 export const ProtectedRoute = ({ children, to }: ProtectedRouteProps) => {
   const { session } = useSession();
-  if (!session) {
-    return <Navigate to={to ?? "/login"} replace />;
-  }
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    let timer = setTimeout(() => {
+      if (!session) {
+        navigate(to ?? "/landing");
+      }
+    }, 300);
+    return () => clearTimeout(timer);
+  }, [session, navigate, to]);
 
   // If authenticated, render the protected component
   return <>{children}</>;