import { ReactNode } from "react";
import type { Metadata } from "next";
import { ToastProvider } from "@/context/ToastContext";
import { UserProvider } from "@/context/UserContext";
import "./style.css";
import HeaderCMS from "@/components/HeaderCMS";

export const metadata: Metadata = {
  title: `${process.env.SITE_SHORT_NAME} - Administrative Suite`,
  description: `${process.env.SITE_DESCRIPTION}`,
  keywords: `${process.env.SITE_KEYWORDS}`,
  icons: "/favicon.webp",
};

export default function Layout({ children }: { children: ReactNode }) 
{
  return (
    <div className="cms">
      <ToastProvider>
        <UserProvider>
          <HeaderCMS />
          <main className="cms-content">
            {children}
          </main>
        </UserProvider>
      </ToastProvider>
    </div>
  );
}