55 lines
1.5 KiB
TypeScript
55 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { MainNav } from "@/components/main-nav";
|
|
import { Footer } from "@/components/footer";
|
|
import { AuthCheck } from "@/components/auth/auth-check";
|
|
import { Toaster } from "@/components/ui/toaster";
|
|
import { useBackgroundImage } from "@/components/background-switcher";
|
|
|
|
interface LayoutWrapperProps {
|
|
children: React.ReactNode;
|
|
isSignInPage: boolean;
|
|
isAuthenticated: boolean;
|
|
}
|
|
|
|
export function LayoutWrapper({
|
|
children,
|
|
isSignInPage,
|
|
isAuthenticated,
|
|
}: LayoutWrapperProps) {
|
|
const { currentBackground, changeBackground } = useBackgroundImage();
|
|
|
|
if (isSignInPage) {
|
|
return <>{children}</>;
|
|
}
|
|
|
|
return (
|
|
<AuthCheck>
|
|
<div className="min-h-screen bg-black">
|
|
<nav className="h-20 bg-black/20 px-4">
|
|
{!isSignInPage && isAuthenticated && <MainNav />}
|
|
</nav>
|
|
<main className="h-[calc(100vh-5rem)]">
|
|
<div
|
|
style={
|
|
{
|
|
backgroundImage: `url('${currentBackground}')`,
|
|
backgroundSize: 'cover',
|
|
backgroundPosition: 'center',
|
|
backgroundRepeat: 'no-repeat',
|
|
backgroundAttachment: 'fixed',
|
|
cursor: 'pointer',
|
|
transition: 'background-image 0.5s ease-in-out'
|
|
}
|
|
}
|
|
onClick={!isSignInPage ? changeBackground : undefined}
|
|
>
|
|
{children}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
{!isSignInPage && isAuthenticated && <Footer />}
|
|
<Toaster />
|
|
</AuthCheck>
|
|
);
|
|
}
|