Updated email template
This commit is contained in:
Corey Blais
+56
-38
@@ -1,5 +1,5 @@
|
||||
import crypto from 'crypto';
|
||||
import { readFileSync } from 'fs';
|
||||
import { existsSync } from 'fs';
|
||||
import path from 'path';
|
||||
import cors from 'cors';
|
||||
import dotenv from 'dotenv';
|
||||
@@ -7,7 +7,7 @@ import express, { type NextFunction, type Request, type Response } from 'express
|
||||
import rateLimit from 'express-rate-limit';
|
||||
import helmet from 'helmet';
|
||||
import morgan from 'morgan';
|
||||
import nodemailer from 'nodemailer';
|
||||
import nodemailer, { type SendMailOptions } from 'nodemailer';
|
||||
import Stripe from 'stripe';
|
||||
import { z } from 'zod';
|
||||
|
||||
@@ -838,25 +838,34 @@ const getMilestoneYearCount = (reminder: BirdMilestoneReminderCandidateRow) => {
|
||||
return Number.isFinite(sourceYear) ? Math.max(0, reminder.reminder_year - sourceYear) : 0;
|
||||
};
|
||||
|
||||
const getFlockPalLogoDataUrl = () =>
|
||||
'data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 64 64%22%3E%3Cdefs%3E%3ClinearGradient id=%22featherFill%22 x1=%220%25%22 y1=%220%25%22 x2=%22100%25%22 y2=%22100%25%22%3E%3Cstop offset=%220%25%22 stop-color=%22%23cb3a35%22/%3E%3Cstop offset=%2230%25%22 stop-color=%22%23f0b63f%22/%3E%3Cstop offset=%2258%25%22 stop-color=%22%23238a5a%22/%3E%3Cstop offset=%22100%25%22 stop-color=%22%232769b3%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d=%22M50.8 10.4C37.9 10.3 27 18.5 22.7 31.1c-3.1 9.1-2.1 18.5-8.6 24.8c-1.5 1.5-0.2 4 1.9 3.6c8.4-1.5 14.6-6.7 18.6-13.7c1 0.5 2.2 0.8 3.4 0.8c3.5 0 6.5-2.3 7.5-5.4c1.9-0.4 3.7-1.3 5.1-2.7c2-2 3-4.6 3.1-7.2c3.3-5.8 4.9-12.9 1.4-20.2c-0.7-1.3-2-0.7-4.3-0.7Z%22 fill=%22url(%23featherFill)%22/%3E%3Cpath d=%22M18 56c8.5-3.4 14.2-9.8 18.1-17.8M26.9 48.9c6.9-7.2 13.5-14.8 20.3-22.1M31.8 41.2c6.4-1.3 12.1-4.6 16.5-9.4M36.8 33.8c4.9-0.9 9.2-3.4 12.6-7.1%22 fill=%22none%22 stroke=%22%23fff8ef%22 stroke-linecap=%22round%22 stroke-width=%222.6%22/%3E%3Cpath d=%22M18 56c8.5-3.4 14.2-9.8 18.1-17.8%22 fill=%22none%22 stroke=%22%2363562d%22 stroke-linecap=%22round%22 stroke-width=%222.2%22/%3E%3C/svg%3E';
|
||||
const getFlockPalLogoSvg = () =>
|
||||
`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><defs><linearGradient id="featherFill" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#cb3a35"/><stop offset="30%" stop-color="#f0b63f"/><stop offset="58%" stop-color="#238a5a"/><stop offset="100%" stop-color="#2769b3"/></linearGradient></defs><path d="M50.8 10.4C37.9 10.3 27 18.5 22.7 31.1c-3.1 9.1-2.1 18.5-8.6 24.8c-1.5 1.5-0.2 4 1.9 3.6c8.4-1.5 14.6-6.7 18.6-13.7c1 0.5 2.2 0.8 3.4 0.8c3.5 0 6.5-2.3 7.5-5.4c1.9-0.4 3.7-1.3 5.1-2.7c2-2 3-4.6 3.1-7.2c3.3-5.8 4.9-12.9 1.4-20.2c-0.7-1.3-2-0.7-4.3-0.7Z" fill="url(#featherFill)"/><path d="M18 56c8.5-3.4 14.2-9.8 18.1-17.8M26.9 48.9c6.9-7.2 13.5-14.8 20.3-22.1M31.8 41.2c6.4-1.3 12.1-4.6 16.5-9.4M36.8 33.8c4.9-0.9 9.2-3.4 12.6-7.1" fill="none" stroke="#fff8ef" stroke-linecap="round" stroke-width="2.6"/><path d="M18 56c8.5-3.4 14.2-9.8 18.1-17.8" fill="none" stroke="#63562d" stroke-linecap="round" stroke-width="2.2"/></svg>`;
|
||||
|
||||
let defaultBirdPhotoDataUrl: string | null = null;
|
||||
|
||||
const getDefaultBirdPhotoDataUrl = () => {
|
||||
if (defaultBirdPhotoDataUrl) {
|
||||
return defaultBirdPhotoDataUrl;
|
||||
}
|
||||
|
||||
const defaultPhotoPath = process.env.DEFAULT_BIRD_PHOTO_PATH?.trim() || path.join(process.cwd(), 'assets', 'yoda.png');
|
||||
|
||||
try {
|
||||
defaultBirdPhotoDataUrl = `data:image/png;base64,${readFileSync(defaultPhotoPath).toString('base64')}`;
|
||||
return defaultBirdPhotoDataUrl;
|
||||
} catch (error) {
|
||||
console.warn(`Unable to load default bird photo from ${defaultPhotoPath}`, error);
|
||||
const parseDataImage = (dataUrl: string) => {
|
||||
const match = /^data:(image\/[a-zA-Z0-9.+-]+);base64,(.+)$/.exec(dataUrl);
|
||||
if (!match) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return {
|
||||
contentType: match[1],
|
||||
content: Buffer.from(match[2], 'base64'),
|
||||
};
|
||||
};
|
||||
|
||||
const getDefaultBirdPhotoAttachment = () => {
|
||||
const defaultPhotoPath = process.env.DEFAULT_BIRD_PHOTO_PATH?.trim() || path.join(process.cwd(), 'assets', 'yoda.png');
|
||||
|
||||
if (!existsSync(defaultPhotoPath)) {
|
||||
console.warn(`Unable to load default bird photo from ${defaultPhotoPath}`);
|
||||
return null;
|
||||
}
|
||||
|
||||
return {
|
||||
filename: 'yoda.png',
|
||||
path: defaultPhotoPath,
|
||||
cid: 'flockpal-default-bird-photo',
|
||||
};
|
||||
};
|
||||
|
||||
const sendRescueStatusNotification = async ({
|
||||
@@ -1086,7 +1095,6 @@ const buildBirdMilestoneReminderCopy = (reminder: BirdMilestoneReminderCandidate
|
||||
: `${reminder.name} has a Hatch Day today.`,
|
||||
body: 'Cue the favorite snacks, extra head scritches if approved, and one tiny spotlight for the bird of the day.',
|
||||
milestoneLabel: yearCount > 0 ? `${yearCount} year${yearCount === 1 ? '' : 's'} old` : 'Hatch Day on file',
|
||||
signoff: 'FlockPal is keeping the milestone warm in the flock record.',
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1099,9 +1107,8 @@ const buildBirdMilestoneReminderCopy = (reminder: BirdMilestoneReminderCandidate
|
||||
yearCount > 0
|
||||
? `From our flock to yours, wishing ${reminder.name} a happy Gotcha Day! ${reminder.name} joined the flock ${yearCount} year${yearCount === 1 ? '' : 's'} ago today.`
|
||||
: `${reminder.name} has a Gotcha Day today.`,
|
||||
body: 'A good day to remember the first ride home, the first brave perch, and every little routine built since.',
|
||||
body: 'A good day to remember the first ride home, the first brave step up, and every happy moment spent together.',
|
||||
milestoneLabel: yearCount > 0 ? `${formatOrdinal(yearCount)} Gotcha Day` : 'Gotcha Day on file',
|
||||
signoff: 'FlockPal saved the date so the flock can celebrate the story.',
|
||||
};
|
||||
};
|
||||
|
||||
@@ -1119,13 +1126,32 @@ const sendBirdMilestoneReminderNotification = async ({
|
||||
}
|
||||
|
||||
const copy = buildBirdMilestoneReminderCopy(reminder);
|
||||
const yearCount = getMilestoneYearCount(reminder);
|
||||
const logoDataUrl = getFlockPalLogoDataUrl();
|
||||
const birdPhotoSrc = reminder.photo_data_url || getDefaultBirdPhotoDataUrl();
|
||||
const birdPhotoHtml = birdPhotoSrc
|
||||
? `<img src="${escapeHtml(birdPhotoSrc)}" alt="${escapeHtml(reminder.name)}" style="display: block; width: 148px; height: 148px; border-radius: 28px; object-fit: cover; border: 4px solid #fff8ef; box-shadow: 0 14px 30px rgba(38, 51, 49, 0.18);" />`
|
||||
const attachments: NonNullable<SendMailOptions['attachments']> = [
|
||||
{
|
||||
filename: 'flockpal-logo.svg',
|
||||
content: getFlockPalLogoSvg(),
|
||||
contentType: 'image/svg+xml',
|
||||
cid: 'flockpal-logo',
|
||||
},
|
||||
];
|
||||
const uploadedBirdPhoto = reminder.photo_data_url ? parseDataImage(reminder.photo_data_url) : null;
|
||||
const defaultBirdPhoto = uploadedBirdPhoto ? null : getDefaultBirdPhotoAttachment();
|
||||
const birdPhotoCid = uploadedBirdPhoto ? 'bird-photo' : defaultBirdPhoto ? defaultBirdPhoto.cid : '';
|
||||
|
||||
if (uploadedBirdPhoto) {
|
||||
attachments.push({
|
||||
filename: `${reminder.name.replace(/[^a-z0-9_-]+/gi, '-').toLowerCase() || 'bird'}-photo`,
|
||||
content: uploadedBirdPhoto.content,
|
||||
contentType: uploadedBirdPhoto.contentType,
|
||||
cid: birdPhotoCid,
|
||||
});
|
||||
} else if (defaultBirdPhoto) {
|
||||
attachments.push(defaultBirdPhoto);
|
||||
}
|
||||
|
||||
const birdPhotoHtml = birdPhotoCid
|
||||
? `<img src="cid:${birdPhotoCid}" alt="${escapeHtml(reminder.name)}" style="display: block; width: 148px; height: 148px; border-radius: 28px; object-fit: cover; border: 4px solid #fff8ef; box-shadow: 0 14px 30px rgba(38, 51, 49, 0.18);" />`
|
||||
: `<div style="display: grid; place-items: center; width: 148px; height: 148px; border-radius: 28px; background: linear-gradient(135deg, #fff8ef, #eaf7ef); border: 4px solid #fff8ef; box-shadow: 0 14px 30px rgba(38, 51, 49, 0.18); color: #238a5a; font-size: 64px; font-weight: 800;">${escapeHtml(reminder.name.slice(0, 1).toUpperCase())}</div>`;
|
||||
const milestoneCountLine = `${copy.eyebrow}: ${copy.milestoneLabel}`;
|
||||
const lines = [
|
||||
copy.headline,
|
||||
'',
|
||||
@@ -1134,8 +1160,7 @@ const sendBirdMilestoneReminderNotification = async ({
|
||||
'',
|
||||
`Bird: ${reminder.name}`,
|
||||
`Species: ${reminder.species}`,
|
||||
`Flock: ${reminder.workspace_name}`,
|
||||
milestoneCountLine,
|
||||
`${copy.eventName}: ${copy.milestoneLabel}`,
|
||||
'',
|
||||
`Open FlockPal: ${frontendBaseUrl}`,
|
||||
];
|
||||
@@ -1151,11 +1176,12 @@ const sendBirdMilestoneReminderNotification = async ({
|
||||
bcc: uniqueRecipients,
|
||||
subject: copy.subject,
|
||||
text: lines.join('\n'),
|
||||
attachments,
|
||||
html: `
|
||||
<div style="margin: 0; padding: 28px; background: #f4efe4; font-family: Arial, sans-serif; color: #263331; line-height: 1.6;">
|
||||
<div style="max-width: 680px; margin: 0 auto; overflow: hidden; border-radius: 30px; background: #fffdf7; border: 1px solid #eadfcd; box-shadow: 0 24px 60px rgba(38, 51, 49, 0.16);">
|
||||
<div style="padding: 24px 28px; background: linear-gradient(135deg, #fff8ef, #eaf7ef);">
|
||||
<img src="${logoDataUrl}" alt="FlockPal" style="display: block; width: 58px; height: 58px;" />
|
||||
<img src="cid:flockpal-logo" alt="FlockPal" style="display: block; width: 58px; height: 58px;" />
|
||||
</div>
|
||||
<div style="padding: 30px 28px;">
|
||||
<table role="presentation" width="100%" cellspacing="0" cellpadding="0" style="border-collapse: collapse;">
|
||||
@@ -1164,20 +1190,12 @@ const sendBirdMilestoneReminderNotification = async ({
|
||||
${birdPhotoHtml}
|
||||
</td>
|
||||
<td style="vertical-align: top; padding: 0 0 20px;">
|
||||
<p style="margin: 0 0 8px; letter-spacing: 0.16em; text-transform: uppercase; color: #238a5a; font-size: 12px; font-weight: 700;">${escapeHtml(copy.eyebrow)}</p>
|
||||
<h1 style="margin: 0 0 12px; color: #263331; font-size: 30px; line-height: 1.12;">${escapeHtml(copy.headline)}</h1>
|
||||
<p style="margin: 0; color: #63562d; font-size: 17px;">${escapeHtml(copy.intro)}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p style="margin: 4px 0 18px; font-size: 16px;">${escapeHtml(copy.body)}</p>
|
||||
<div style="margin: 22px 0; padding: 18px; border-radius: 20px; background: #fff8ef; border: 1px solid #eadfcd;">
|
||||
<p style="margin: 0;"><strong>Bird:</strong> ${escapeHtml(reminder.name)}</p>
|
||||
<p style="margin: 0;"><strong>Species:</strong> ${escapeHtml(reminder.species)}</p>
|
||||
<p style="margin: 0;"><strong>Flock:</strong> ${escapeHtml(reminder.workspace_name)}</p>
|
||||
<p style="margin: 0;"><strong>${escapeHtml(copy.eventName)}:</strong> ${escapeHtml(copy.milestoneLabel)}</p>
|
||||
</div>
|
||||
<p style="margin: 0 0 18px;">${escapeHtml(copy.signoff)}</p>
|
||||
<p style="margin: 0;">
|
||||
<a href="${frontendBaseUrl}" style="display: inline-block; padding: 12px 18px; border-radius: 999px; background: #238a5a; color: #ffffff; text-decoration: none; font-weight: 700;">Open FlockPal</a>
|
||||
</p>
|
||||
|
||||
Reference in New Issue
Block a user