import type { Metadata, Viewport } from 'next'
import { Nunito_Sans, Oswald } from 'next/font/google'
import Script from 'next/script'
import BackToTop from '@/components/BackToTop'
import Footer from '@/components/Footer'
import Header from '@/components/Header'
import ScrollProgress from '@/components/ScrollProgress'
import { site } from '@/lib/site'
import './globals.css'

// Az eredeti oldal a Google Fonts CDN-jéről töltötte ezeket (render-blokkoló).
// Itt build időben letöltve, a saját doménről, automatikus preloaddal.
const nunito = Nunito_Sans({
  subsets: ['latin-ext'],
  weight: ['200', '300', '400', '700', '900'],
  variable: '--font-nunito',
  display: 'swap',
})

const oswald = Oswald({
  subsets: ['latin-ext'],
  weight: ['400', '700'],
  variable: '--font-oswald',
  display: 'swap',
})

export const metadata: Metadata = {
  metadataBase: new URL(site.url),
  title: {
    default: site.title,
    template: `%s | ${site.title}`,
  },
  description: site.tagline,
  openGraph: {
    title: site.title,
    description: site.tagline,
    url: site.url,
    type: 'article',
    images: [site.ogImage],
    locale: 'hu_HU',
  },
  alternates: { canonical: '/' },
  // teszt aldoménen a keresők ne indexeljenek
  ...(site.noindex ? { robots: { index: false, follow: false } } : null),
}

export const viewport: Viewport = {
  width: 'device-width',
  initialScale: 1,
  themeColor: '#222831',
}

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="hu" className={`${nunito.variable} ${oswald.variable}`}>
      <body>
        <ScrollProgress />
        <Header />
        <main>{children}</main>
        <Footer />
        <BackToTop />

        {/* Google Analytics — csak azután tölt be, hogy az oldal interaktív lett.
            Teszt aldoménen kimarad, hogy ne szennyezze az éles statisztikát. */}
        {!site.noindex && (
          <>
            <Script
              src={`https://www.googletagmanager.com/gtag/js?id=${site.gaId}`}
              strategy="afterInteractive"
            />
            <Script id="ga-init" strategy="afterInteractive">
              {`window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '${site.gaId}');`}
            </Script>
          </>
        )}
      </body>
    </html>
  )
}
