import type { Metadata } from "next";
import { Container, SectionHeading, FormPanel } from "@/components/ui";
import { WithdrawalForm } from "@/components/withdrawal-form";
import { getLocale } from "@/i18n/locale";
import { getDictionary } from "@/i18n/get-dictionary";

export const metadata: Metadata = { title: "Vertrag widerrufen", alternates: { canonical: "/vertrag-widerrufen" } };

/** Nur Zeichen, die in Bestellnummern vorkommen — alles andere wird nicht vorausgefuellt. */
const ORDER_NUMBER_PREFILL = /^[A-Za-z0-9-]{1,40}$/;

/**
 * Elektronische Widerrufsfunktion (§ 356a BGB). Ohne Anmeldung erreichbar —
 * auch Gastbestellungen muessen hier widerrufen werden koennen. Aus dem
 * Kundenkonto kommt man mit ?bestellung=… und vorausgefuellter Nummer.
 */
export default async function VertragWiderrufenPage(props: PageProps<"/vertrag-widerrufen">) {
  const t = getDictionary(await getLocale());
  const { bestellung } = await props.searchParams;
  const prefill = typeof bestellung === "string" && ORDER_NUMBER_PREFILL.test(bestellung) ? bestellung : "";

  return (
    <div className="py-20">
      <Container className="max-w-xl">
        <FormPanel>
          <SectionHeading title={t.withdrawalPage.title} level="h1" />
          <p className="mt-6 text-sm leading-relaxed text-ink/75">{t.withdrawalPage.intro}</p>
          <div className="mt-8">
            <WithdrawalForm defaultOrderNumber={prefill} />
          </div>
        </FormPanel>
      </Container>
    </div>
  );
}