Marco/einfach-produktiv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Route already-subscribed through the error state, not success

Browse Source 
Per explicit feedback: swapping the whole form out for a bare success
message felt wrong for "you're already signed up, nothing to do" — the
form stays visible with a small red note below it instead, same as
every other inline validation error. No per-form UI changes needed,
they already render the error state.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Marco
2026-07-25 17:27:50 +00:00
parent bccfc28012
commit fd98f68ba6
2 changed files with 37 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/lib/useNewsletterSignup.ts
+13 -7
View File
@@ -9,11 +9,14 @@ import type { NewsletterOptInSource } from "./brevo";
// 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.
// Per the user's own explicit wording request, see the newsletter-DOI
// memory — kept here once rather than duplicated across all 4 forms.
const SUCCESS_MESSAGE = "Fast geschafft! Schau kurz in dein Postfach – da wartet schon eine Mail von uns.";
// Deliberately routed through the *error* state, not a success variant —
// per explicit feedback: swapping the whole form out for a bare message
// (the real-success treatment) felt wrong for "you're already signed up,
// nothing to do" — the form should stay visible, with a small note below
// it, exactly like every other inline validation error already does.
const ALREADY_SUBSCRIBED_MESSAGE = "Diese E-Mail-Adresse ist schon für unseren Newsletter angemeldet.";
export function useNewsletterSignup(source: NewsletterOptInSource) {
@@ -22,7 +25,6 @@ export function useNewsletterSignup(source: NewsletterOptInSource) {
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<HTMLInputElement>(null);
function handleEmailChange(value: string) {
@@ -56,7 +58,11 @@ export function useNewsletterSignup(source: NewsletterOptInSource) {
setStatus("error");
return;
}
setSuccessMessage(data.alreadySubscribed ? ALREADY_SUBSCRIBED_MESSAGE : SUCCESS_MESSAGE);
if (data.alreadySubscribed) {
setError(ALREADY_SUBSCRIBED_MESSAGE);
setStatus("error");
return;
}
setStatus("success");
} catch {
setError("Anmeldung ist fehlgeschlagen. Bitte versuche es später erneut.");
@@ -64,5 +70,5 @@ export function useNewsletterSignup(source: NewsletterOptInSource) {
}
}
return { email, emailError, consent, setConsent, status, error, successMessage, emailRef, handleEmailChange, handleEmailBlur, handleSubmit };
return { email, emailError, consent, setConsent, status, error, successMessage: SUCCESS_MESSAGE, emailRef, handleEmailChange, handleEmailBlur, handleSubmit };
}