refactor: improve token handling and redirection logic for authentication

Author: PstasDev

contexts/auth-context.tsx

@@ -70,16 +70,26 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
           } catch (profileError) {
             console.error('Failed to get user profile:', profileError)
 
-            // If profile fetch fails with auth error, clear token
+            // If profile fetch fails with any auth-related error, clear token immediately
             if (profileError instanceof Error && (
               profileError.message.includes('401') ||
               profileError.message.includes('Unauthorized') ||
               profileError.message.includes('munkamenet lejárt') ||
-              profileError.message.includes('Profile fetch timeout')
+              profileError.message.includes('Profile fetch timeout') ||
+              profileError.message.includes('Hitelesítési hiba') ||
+              profileError.message.includes('Authentication') ||
+              profileError.message.includes('Invalid token') ||
+              profileError.message.includes('Token expired')
             )) {
               console.log('🔑 Clearing token due to profile fetch error:', profileError.message)
               apiClient.setToken(null)
               setUser(null)
+              
+              // Force redirect to login if we're in the app
+              if (typeof window !== 'undefined' && window.location.pathname.startsWith('/app')) {
+                console.log('🔄 Token expired in app area - redirecting to login')
+                window.location.href = '/login'
+              }
             } else {
               // For other errors (network, server), don't clear token immediately
               // Let the user retry or handle it gracefully
@@ -149,7 +159,14 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
     } catch (error) {
       console.error('Logout error:', error)
     } finally {
+      // Ensure user state is cleared and token is fully removed
       setUser(null)
+      apiClient.setToken(null)
+      
+      // Force redirect to login to ensure clean state
+      if (typeof window !== 'undefined') {
+        window.location.href = '/login'
+      }
     }
   }
 
@@ -169,6 +186,13 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
       console.error('Token refresh failed:', error)
       setUser(null)
       apiClient.setToken(null)
+      
+      // Force redirect to login if refresh fails and we're in app area
+      if (typeof window !== 'undefined' && window.location.pathname.startsWith('/app')) {
+        console.log('🔄 Token refresh failed in app area - redirecting to login')
+        window.location.href = '/login'
+      }
+      
       throw error
     }
   }

lib/api.ts

@@ -729,9 +729,19 @@ class ApiClient {
         // Also set as httpOnly cookie for middleware - encode properly
         document.cookie = `jwt_token=${encodeURIComponent(cleanToken)}; path=/; max-age=${7 * 24 * 60 * 60}; secure; samesite=strict`
       } else {
+        // Clear all possible token storage locations
         localStorage.removeItem('jwt_token')
-        // Remove cookie
+        // Remove cookie with all possible variations
         document.cookie = 'jwt_token=; path=/; expires=Thu, 01 Jan 1970 00:00:01 GMT;'
+        document.cookie = 'jwt_token=; path=/; expires=Thu, 01 Jan 1970 00:00:01 GMT; secure; samesite=strict'
+        document.cookie = 'jwt_token=; path=/; domain=' + window.location.hostname + '; expires=Thu, 01 Jan 1970 00:00:01 GMT;'
+        
+        // Also clear sessionStorage just in case
+        try {
+          sessionStorage.removeItem('jwt_token')
+        } catch (e) {
+          console.warn('Could not clear sessionStorage:', e)
+        }
       }
     }
   }
@@ -865,25 +875,29 @@ class ApiClient {
             // For public endpoints, don't clear token and use specific error message
             throw new Error(errorData.message || 'Hitelesítési hiba történt.')
           } else {
-            // For protected endpoints, be more careful about clearing tokens
-            // Only clear token if it's explicitly an authentication error
-            if (errorData.message && (
-              errorData.message.includes('Invalid token') ||
-              errorData.message.includes('Token expired') ||
-              errorData.message.includes('Authentication failed') ||
-              errorData.message.includes('Hitelesítés sikertelen')
-            )) {
-              console.log('🔑 Clearing token due to explicit auth error:', errorData.message)
-              this.setToken(null)
-              throw new Error('A munkamenet lejárt. Kérjük, jelentkezzen be újra.')
-            } else {
-              // For other 401 errors, don't clear token - could be temporary issue
-              console.warn('⚠️ 401 error but preserving token (might be temporary):', {
-                endpoint,
-                error: errorData.message
-              })
-              throw new Error(errorData.message || 'Hitelesítési hiba történt. Próbálja újra.')
+            // For protected endpoints, always clear expired tokens
+            // Be more aggressive about token clearing on 401 errors in production
+            // This fixes the redirect loop issue where expired tokens weren't being cleared properly
+            console.log('🔑 401 error on protected endpoint - clearing token:', {
+              endpoint,
+              error: errorData.message,
+              environment: typeof window !== 'undefined' ? window.location.hostname : 'unknown'
+            })
+            
+            // Always clear token on 401 for protected endpoints to prevent redirect loops
+            // When a token truly expires, we need to ensure it's completely removed from all storage
+            this.setToken(null)
+            
+            // Force reload to clear any cached state and redirect properly
+            // This prevents the middleware redirect loop between /login and /app/iranyitopult
+            if (typeof window !== 'undefined') {
+              // Small delay to ensure token clearing is completed
+              setTimeout(() => {
+                window.location.href = '/login'
+              }, 100)
             }
+            
+            throw new Error('A munkamenet lejárt. Kérjük, jelentkezzen be újra.')
           }
         } else if (response.status === 403) {
           throw new Error('Nincs jogosultsága ehhez a művelethez.')
@@ -980,9 +994,11 @@ class ApiClient {
   }
 
   private shouldNotRetry(error: Error): boolean {
-    // Don't retry on authentication errors
+    // Don't retry on authentication errors - token is likely expired
     if (error.message.includes('401') || error.message.includes('Unauthorized') || 
-        error.message.includes('munkamenet lejárt')) {
+        error.message.includes('munkamenet lejárt') || error.message.includes('Hitelesítési hiba') ||
+        error.message.includes('Authentication') || error.message.includes('Invalid token') ||
+        error.message.includes('Token expired')) {
       return true
     }
 

middleware.ts

@@ -14,6 +14,9 @@ export function middleware(request: NextRequest) {
     })
   }
 
+  // Check if token is actually valid (not just present)
+  const hasValidToken = token && token.trim() !== '' && token !== 'null' && token !== 'undefined'
+
   // Protected routes - require authentication
   const protectedPaths = ['/app']
   const isProtectedPath = protectedPaths.some(path => 
@@ -29,14 +32,14 @@ export function middleware(request: NextRequest) {
   const authOnlyPublicPaths = ['/login']
   const isAuthOnlyPublicPath = authOnlyPublicPaths.includes(request.nextUrl.pathname)
 
-  // If trying to access protected route without token
-  if (isProtectedPath && (!token || token.trim() === '' || token === 'null')) {
+  // If trying to access protected route without valid token
+  if (isProtectedPath && !hasValidToken) {
     console.log('🚫 Redirecting to login - no valid token for protected route')
     return NextResponse.redirect(new URL('/login', request.url))
   }
 
   // If logged in and trying to access auth-only public pages (like login)
-  if (token && token.trim() !== '' && token !== 'null' && isAuthOnlyPublicPath) {
+  if (hasValidToken && isAuthOnlyPublicPath) {
     console.log('✅ Redirecting authenticated user away from login')
     return NextResponse.redirect(new URL('/app/iranyitopult', request.url))
   }