fix: fallback showing too early

Author: DanielRivers

src/components/react-router-dom/ProtectedRoute.tsx

@@ -98,6 +98,11 @@ export default function ProtectedRoute({
     }
   }, [hasParams, isAuthenticated]);
 
+  // Show loading while checking router availability or auth/access
+  if (isRouterAvailable === null || isLoading || accessLoading) {
+    return <div>Loading...</div>;
+  }
+
   // Show loading while checking router availability
   if (isRouterAvailable === null) {
     return <div>Loading...</div>;
@@ -108,10 +113,6 @@ export default function ProtectedRoute({
     return <ProtectedRouteFallback>{children}</ProtectedRouteFallback>;
   }
 
-  if (isLoading || accessLoading) {
-    return <div>Loading...</div>;
-  }
-
   if (!isAuthenticated) {
     return NavigateComponent ? (
       <NavigateComponent to={fallbackPath} replace />