'use client'

import { usePathname } from 'next/navigation'
import { useEffect, useState } from 'react'

import { Sidebar } from '@/components/dashboard/sidebar'
import { useAuth } from '@/hooks/useAuth'

export function AppShell({ children }: { children: React.ReactNode }) {
  const pathname = usePathname()
  const { isAuthenticated, isLoading } = useAuth()
  const [mounted, setMounted] = useState(false)

  useEffect(() => {
    setMounted(true)
  }, [])

  const hideByRoute =
    pathname === '/' || pathname?.startsWith('/login') || pathname?.startsWith('/register')

  // До маунта всегда скрываем сайдбар, чтобы избежать гидратационного рассинхрона
  const hideSidebar = !mounted || hideByRoute || isLoading || !isAuthenticated

  return (
    <>
      {!hideSidebar && <Sidebar isRootInstance />}
      <div className="flex-1 min-w-0 overflow-hidden">{children}</div>
    </>
  )
}

