67 lines
2.3 KiB
TypeScript
67 lines
2.3 KiB
TypeScript
"use client"
|
|
|
|
import { usePathname } from "next/navigation"
|
|
import { useState, useCallback } from "react"
|
|
import { SiteHeader } from "@/components/layout/site-header"
|
|
import { SportsSidebar } from "@/components/layout/sports-sidebar"
|
|
import { RightPanel } from "@/components/layout/right-panel"
|
|
import { SiteFooter } from "@/components/layout/site-footer"
|
|
import { AuthModal } from "@/components/layout/auth-modal"
|
|
import { MobileBottomNav } from "@/components/layout/mobile-bottom-nav"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
type AuthMode = "login" | "register"
|
|
|
|
export default function LayoutClientWrapper({ children }: { children: React.ReactNode }) {
|
|
const pathname = usePathname()
|
|
const isLivePage = pathname === "/live"
|
|
const isVirtualPage = pathname === "/virtual"
|
|
const isSpecialGamesPage = pathname === "/special-games"
|
|
|
|
const hideLeftSidebar = isLivePage || isVirtualPage || isSpecialGamesPage
|
|
const hideRightSidebar = isVirtualPage || isSpecialGamesPage // Show RightPanel on Live page
|
|
|
|
const [authOpen, setAuthOpen] = useState(false)
|
|
const [authMode, setAuthMode] = useState<AuthMode>("login")
|
|
|
|
const openAuth = useCallback((mode: AuthMode) => {
|
|
setAuthMode(mode)
|
|
setAuthOpen(true)
|
|
}, [])
|
|
|
|
return (
|
|
<div className="flex min-h-screen flex-col pb-14 md:pb-0 overflow-x-hidden">
|
|
<SiteHeader
|
|
onLoginClick={() => openAuth("login")}
|
|
onRegisterClick={() => openAuth("register")}
|
|
/>
|
|
<div className="flex w-full flex-1 gap-0 min-w-0">
|
|
{/* Sidebar: hidden on mobile and hidden on specific pages */}
|
|
{!hideLeftSidebar && (
|
|
<div className="hidden md:block shrink-0">
|
|
<SportsSidebar />
|
|
</div>
|
|
)}
|
|
<main className={cn("flex-1 min-w-0 overflow-x-hidden", !hideLeftSidebar && "px-2 py-3")}>{children}</main>
|
|
{/* Right panel: completely off-flow on mobile/tablet; only from lg to match RightPanel */}
|
|
{!hideRightSidebar && (
|
|
<div className="hidden lg:block shrink-0 overflow-hidden">
|
|
<RightPanel />
|
|
</div>
|
|
)}
|
|
</div>
|
|
<SiteFooter />
|
|
|
|
{/* Mobile fixed bottom nav */}
|
|
<MobileBottomNav />
|
|
|
|
{/* Auth modal */}
|
|
<AuthModal
|
|
open={authOpen}
|
|
defaultMode={authMode}
|
|
onClose={() => setAuthOpen(false)}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|