diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index 6028a8cb..f0187471 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -160,6 +160,6 @@ deploy:dev:
 #   variables:
 #     S3_BUCKET: "lti-erp.mbugroup.id"
 #     CLOUDFRONT_DISTRIBUTION_ID: "ddfd"
-#   environment:
+#   environment: 
 #     name: production
 
diff --git a/src/app/page.tsx b/src/app/page.tsx
index db9638df..2f22f5aa 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,11 +1,18 @@
-import { redirect } from 'next/navigation';
+'use client';
+
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
 
 export default function Home() {
-  redirect('/dashboard');
+  const router = useRouter();
+
+  useEffect(() => {
+    router.replace('/dashboard');
+  }, [router]);
 
   return (
     <main className='w-full h-full min-h-screen flex flex-row justify-center items-center'>
-      <h1>LTI ERP</h1>
+      <span className='loading loading-spinner loading-lg'></span>
     </main>
   );
 }
diff --git a/src/components/helper/RequireAuth.tsx b/src/components/helper/RequireAuth.tsx
index 40e13321..22b22b03 100644
--- a/src/components/helper/RequireAuth.tsx
+++ b/src/components/helper/RequireAuth.tsx
@@ -38,18 +38,23 @@ const RequireAuth = ({ children }: RequireAuthProps) => {
   // Explicitly handle 401 redirect from the component level
   useEffect(() => {
     if (userErrorResponse?.response?.status === 401) {
+      // Clear cache to prevent stale data from rendering children
+      // mutate('/sso/userinfo', undefined, { revalidate: false }); // Optional: if using global mutate
+      setUser(undefined);
       redirectToSSO();
     }
-  }, [userErrorResponse]);
+  }, [userErrorResponse, setUser]);
 
-  // TODO: uncomment this later
-  // if (isLoadingUserResponse && !userResponse) {
-  //   return (
-  //     <div className='w-full flex flex-row justify-center items-center p-4'>
-  //       <span className='loading loading-spinner loading-xl' />
-  //     </div>
-  //   );
-  // }
+  if (
+    (isLoadingUserResponse && !userResponse && !userErrorResponse) ||
+    (!userResponse && !userErrorResponse)
+  ) {
+    return (
+      <div className='w-full flex flex-row justify-center items-center p-4'>
+        <span className='loading loading-spinner loading-xl' />
+      </div>
+    );
+  }
 
   if (userErrorResponse) {
     return (
diff --git a/src/lib/auth-helper.ts b/src/lib/auth-helper.ts
index 97d31a9f..bf05b70e 100644
--- a/src/lib/auth-helper.ts
+++ b/src/lib/auth-helper.ts
@@ -10,9 +10,9 @@ export const redirectToSSO = () => {
   const lastRedirect = sessionStorage.getItem('auth_redirect_timestamp');
   const now = Date.now();
 
-  // Loop protection: allow redirect only if last one was > 2 seconds ago
+  // Loop protection: allow redirect only if last one was > 5 seconds ago
   // or if no redirect has happened yet.
-  if (!lastRedirect || now - parseInt(lastRedirect, 10) > 2000) {
+  if (!lastRedirect || now - parseInt(lastRedirect, 10) > 5000) {
     sessionStorage.setItem('auth_redirect_timestamp', now.toString());
     // const ssoLoginUrl = `${process.env.NEXT_PUBLIC_SSO_LOGIN_URL as string}?redirect_url=${window.location.href}`;