Files
Mathew 9b6638eb00
Deploy / deploy (push) Successful in 1m13s
Ajoute une couche de micro-animations sur tout le site
Deux courbes partagées dans lib/motion.ts, pour que le CSS et Framer
aient le même feeling, et quatre primitives que Tailwind ne sait pas
exprimer : reflet de bouton, halo qui suit le curseur, soulignement qui
se dessine, secousse d'erreur.

Nouveaux composants : Stagger (les collections se distribuent une par
une), Spotlight (trouve son parent tout seul, donc les cartes restent
des composants serveur), ScrollProgress, BackToTop, Parallax, Spinner,
CheckMark. Reveal accepte maintenant une direction.

Côté rendu : le trait de nav glisse d'un onglet à l'autre, les cartes
se soulèvent, le hero réagit au scroll, les piliers entrent en zig-zag,
la lightbox glisse dans le sens demandé et les formulaires répondent.

prefers-reduced-motion est respecté partout : Framer coupe via
useReducedMotion, le CSS via la media query déjà en place.

Le commit embarque aussi la réorganisation des composants par domaine
qui était en cours dans l'arbre de travail — les deux étaient trop
imbriquées pour être séparées proprement.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-08-02 16:04:41 +02:00

128 lines
3.8 KiB
TypeScript

"use server";
import { Resend } from "resend";
import { autoReplyEmail, staffNotificationEmail } from "@/lib/emails";
import { CONTACT_CHANNELS } from "@/lib/site";
export type ContactState = {
status: "idle" | "success" | "error";
message: string;
fieldErrors?: Partial<Record<"name" | "email" | "subject" | "message", string>>;
};
const EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
export async function sendContact(
_prev: ContactState,
formData: FormData,
): Promise<ContactState> {
const name = String(formData.get("name") ?? "").trim();
const email = String(formData.get("email") ?? "").trim();
const subject = String(formData.get("subject") ?? "").trim();
const message = String(formData.get("message") ?? "").trim();
const honeypot = String(formData.get("website") ?? "");
// Which desk the message is for. Never trusted as-is: it only counts when it
// matches a declared channel, so a crafted request cannot inject a label
// into the staff email subject.
const rawTopic = String(formData.get("topic") ?? "").trim();
const topic = CONTACT_CHANNELS.some((channel) => channel.label === rawTopic)
? rawTopic
: null;
if (honeypot) {
return { status: "success", message: "Thanks for reaching out." };
}
const fieldErrors: ContactState["fieldErrors"] = {};
if (!name) fieldErrors.name = "Required.";
if (!email || !EMAIL_RE.test(email)) fieldErrors.email = "Valid email required.";
if (!subject) fieldErrors.subject = "Required.";
if (!message || message.length < 10) {
fieldErrors.message = "Tell us a bit more (10+ chars).";
}
if (Object.keys(fieldErrors).length > 0) {
return {
status: "error",
message: "Please fix the highlighted fields.",
fieldErrors,
};
}
const apiKey = process.env.RESEND_API_KEY;
const to = process.env.CONTACT_TO_EMAIL;
const from = process.env.CONTACT_FROM_EMAIL;
if (!apiKey || !to || !from) {
console.error(
"[contact] Missing email env vars (RESEND_API_KEY / CONTACT_TO_EMAIL / CONTACT_FROM_EMAIL).",
);
return {
status: "error",
message: "Email isn't configured yet. Please try again later.",
};
}
// The studio inbox is a single address, so the desk is carried in the
// subject line — that is what makes it filterable.
const contact = {
name,
email,
subject: topic ? `[${topic}] ${subject}` : subject,
message,
};
try {
const resend = new Resend(apiKey);
// Critical: notify the studio staff. If this fails, surface an error.
const staff = staffNotificationEmail(contact);
const { error } = await resend.emails.send({
from,
to,
replyTo: email,
subject: staff.subject,
html: staff.html,
text: staff.text,
});
if (error) {
console.error("[contact] Resend error (staff):", error);
return {
status: "error",
message: "Something went wrong sending your message. Please try again.",
};
}
// Best-effort: send an acknowledgement to the visitor. A failure here
// shouldn't fail the whole submission — the staff was already notified.
try {
const reply = autoReplyEmail(contact);
const { error: replyError } = await resend.emails.send({
from,
to: email,
subject: reply.subject,
html: reply.html,
text: reply.text,
});
if (replyError) {
console.error("[contact] Resend error (auto-reply):", replyError);
}
} catch (replyErr) {
console.error("[contact] Auto-reply failed:", replyErr);
}
} catch (err) {
console.error("[contact] Unexpected error:", err);
return {
status: "error",
message: "Something went wrong sending your message. Please try again.",
};
}
return {
status: "success",
message: "Message sent. We'll get back to you soon.",
};
}