import React from 'react'
import { Outlet, Navigate } from 'react-router-dom'
import { useAuthContext } from '../contexts/AuthContext'
import classe from '../assets/DefaultLayout.module.css'
import Navbar from '../components/Navbar'
import Sidenav from '../components/Sidenav'

const DefaultLayout = () => {
  const { token } = useAuthContext()

  if (!token) {
    return <Navigate to={'/login'} />
  }

  return (
    <div className={classe.default_layout}>
      <div className={classe.layout_container}>
        {/* Nabvar */}
        {/* <Navbar /> */}

        {/* Content Area with Sidenav and Outlet */}
        <div className={classe.main_content}>
          <div className={classe.sidenavBlock}>
            <Sidenav />
          </div>
          <div className={classe.outlet}>
            <Outlet />
          </div>
        </div>
      </div>
    </div>
  )
}

export default DefaultLayout
