jselesan/playzer
1
0
Fork 0
Code Issues Pull Requests 6 Actions Packages Projects Releases Wiki Activity

feat(emails): integrate email verification layout into auth email sending process

Browse Source
This commit is contained in:
Jose Selesan
2026-06-03 10:41:56 -03:00
parent 93fea8ecad
commit 43287a4baa
2 changed files with 66 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/backend/src/emails/booking-confirmation.ts
View File

@@ -49,7 +49,7 @@ const BASE_STYLES = `
} }
`; `;
function wrapLayout(content: string) { export function wrapLayout(content: string) {
return `<!DOCTYPE html> return `<!DOCTYPE html>
<html lang="es"> <html lang="es">
<head> <head>

66
apps/backend/src/lib/auth.ts
View File

@@ -1,3 +1,4 @@
import { wrapLayout } from '@/emails/booking-confirmation';
import { dash } from '@better-auth/infra'; import { dash } from '@better-auth/infra';
import { betterAuth } from 'better-auth'; import { betterAuth } from 'better-auth';
import { prismaAdapter } from 'better-auth/adapters/prisma'; import { prismaAdapter } from 'better-auth/adapters/prisma';
@@ -34,10 +35,73 @@ export const auth = betterAuth({
const verificationUrl = new URL(url); const verificationUrl = new URL(url);
const appUrl = process.env.APP_BASE_URL ?? 'http://localhost:5173'; const appUrl = process.env.APP_BASE_URL ?? 'http://localhost:5173';
verificationUrl.searchParams.set('callbackURL', appUrl); verificationUrl.searchParams.set('callbackURL', appUrl);
const content = `
<tr>
<td style="padding:32px 32px 24px;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td valign="top">
<table role="presentation" cellpadding="0" cellspacing="0" style="display:inline-block;background-color:#f4f4f5;border-radius:999px;padding:4px 12px;">
<tr>
<td style="font-size:11px;font-weight:700;letter-spacing:0.14em;color:#71717a;text-transform:uppercase;line-height:1.25rem;">
Verificaci&oacute;n de email
</td>
</tr>
</table>
<h1 style="margin:16px 0 0;font-size:24px;font-weight:700;color:#111827;letter-spacing:-0.025em;">
Verific&aacute; tu direcci&oacute;n de correo electr&oacute;nico
</h1>
</td>
<td valign="top" align="right" style="white-space:nowrap;">
<table role="presentation" cellpadding="0" cellspacing="0">
<tr>
<td valign="middle" style="padding-right:8px;">
<img src="${appUrl}/playzer-favicon-512-transparent.png" alt="Playzer" width="32" height="32" style="display:block;" />
</td>
<td valign="middle">
<span style="font-size:18px;font-weight:700;color:#475569;letter-spacing:-0.025em;">Playzer</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="padding:0 32px 24px;">
<p style="margin:0;font-size:15px;color:#374151;line-height:1.6;">
Hac&eacute; click en el bot&oacute;n de abajo para verificar tu direcci&oacute;n de correo electr&oacute;nico y empezar a usar Playzer.
</p>
</td>
</tr>
<tr>
<td style="padding:0 32px 32px;">
<table role="presentation" cellpadding="0" cellspacing="0">
<tr>
<td style="background-color:#059669;border-radius:12px;text-align:center;">
<a href="${verificationUrl.toString()}" style="display:block;padding:14px 32px;font-size:15px;font-weight:600;color:#ffffff;text-decoration:none;line-height:1.25rem;">Verificar email</a>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="padding:0 32px 32px;">
<p style="margin:0;font-size:13px;color:#9ca3af;text-align:center;line-height:1.5;">
Si no creaste una cuenta en Playzer, ignor&aacute; este mensaje.
</p>
</td>
</tr>`;
await sendMail({ await sendMail({
to: user.email, to: user.email,
subject: 'Verificá tu email en Playzer', subject: 'Verificá tu email en Playzer',
html: `Hacé click para verificar tu email: <a href="${verificationUrl.toString()}">${verificationUrl.toString()}</a>`, html: wrapLayout(content),
text: `Hacé click para verificar tu email: ${verificationUrl.toString()}`, text: `Hacé click para verificar tu email: ${verificationUrl.toString()}`,
}); });
}, },