codenuk_frontend_mine/src/components/layout/app-layout.tsx

50 lines
1.2 KiB
TypeScript

"use client"
import { useAuth } from "@/contexts/auth-context"
import Header from "@/components/navigation/header"
import { usePathname } from "next/navigation"
interface AppLayoutProps {
children: React.ReactNode
}
export function AppLayout({ children }: AppLayoutProps) {
const { isAuthenticated, isLoading } = useAuth()
const pathname = usePathname()
// Don't show header on auth pages
const isAuthPage = pathname === "/auth" || pathname === "/signin" || pathname === "/signup"
// Show loading state while checking auth
if (isLoading) {
return (
<div className="min-h-screen flex items-center justify-center bg-black">
<div className="animate-spin rounded-full h-32 w-32 border-b-2 border-orange-500"></div>
</div>
)
}
// For auth pages, don't show header
if (isAuthPage) {
return <>{children}</>
}
// For authenticated users on other pages, show header
if (isAuthenticated) {
return (
<>
<Header />
{children}
</>
)
}
// For unauthenticated users on non-auth pages, show header but redirect to auth
return (
<>
<Header />
{children}
</>
)
}