Add SMTP admin settings and contact form delivery

2026-03-08 06:27:09 +01:00
parent 993a4673d8
commit 5ca4819bcb
28 changed files with 2087 additions and 55 deletions
@@ -0,0 +1,83 @@
+"use client";
+
+import Link from "next/link";
+
+import { ContactTurnstile } from "@/components/site/contact-turnstile";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import type { PublicContactProtectionSettings } from "@/lib/contact-protection";
+
+type ContactFormCopy = {
+  name: string;
+  email: string;
+  phone: string;
+  company: string;
+  message: string;
+  note: string;
+  submit: string;
+  preview: string;
+};
+
+type ContactFormProps = {
+  action: (formData: FormData) => Promise<void>;
+  locale: string;
+  previewHref: string;
+  copy: ContactFormCopy;
+  protection: PublicContactProtectionSettings;
+};
+
+export function ContactForm({
+  action,
+  locale,
+  previewHref,
+  copy,
+  protection,
+}: ContactFormProps) {
+  return (
+    <form action={action} className="grid gap-5">
+      <input type="hidden" name="locale" value={locale} />
+
+      <div className="grid gap-4 md:grid-cols-2">
+        <Label className="grid gap-2">
+          {copy.name}
+          <Input type="text" name="name" placeholder={copy.name} required />
+        </Label>
+
+        <Label className="grid gap-2">
+          {copy.email}
+          <Input type="email" name="email" placeholder={copy.email} required />
+        </Label>
+
+        <Label className="grid gap-2">
+          {copy.phone}
+          <Input type="tel" name="phone" placeholder={copy.phone} />
+        </Label>
+
+        <Label className="grid gap-2">
+          {copy.company}
+          <Input type="text" name="company" placeholder={copy.company} />
+        </Label>
+      </div>
+
+      <Label className="grid gap-2">
+        {copy.message}
+        <Textarea rows={7} name="message" placeholder={copy.message} required minLength={10} />
+      </Label>
+
+      <p className="text-sm text-muted-foreground">{copy.note}</p>
+
+      {protection.turnstile.enabled ? (
+        <ContactTurnstile siteKey={protection.turnstile.siteKey} />
+      ) : null}
+
+      <div className="flex flex-wrap gap-3">
+        <Button type="submit">{copy.submit}</Button>
+        <Button asChild variant="outline">
+          <Link href={previewHref}>{copy.preview}</Link>
+        </Button>
+      </div>
+    </form>
+  );
+}