import type { Metadata } from "next";
import { redirect } from "next/navigation";
import Link from "next/link";
import { Footer } from "../../components/Footer";
import { getSessionCustomer, getCustomerProfile } from "../../lib/customerAuth";
import { ProfileForm } from "./components/ProfileForm";
import { PasswordForm } from "./components/PasswordForm";
import { VerificationBanner } from "./components/VerificationBanner";
import { AccountDataSection } from "./components/AccountDataSection";

export const metadata: Metadata = {
  title: "Mein Profil",
  robots: { index: false, follow: true },
};

export default async function KontoProfilPage({
  searchParams,
}: {
  searchParams: Promise<{ verified?: string }>;
}) {
  const session = await getSessionCustomer();
  if (!session) redirect("/konto/login");

  const profile = await getCustomerProfile(session.token);
  if (!profile) redirect("/konto/login");

  const { verified } = await searchParams;

  return (
    <>
      <main className="flex flex-col flex-1 bg-bg-base">
        <div className="flex flex-col gap-10 items-start pt-10 pb-16 px-[var(--layout-padding-x)] w-full max-w-[40rem] mx-auto">
          <Link href="/konto/bestellungen" className="text-body-sm text-text-muted hover:text-brand transition-colors">
            ← Meine Bestellungen
          </Link>
          <VerificationBanner emailVerified={profile.emailVerified} justVerified={verified === "1" || verified === "0" ? verified : undefined} />
          <ProfileForm profile={profile} />
          <PasswordForm email={profile.email} />
          <AccountDataSection />
        </div>
      </main>
      <Footer />
    </>
  );
}
