feat: Wabenhain Honig-Shop Anwendung

Vollstaendige Next.js/Prisma-E-Commerce-Anwendung fuer eine Imkerei: Shop, Warenkorb, Stripe-Checkout, Kundenkonto mit 2FA, Admin-Bereich (Produkte, Ernten, Chargen, Bestellungen, Gutscheine, admin-editierbare Website-Inhalte), i18n (DE/EN), Rate-Limiting/CSP/Audit-Log-Haertung, PostgreSQL- und MySQL-Unterstuetzung ueber austauschbare Prisma- Treiber-Adapter, Unit-/Komponenten-/E2E-Tests.
2026-08-17 14:30:28 +02:00
1 parent 5c76fcc266
commit c7927f2883
@@ -0,0 +1,74 @@
+import type { Metadata } from "next";
+import { redirect } from "next/navigation";
+import { Container, SectionHeading, Button } from "@/components/ui";
+import { BackLink } from "@/components/back-link";
+import { ShieldIcon } from "@/components/account-ui";
+import { PasswordField } from "@/components/password-field";
+import { getCurrentCustomer } from "@/lib/auth";
+import { prisma } from "@/lib/prisma";
+import { startTwoFactorSetupAction, disableTwoFactorAction } from "../actions";
+import { getLocale } from "@/i18n/locale";
+import { getDictionary } from "@/i18n/get-dictionary";
+
+export const metadata: Metadata = { title: "Zwei-Faktor-Authentifizierung" };
+export const dynamic = "force-dynamic";
+
+export default async function ZweiFaktorPage(props: PageProps<"/konto/zwei-faktor">) {
+  const t = getDictionary(await getLocale());
+  const { error, message } = await props.searchParams;
+
+  const customer = await getCurrentCustomer();
+  if (!customer) redirect("/konto");
+
+  const remainingBackupCodes = customer.twoFactorEnabled
+    ? await prisma.twoFactorBackupCode.count({ where: { customerId: customer.id, usedAt: null } })
+    : 0;
+
+  return (
+    <div className="py-20">
+      <Container className="max-w-md">
+        <BackLink href="/konto" label={t.twoFactorPage.backLabel} />
+        <SectionHeading
+          eyebrow={t.twoFactorPage.eyebrow}
+          title={t.twoFactorPage.title}
+          subtitle={t.twoFactorPage.subtitle}
+        />
+
+        {error ? (
+          <p className="mt-6 text-sm text-red-700 bg-red-50 border border-red-200 px-4 py-3">{error}</p>
+        ) : null}
+        {message ? (
+          <p className="mt-6 text-sm text-forest bg-forest/5 border border-forest/20 px-4 py-3">{message}</p>
+        ) : null}
+
+        {customer.twoFactorEnabled ? (
+          <div className="mt-8 space-y-6">
+            <p className="flex items-center gap-3 text-sm text-forest bg-forest/5 border border-forest/20 px-4 py-3">
+              <ShieldIcon />
+              <span>
+                {t.twoFactorPage.activeStatus(remainingBackupCodes)}
+              </span>
+            </p>
+
+            <form action={disableTwoFactorAction} className="space-y-4 border border-ink/10 p-6">
+              <h2 className="text-forest">{t.twoFactorPage.disableHeading}</h2>
+              <PasswordField
+                name="password"
+                label={t.twoFactorPage.passwordConfirmLabel}
+                autoComplete="current-password"
+                required
+              />
+              <Button type="submit" variant="ghost">
+                {t.twoFactorPage.disableButton}
+              </Button>
+            </form>
+          </div>
+        ) : (
+          <form action={startTwoFactorSetupAction} className="mt-8">
+            <Button type="submit">{t.twoFactorPage.setupButton}</Button>
+          </form>
+        )}
+      </Container>
+    </div>
+  );
+}