"use client"; import { useRef, useState, type FormEvent } from "react"; import { validateEmailFormat } from "./email"; import type { NewsletterOptInSource } from "./brevo"; // Shared state/submit logic behind every newsletter-signup form // (Newsletter.tsx, NewsletterModal.tsx, WeeklyImpulsesHero.tsx's inline // hero form, /challenge's EmailCapture) — four places with the same // email+consent+submit shape but different markup/visual style, so only // the logic is shared here rather than a one-size-fits-all component. // Same two sentences every form already showed hardcoded (per the user's // own explicit wording request, see the newsletter-DOI memory) — kept // here once instead of duplicated across all 4 forms now that a second // variant (already subscribed) needs the same treatment. const SUCCESS_MESSAGE = "Fast geschafft! Schau kurz in dein Postfach – da wartet schon eine Mail von uns."; const ALREADY_SUBSCRIBED_MESSAGE = "Diese E-Mail-Adresse ist schon für unseren Newsletter angemeldet."; export function useNewsletterSignup(source: NewsletterOptInSource) { const [email, setEmail] = useState(""); const [emailError, setEmailError] = useState(""); const [consent, setConsent] = useState(false); const [status, setStatus] = useState<"idle" | "submitting" | "success" | "error">("idle"); const [error, setError] = useState(""); const [successMessage, setSuccessMessage] = useState(SUCCESS_MESSAGE); const emailRef = useRef(null); function handleEmailChange(value: string) { setEmail(value); if (emailError) setEmailError(""); } function handleEmailBlur(value: string) { setEmailError(validateEmailFormat(value)); } async function handleSubmit(e: FormEvent) { e.preventDefault(); const formatError = validateEmailFormat(email); setEmailError(formatError); if (formatError) { emailRef.current?.focus(); return; } setStatus("submitting"); setError(""); try { const res = await fetch("/api/newsletter/subscribe", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ email, consent, source }), }); const data = await res.json(); if (!data.ok) { setError(data.reason || "Anmeldung ist fehlgeschlagen. Bitte versuche es später erneut."); setStatus("error"); return; } setSuccessMessage(data.alreadySubscribed ? ALREADY_SUBSCRIBED_MESSAGE : SUCCESS_MESSAGE); setStatus("success"); } catch { setError("Anmeldung ist fehlgeschlagen. Bitte versuche es später erneut."); setStatus("error"); } } return { email, emailError, consent, setConsent, status, error, successMessage, emailRef, handleEmailChange, handleEmailBlur, handleSubmit }; }