"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();

  return (
    <AuthCheck>
      {!isSignInPage && isAuthenticated && <MainNav />}
      <div 
        className={isSignInPage ? "" : "min-h-screen"}
        style={
          !isSignInPage ? {
            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}
      >
        <main>{children}</main>
      </div>
      {!isSignInPage && isAuthenticated && <Footer />}
      <Toaster />
    </AuthCheck>
  );
}