Improve user authentication and navigation flow

Introduce a loading state for authentication, refactor route handling to conditionally render authenticated vs. unauthenticated views, add an Auction Guide page, and update navigation links to use the Link component for client-side routing.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 069d4324-6c40-4355-955e-c714a50de1ea
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/069d4324-6c40-4355-955e-c714a50de1ea/u6Yn0uG
This commit is contained in:
kimjaehyeon0101
2025-09-29 15:55:11 +00:00
parent b332e8bc6f
commit 6de5cfd9e7
4 changed files with 537 additions and 20 deletions

View File

@ -11,29 +11,42 @@ import Article from "@/pages/Article";
import AdminDashboard from "@/pages/AdminDashboard";
import SuperAdminDashboard from "@/pages/SuperAdminDashboard";
import Auctions from "@/pages/Auctions";
import AuctionGuide from "@/pages/AuctionGuide";
import NotFound from "@/pages/not-found";
function Router() {
const { isAuthenticated, isLoading, user } = useAuth();
if (isLoading) {
return (
<div className="min-h-screen bg-background flex items-center justify-center">
<div className="text-center">
<div className="animate-spin rounded-full h-32 w-32 border-b-2 border-primary mx-auto mb-4"></div>
<p className="text-lg">Loading...</p>
</div>
</div>
);
}
// Debug logging
console.log('Router render - isAuthenticated:', isAuthenticated, 'user:', user);
return (
<Switch>
{isLoading || !isAuthenticated ? (
<Route path="/" component={Landing} />
) : (
<>
<Route path="/" component={Home} />
<Route path="/media/:slug" component={MediaOutlet} />
<Route path="/articles/:slug" component={Article} />
<Route path="/auctions" component={Auctions} />
{(user?.role === 'admin' || user?.role === 'superadmin') && (
<Route path="/admin" component={AdminDashboard} />
)}
{user?.role === 'superadmin' && (
<Route path="/superadmin" component={SuperAdminDashboard} />
)}
</>
<Route path="/" component={isAuthenticated ? Home : Landing} />
<Route path="/media/:slug" component={isAuthenticated ? MediaOutlet : Landing} />
<Route path="/articles/:slug" component={isAuthenticated ? Article : Landing} />
<Route path="/auctions" component={isAuthenticated ? Auctions : Landing} />
<Route path="/auction-guide" component={AuctionGuide} />
{/* Admin routes - only when authenticated */}
{isAuthenticated && (user?.role === 'admin' || user?.role === 'superadmin') && (
<Route path="/admin" component={AdminDashboard} />
)}
{isAuthenticated && user?.role === 'superadmin' && (
<Route path="/superadmin" component={SuperAdminDashboard} />
)}
<Route component={NotFound} />
</Switch>
);