Refactor admin area and remove legacy root paths

2026-03-13 16:14:04 +01:00
parent e32ac4cacb
commit db897e22bf
65 changed files with 216 additions and 140 deletions
@@ -0,0 +1,137 @@
+"use client";
+
+import { useState } from "react";
+
+import { AppCard } from "@/components/ui/app-card";
+import { Button } from "@/components/ui/button";
+import { CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import type { ContactProtectionFormValues } from "@/lib/contact-protection";
+
+type ContactProtectionFormProps = {
+  action: (formData: FormData) => Promise<void>;
+  initialSettings: ContactProtectionFormValues;
+};
+
+export function ContactProtectionForm({
+  action,
+  initialSettings,
+}: ContactProtectionFormProps) {
+  const [turnstileEnabled, setTurnstileEnabled] = useState(initialSettings.turnstile.enabled);
+  const [rateLimitEnabled, setRateLimitEnabled] = useState(initialSettings.rateLimit.enabled);
+
+  return (
+    <form id="contact-protection-form" action={action} className="grid gap-6 xl:grid-cols-2">
+      <AppCard>
+        <CardHeader>
+          <CardTitle>Turnstile</CardTitle>
+          <CardDescription>Cloudflare Schutz fuer das Kontaktformular.</CardDescription>
+        </CardHeader>
+        <CardContent className="grid gap-5 p-4 md:grid-cols-2">
+          <div className="space-y-4 md:col-span-2">
+            <label
+              htmlFor="turnstileEnabled"
+              className="flex cursor-pointer items-start gap-3 rounded-nested border border-input bg-card px-4 py-4 transition-colors hover:bg-accent/20"
+            >
+              <Checkbox
+                id="turnstileEnabled"
+                name="turnstileEnabled"
+                checked={turnstileEnabled}
+                onCheckedChange={(checked) => setTurnstileEnabled(checked === true)}
+                className="mt-0.5"
+              />
+              <span className="space-y-1">
+                <span className="block text-sm font-medium text-foreground">Enable Turnstile</span>
+                <span className="block text-xs text-muted-foreground">
+                  {turnstileEnabled
+                    ? "ON: Besucher muessen die Pruefung bestehen."
+                    : "OFF: Kein Turnstile Schutz im Formular."}
+                </span>
+              </span>
+            </label>
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="turnstileSiteKey">Turnstile Site Key</Label>
+            <Input
+              id="turnstileSiteKey"
+              name="turnstileSiteKey"
+              defaultValue={initialSettings.turnstile.siteKey}
+              autoComplete="off"
+            />
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="turnstileSecretKey">Turnstile Secret Key</Label>
+            <Input
+              id="turnstileSecretKey"
+              name="turnstileSecretKey"
+              type="password"
+              defaultValue={initialSettings.turnstile.secretKey}
+              placeholder={initialSettings.turnstile.hasSecretKey ? "Saved secret key will be kept" : "Secret key"}
+              autoComplete="new-password"
+            />
+          </div>
+        </CardContent>
+      </AppCard>
+
+      <AppCard>
+        <CardHeader>
+          <CardTitle>Rate Limiting</CardTitle>
+          <CardDescription>Begrenzung wiederholter Kontaktanfragen.</CardDescription>
+        </CardHeader>
+        <CardContent className="grid gap-5 p-4 md:grid-cols-2">
+          <div className="space-y-4 md:col-span-2">
+            <label
+              htmlFor="contactRateLimitEnabled"
+              className="flex cursor-pointer items-start gap-3 rounded-nested border border-input bg-card px-4 py-4 transition-colors hover:bg-accent/20"
+            >
+              <Checkbox
+                id="contactRateLimitEnabled"
+                name="contactRateLimitEnabled"
+                checked={rateLimitEnabled}
+                onCheckedChange={(checked) => setRateLimitEnabled(checked === true)}
+                className="mt-0.5"
+              />
+              <span className="space-y-1">
+                <span className="block text-sm font-medium text-foreground">Enable rate limiting</span>
+                <span className="block text-xs text-muted-foreground">
+                  {rateLimitEnabled
+                    ? "ON: Das Formular blockiert zu viele Anfragen pro Zeitfenster."
+                    : "OFF: Keine serverseitige Begrenzung aktiv."}
+                </span>
+              </span>
+            </label>
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="contactRateLimitMaxRequests">Max Requests</Label>
+            <Input
+              id="contactRateLimitMaxRequests"
+              name="contactRateLimitMaxRequests"
+              type="number"
+              min="1"
+              defaultValue={initialSettings.rateLimit.maxRequests}
+            />
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="contactRateLimitWindowMinutes">Window Minutes</Label>
+            <Input
+              id="contactRateLimitWindowMinutes"
+              name="contactRateLimitWindowMinutes"
+              type="number"
+              min="1"
+              defaultValue={initialSettings.rateLimit.windowMinutes}
+            />
+          </div>
+        </CardContent>
+      </AppCard>
+      <div className="xl:col-span-2 flex justify-end">
+        <Button type="submit">Save Protection</Button>
+      </div>
+    </form>
+  );
+}