Email (Resend)

VibeFast manda emails transaccionales con Resend y templates escritos en React Email. Todo el copy y el remitente salen de web/config.js.

Activar

1. Crea una cuenta en resend.com y saca un API key.
2. En web/.env.local pon:

   TerminalCopiar

   RESEND_API_KEY=re_...

3. En web/config.js deja features.resend: true (default).
4. (Opcional pero recomendado) verifica tu dominio en Resend y cambia config.email.from a un correo de ese dominio. En desarrollo puedes enviar desde onboarding@resend.dev a tu propio correo.

Cómo está implementado

• web/lib/resend/client.js — cliente único, devuelve null si email está off.
• web/lib/resend/templates/ — componentes React Email:
  • WaitlistConfirm — confirma el alta al waitlist (Sem 1).
  • Welcome — bienvenida en el primer login.
• web/lib/resend/send.js — helpers sendWaitlistConfirm(to) y sendWelcome(to, name). Devuelven { ok, skipped?, error? }.

Los envíos se disparan con after() de Next (después de responder), así que nunca bloquean la UI:

• /api/waitlist → manda WaitlistConfirm al anotarse.
• /auth/callback → manda Welcome solo en el primer login.

Agregar un template nuevo

1. Crea web/lib/resend/templates/MiTemplate.js (copia uno existente).
2. Agrega un helper en web/lib/resend/send.js:

   JavaScriptCopiar

   import MiTemplate from "@/lib/resend/templates/MiTemplate"
    
   export async function sendMiTemplate(to, props) {
     const resend = getResend()
     if (!resend) return { ok: false, skipped: true }
     const { error } = await resend.emails.send({
       from: config.email.from,
       to,
       subject: "Asunto",
       react: <MiTemplate {...props} />,
     })
     return error ? { ok: false, error: error.message } : { ok: true }
   }

3. Llámalo donde lo necesites (idealmente con after()).

Webhook de eventos (opcional)

Un webhook es una URL de tu app que otro servicio llama automáticamente cuando pasa algo. En este caso, /api/webhooks/resend recibe eventos de Resend (delivered, bounced…). Resend los firma con Svix:

1. En Resend → Webhooks, apunta a https://TU-DOMINIO/api/webhooks/resend. Aquí tienes que cambiar TU-DOMINIO por la URL donde vive tu app: tu URL de Vercel (ej. tu-producto.vercel.app) o tu dominio propio.
2. Copia el signing secret a web/.env.local (como cualquier otra variable de entorno):

   TerminalCopiar

   RESEND_WEBHOOK_SECRET=whsec_...

Sin el secret, en desarrollo el webhook acepta el payload sin verificar (con warning). En producción siempre configura el secret.

Errores comunes

• No llega el correo: revisa que RESEND_API_KEY esté en web/.env.local y que config.email.from use un dominio verificado (o onboarding@resend.dev enviando a tu propio correo).
• react no renderiza: ya viene @react-email/components. No mezcles HTML crudo con componentes de React Email en el mismo template.