diff --git a/src/components/Login/Login.js b/src/components/Login/Login.js
index 3a06cb6..481eba7 100644
--- a/src/components/Login/Login.js
+++ b/src/components/Login/Login.js
@@ -13,13 +13,23 @@ const Login = () => {
const queryParams = new URLSearchParams(location.search);
const returnUrl = queryParams.get('returnUrl') || '/verifier';
- console.log('Login component loaded, returnUrl =', returnUrl);
+ console.log('Login component loaded with returnUrl =', returnUrl);
+ // Handle redirection after successful authentication
useEffect(() => {
- // If already authenticated, redirect to returnUrl
if (isAuthenticated) {
- console.log('Already authenticated, redirecting from Login page to:', returnUrl);
+ console.log('Login page: User is authenticated, redirecting to:', returnUrl);
+
+ // First try React Router navigation
navigate(returnUrl, { replace: true });
+
+ // As a backup, also use direct redirection after a short delay
+ setTimeout(() => {
+ if (window.location.pathname !== returnUrl.split('?')[0]) {
+ console.log('Login page: Using fallback redirect to:', returnUrl);
+ window.location.href = returnUrl;
+ }
+ }, 200);
}
}, [isAuthenticated, navigate, returnUrl]);
@@ -31,20 +41,22 @@ const Login = () => {
event.preventDefault();
console.log(`Login attempt for handle: ${handle || 'default PDS'}, returnUrl: ${returnUrl}`);
- // Call the login function from AuthContext
- // The returnUrl is passed so the user can be redirected after successful login
try {
+ // Store the returnUrl in localStorage as a backup
+ localStorage.setItem('auth_redirect_url', returnUrl);
+
+ // Call the login function from AuthContext
await login(handle || null, returnUrl);
} catch (err) {
console.error('Login error:', err);
- // Error handling is done through the AuthContext error state
}
};
+ // If already authenticated, show a message while redirecting
if (isAuthenticated) {
return (
-
Already logged in. Redirecting...
+
Already logged in. Redirecting to {returnUrl}...
);
}
diff --git a/src/components/ProtectedRoute.jsx b/src/components/ProtectedRoute.jsx
index 1cc1f6a..8029818 100644
--- a/src/components/ProtectedRoute.jsx
+++ b/src/components/ProtectedRoute.jsx
@@ -1,63 +1,41 @@
-import React, { useEffect, useState } from 'react';
-import { Navigate, useLocation, useNavigate } from 'react-router-dom';
+import React, { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
import { useAuth } from '../contexts/AuthContext';
const ProtectedRoute = ({ children }) => {
- const { isAuthenticated, loading, session } = useAuth();
+ const { isAuthenticated, loading } = useAuth();
const location = useLocation();
- const navigate = useNavigate();
- const [shouldRender, setShouldRender] = useState(false);
- const [redirectTriggered, setRedirectTriggered] = useState(false);
- // Log initial state on mount
+ // Simple and direct redirect approach
useEffect(() => {
- console.log('ProtectedRoute mounted with auth state:', {
- isAuthenticated,
- loading,
- hasDid: session?.did ? true : false,
- path: location.pathname
- });
- }, []);
-
- // Determine if we should redirect or render children
- useEffect(() => {
- // Only make decision after loading completes
- if (!loading) {
- if (isAuthenticated) {
- console.log('ProtectedRoute: Authentication confirmed, will render protected content');
- setShouldRender(true);
- } else {
- // Only trigger redirect once to avoid infinite loops
- if (!redirectTriggered) {
- console.log('ProtectedRoute: Not authenticated, redirecting to login');
- setRedirectTriggered(true);
-
- // Prepare the redirect URL
- const redirectUrl = `/login?returnUrl=${encodeURIComponent(location.pathname + location.search)}`;
-
- // Try React Router navigation first
- navigate(redirectUrl, { replace: true });
-
- // Fallback to direct redirection after a short delay
- // This ensures redirection happens even if React Router navigation fails
- setTimeout(() => {
- if (window.location.pathname !== '/login') {
- console.log('ProtectedRoute: Fallback to direct window location redirect');
- window.location.href = redirectUrl;
- }
- }, 100);
- }
- }
+ // Only check after loading is complete
+ if (loading) {
+ console.log('ProtectedRoute: Still loading auth status...');
+ return;
+ }
+
+ // If not authenticated, redirect directly via window.location
+ if (!isAuthenticated) {
+ console.log('ProtectedRoute: Not authenticated, redirecting to login...');
+ const redirectUrl = `/login?returnUrl=${encodeURIComponent(location.pathname + location.search)}`;
+ window.location.href = redirectUrl;
+ } else {
+ console.log('ProtectedRoute: User is authenticated, rendering content');
}
- }, [isAuthenticated, loading, navigate, location, redirectTriggered]);
+ }, [isAuthenticated, loading, location]);
// Show loading state while checking auth
if (loading) {
return Checking authentication status...
;
}
- // Render children only when explicitly set to do so
- return shouldRender ? children : Redirecting to login...
;
+ // Show redirecting state if not authenticated
+ if (!isAuthenticated) {
+ return Redirecting to login...
;
+ }
+
+ // User is authenticated, render children
+ return children;
};
export default ProtectedRoute;
\ No newline at end of file
diff --git a/src/components/Verifier/Verifier.css b/src/components/Verifier/Verifier.css
index 1eeea90..7cd28b6 100644
--- a/src/components/Verifier/Verifier.css
+++ b/src/components/Verifier/Verifier.css
@@ -304,6 +304,10 @@
margin-right: 5px;
}
+.verifier-network-results p {
+ margin: 0px;
+}
+
/* Validity status indicators */
.verifier-validity-status {
display: inline-block;
@@ -388,9 +392,6 @@
.verifier-network-results {
margin-top: 0px;
}
-.verifier-network-results .verifier-verifier-list {
- margin-bottom: 15px; /* Space between lists */
-}
.verifier-additional-context p {
margin-top: 0px;
diff --git a/src/components/Verifier/Verifier.js b/src/components/Verifier/Verifier.js
index 01aae07..570788b 100644
--- a/src/components/Verifier/Verifier.js
+++ b/src/components/Verifier/Verifier.js
@@ -640,14 +640,14 @@ function Verifier() {
inputRef.current?.focus();
};
+ // Handle loading and error states
if (isAuthLoading) return Loading authentication...
;
if (authError) return Authentication Error: {authError}. Please login.
;
- // Check authentication after all hooks are defined
+ // Simple auth check for debugging - this should never actually render if ProtectedRoute is working
if (!session) {
- console.log('Verifier: Not authenticated, waiting for ProtectedRoute redirection');
- // Show a brief loading message while ProtectedRoute handles redirection
- return Checking authentication status...
;
+ console.log('Verifier: Session missing, should be redirected by ProtectedRoute');
+ return You need to be logged in to use the Verifier. Redirecting...
;
}
const isAnyOperationInProgress = isVerifying || isRevoking || isLoadingVerifications || isLoadingNetwork || isCheckingValidity;