import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
import { Toaster } from "@/components/ui/toaster";
import Providers from "@/components/ui/Provider"; // Ensure this is correctly capitalized
import { SessionProvider } from "next-auth/react";
import SessionProviderWrapper from "./SessionProviderWrapper";
import SocketProvider from "@/lib/SocketProvider";

const inter = Inter({ subsets: ["latin"] });

export const metadata: Metadata = {
  title: "Inventory Management",
  description: "Inventory Management Panel",
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="en">
      <body className={`${inter.className} bg-black`}>
        <Providers>
          <main>
            <SessionProviderWrapper>
              {/* <SocketProvider> */}
              {children}
              {/* </SocketProvider> */}
            </SessionProviderWrapper>
          </main>
        </Providers>
        <Toaster /> {/* Make sure this is properly configured */}
      </body>
    </html>
  );
}
