import { auth, signOut } from "@/lib/auth";
import Link from "next/link";
import { redirect } from "next/navigation";
import { Button } from "@/components/ui/button";

export default async function ProtectedLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const session = await auth();

  if (!session) {
    redirect("/login");
  }

  return (
    <div className="min-h-screen bg-slate-50">
      {/* Navigation */}
      <nav className="bg-white border-b border-slate-200 sticky top-0 z-50">
        <div className="container mx-auto px-4">
          <div className="flex items-center justify-between h-16">
            <div className="flex items-center gap-6">
              <Link href="/dashboard" className="text-xl font-bold">
                🏠 Airbnb Finder
              </Link>
              <div className="hidden md:flex items-center gap-4">
                <Link
                  href="/dashboard"
                  className="text-slate-600 hover:text-slate-900 transition"
                >
                  Dashboard
                </Link>
                <Link
                  href="/listings"
                  className="text-slate-600 hover:text-slate-900 transition"
                >
                  Listings
                </Link>
                <Link
                  href="/compare"
                  className="text-slate-600 hover:text-slate-900 transition"
                >
                  Vergleich
                </Link>
                <Link
                  href="/map"
                  className="text-slate-600 hover:text-slate-900 transition"
                >
                  Karte
                </Link>
                <Link
                  href="/admin/import"
                  className="text-slate-600 hover:text-slate-900 transition"
                >
                  Import
                </Link>
                <Link
                  href="/admin/tags"
                  className="text-slate-600 hover:text-slate-900 transition"
                >
                  Tags
                </Link>
              </div>
            </div>
            <div className="flex items-center gap-4">
              <span className="text-sm text-slate-500 hidden sm:block">
                {session.user?.name || "Admin"}
              </span>
              <form
                action={async () => {
                  "use server";
                  await signOut();
                }}
              >
                <Button variant="outline" size="sm">
                  Logout
                </Button>
              </form>
            </div>
          </div>
        </div>
      </nav>

      {/* Main Content */}
      <main>{children}</main>
    </div>
  );
}