import "@/app/globals.css";
import {NextIntlClientProvider} from "next-intl";
import {getMessages} from "next-intl/server";
import {notFound} from "next/navigation";
import {isLocale, type Locale} from "@/lib/i18n";
import LanguageSwitcher from "@/components/LanguageSwitcher";
import Link from "next/link";

export default async function LocaleLayout({children, params}:{children: React.ReactNode; params:{locale:string}}) {
  if (!isLocale(params.locale)) notFound();
  const messages = await getMessages();
  const locale = params.locale as Locale;

  return (
    <html lang={locale}>
      <body>
        <NextIntlClientProvider messages={messages}>
          <header className="sticky top-0 z-50 bg-white/85 backdrop-blur border-b border-slate-100">
            <div className="mx-auto max-w-6xl px-4 py-4 flex flex-col gap-3">
              <div className="flex items-center justify-between gap-4">
                <Link href={`/${locale}`} className="text-xl font-semibold tracking-tight">Fiesta365</Link>
                <nav className="flex items-center gap-4 text-sm">
                  <Link href={`/${locale}`}>Home</Link>
                  <Link href={`/${locale}/calendar`}>Calendar</Link>
                </nav>
              </div>
              <LanguageSwitcher currentLocale={locale} />
            </div>
          </header>

          <main className="mx-auto max-w-6xl px-4 py-10">{children}</main>

          <footer className="border-t border-slate-100">
            <div className="mx-auto max-w-6xl px-4 py-8 text-sm text-slate-600">
              © {new Date().getFullYear()} Fiesta365
            </div>
          </footer>
        </NextIntlClientProvider>
      </body>
    </html>
  );
}
