import type { Metadata } from "next";
import { Suspense } from "react";
import "./globals.css";
import {
  AnalyticsContextProvider,
  AnalyticsAutoTracker,
} from "@mintel/next-observability/client";
import { getAnalyticsConfig } from "@/lib/observability";

export const metadata: Metadata = {
  title: "Sample Website",
  description: "A sample website using @mintel shared packages",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  const analyticsConfig = getAnalyticsConfig();

  return (
    <html lang="en">
      <body>
        <AnalyticsContextProvider config={analyticsConfig}>
          <Suspense fallback={null}>
            <AnalyticsAutoTracker />
          </Suspense>
          {children}
        </AnalyticsContextProvider>
      </body>
    </html>
  );
}
