diff --git a/src/platform/src/core/utils/protectedRoute.js b/src/platform/src/core/utils/protectedRoute.js
index cc2bbf2469..dd574f155f 100644
--- a/src/platform/src/core/utils/protectedRoute.js
+++ b/src/platform/src/core/utils/protectedRoute.js
@@ -1,12 +1,12 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
import { useRouter } from 'next/router';
import { useSelector, useDispatch } from 'react-redux';
-import LogoutUser from '@/core/utils/LogoutUser';
import Cookies from 'js-cookie';
import jwt_decode from 'jwt-decode';
import {
setUserInfo,
setSuccess,
+ resetStore,
} from '@/lib/store/services/account/LoginSlice';
import { getIndividualUserPreferences } from '@/lib/store/services/account/UserDefaultsSlice';
import { getUserDetails } from '@/core/apis/Account';
@@ -14,15 +14,18 @@ import Spinner from '../../common/components/Spinner';
const MAX_RETRIES = 3;
const RETRY_DELAY = 1000;
+const LOGIN_ROUTE = '/account/login';
export default function withAuth(Component) {
return function WithAuthComponent(props) {
const dispatch = useDispatch();
const router = useRouter();
const userCredentials = useSelector((state) => state.login);
- const [isRedirecting, setIsRedirecting] = React.useState(
+ const [isRedirecting, setIsRedirecting] = useState(
router.query.success === 'google',
);
+ const [redirectToLogin, setRedirectToLogin] = useState(false);
+ const [isMounted, setIsMounted] = useState(false);
const retryWithDelay = async (fn, retries = MAX_RETRIES) => {
try {
@@ -58,47 +61,78 @@ export default function withAuth(Component) {
dispatch(setUserInfo(user));
dispatch(setSuccess(true));
+ setIsRedirecting(false); // Clear redirecting state after success
};
useEffect(() => {
- if (typeof window !== 'undefined') {
- // Handle Google redirect first
+ // Mark as mounted only once
+ if (!isMounted) {
+ setIsMounted(true);
+ }
+
+ if (typeof window === 'undefined') return;
+
+ const handleAuth = async () => {
+ // Handle Google redirect
if (router.query.success === 'google') {
- const token = Cookies.get('access_token');
- if (token) {
+ try {
+ const token = Cookies.get('temp_access_token');
+ if (!token) {
+ throw new Error('No access_token cookie found');
+ }
+
localStorage.setItem('token', token);
const decoded = jwt_decode(token);
- retryWithDelay(() => getUserDetails(decoded._id, token))
- .then((response) => setupUserSession(response.users[0]))
- .catch((error) => {
- console.error('Google auth error:', error);
- setIsRedirecting(false);
- router.push('/account/login');
- });
- } else {
+ const response = await retryWithDelay(() =>
+ getUserDetails(decoded._id, token),
+ );
+ await setupUserSession(response.users[0]);
+ } catch (error) {
+ console.error('Google auth error:', error);
setIsRedirecting(false);
- router.push('/account/login');
+ setRedirectToLogin(true);
}
- return; // Exit early to prevent further checks until redirect is resolved
+ return;
}
+ // Handle authentication checks
const storedUserGroup = localStorage.getItem('activeGroup');
if (!userCredentials.success) {
- router.push('/account/login');
+ setRedirectToLogin(true);
+ return;
}
if (!storedUserGroup) {
- LogoutUser(dispatch, router);
+ dispatch(resetStore());
+ if (typeof window !== 'undefined') {
+ localStorage.clear();
+ }
+ const store = router.store || window.__NEXT_REDUX_STORE__;
+ if (store?.__persistor) {
+ await store.__persistor.purge();
+ }
+ setRedirectToLogin(true);
}
+ };
+
+ handleAuth();
+ }, [
+ userCredentials.success,
+ dispatch,
+ router.query.success,
+ retryWithDelay,
+ ]);
+
+ useEffect(() => {
+ if (isMounted && redirectToLogin) {
+ router.push(LOGIN_ROUTE);
}
- }, [userCredentials, dispatch, router, retryWithDelay, isRedirecting]);
+ }, [isMounted, redirectToLogin, router]);
- // Block rendering until redirect is handled
if (isRedirecting) {
return ;
}
- // Render the component if the user is authenticated
return userCredentials.success ? : null;
};
}
diff --git a/src/platform/src/pages/Home/index.jsx b/src/platform/src/pages/Home/index.jsx
index d2457eb2cf..d03f1abf6f 100644
--- a/src/platform/src/pages/Home/index.jsx
+++ b/src/platform/src/pages/Home/index.jsx
@@ -1,4 +1,4 @@
-// Import statements
+import dynamic from 'next/dynamic';
import withAuth from '@/core/utils/protectedRoute';
import React, { useState, useEffect, useCallback, useMemo } from 'react';
import Layout from '@/components/Layout';
@@ -302,4 +302,4 @@ const Home = () => {
);
};
-export default withAuth(Home);
+export default dynamic(() => Promise.resolve(withAuth(Home)), { ssr: false });