import { Space_Grotesk } from 'next/font/google'
import Script from 'next/script'
import { Sidebar } from '@/components/layout/Sidebar'
import { MobileNavbar } from '@/components/layout/MobileNavbar'
import { metadata } from '@/app/metadata'
// eslint-disable-next-line import/no-unassigned-import
import '@/app/globals.css'

const spaceGrotesk = Space_Grotesk({
  subsets: ['latin'],
  variable: '--font-sans',
  display: 'swap',
  weight: ['400', '500', '600', '700'],
})
export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode
}>) {
  return (
    <html lang="en" className={`${spaceGrotesk.variable} h-full antialiased no-js`}>
      <Script
        dangerouslySetInnerHTML={{
          __html: `document.documentElement.classList.replace('no-js','js')`,
        }}
      />
      <body className="min-h-full flex">
        <Sidebar />
        <MobileNavbar />
        {children}
      </body>
    </html>
  )
}

export { metadata }
