import { Navigate } from 'react-router-dom'
import { usePermissions } from '@/hooks/usePermissions'
import { L1CoverageBanner } from '@/components/l1/L1CoverageBanner'

export function L1RouteGuard({ children }: { children: React.ReactNode }) {
  const { canUseL1Surface } = usePermissions()
  if (!canUseL1Surface) {
    return <Navigate to="/" replace />
  }
  return (
    <div className="flex flex-col h-full">
      <L1CoverageBanner />
      <div className="flex-1 min-h-0 flex flex-col">
        {children}
      </div>
    </div>
  )
}