6734e9557b
This takes part of the work being done in #96 that was reverted but still useful. Note Tailwind and Fresh weren't upgraded because there's no security vulnerability in either, and I have found the new versions to be worse in performance. Thos will likely stay at those fixed versions going forward.
615 lines
14 KiB
TypeScript
615 lines
14 KiB
TypeScript
import nodemailer from 'nodemailer';
|
|
import '@std/dotenv/load';
|
|
|
|
import { escapeHtml } from '/lib/utils/misc.ts';
|
|
import { AppConfig } from '/lib/config.ts';
|
|
|
|
const SMTP_USERNAME = Deno.env.get('SMTP_USERNAME') || '';
|
|
const SMTP_PASSWORD = Deno.env.get('SMTP_PASSWORD') || '';
|
|
|
|
export class EmailModel {
|
|
private static async send(to: string, subject: string, htmlBody: string, textBody: string) {
|
|
const emailConfig = await AppConfig.getEmailConfig();
|
|
|
|
if (!emailConfig.from || !emailConfig.host || !emailConfig.port) {
|
|
throw new Error('config.email.from, config.email.host, or config.email.port is not set');
|
|
}
|
|
|
|
const transporterConfig = {
|
|
host: emailConfig.host,
|
|
port: emailConfig.port,
|
|
secure: Number(emailConfig.port) === 465,
|
|
auth: {
|
|
user: SMTP_USERNAME,
|
|
pass: SMTP_PASSWORD,
|
|
},
|
|
};
|
|
|
|
const transporter = nodemailer.createTransport(transporterConfig);
|
|
|
|
const mailOptions = {
|
|
from: emailConfig.from,
|
|
to,
|
|
subject,
|
|
html: htmlBody,
|
|
text: textBody,
|
|
};
|
|
|
|
try {
|
|
await transporter.sendMail(mailOptions);
|
|
console.log(`Email sent to "${to}", "${subject}"`);
|
|
} catch (error) {
|
|
console.log(error);
|
|
throw new Error(`Failed to send email to "${to}", "${subject}"`);
|
|
}
|
|
}
|
|
|
|
/** Based off of https://github.com/ActiveCampaign/postmark-templates/tree/main/templates-inlined/basic/password-reset */
|
|
private static getHtmlBody(title: string, htmlBody: string) {
|
|
return `
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="x-apple-disable-message-reformatting" />
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
<meta name="color-scheme" content="light dark" />
|
|
<meta name="supported-color-schemes" content="light dark" />
|
|
<title>${escapeHtml(title)}</title>
|
|
<style type="text/css" rel="stylesheet" media="all">
|
|
/* Base ------------------------------ */
|
|
|
|
@import url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,700&display=swap");
|
|
body {
|
|
width: 100% !important;
|
|
height: 100%;
|
|
margin: 0;
|
|
-webkit-text-size-adjust: none;
|
|
}
|
|
|
|
a {
|
|
color: #3869D4;
|
|
}
|
|
|
|
a img {
|
|
border: none;
|
|
}
|
|
|
|
td {
|
|
word-break: break-word;
|
|
}
|
|
|
|
.preheader {
|
|
display: none !important;
|
|
visibility: hidden;
|
|
mso-hide: all;
|
|
font-size: 1px;
|
|
line-height: 1px;
|
|
max-height: 0;
|
|
max-width: 0;
|
|
opacity: 0;
|
|
overflow: hidden;
|
|
}
|
|
/* Type ------------------------------ */
|
|
|
|
body,
|
|
td,
|
|
th {
|
|
font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
|
|
}
|
|
|
|
h1 {
|
|
margin-top: 0;
|
|
color: #333333;
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
}
|
|
|
|
h2 {
|
|
margin-top: 0;
|
|
color: #333333;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
}
|
|
|
|
h3 {
|
|
margin-top: 0;
|
|
color: #333333;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
}
|
|
|
|
td,
|
|
th {
|
|
font-size: 16px;
|
|
}
|
|
|
|
p,
|
|
ul,
|
|
ol,
|
|
blockquote {
|
|
margin: .4em 0 1.1875em;
|
|
font-size: 16px;
|
|
line-height: 1.625;
|
|
}
|
|
|
|
p.sub {
|
|
font-size: 13px;
|
|
}
|
|
/* Utilities ------------------------------ */
|
|
|
|
.align-right {
|
|
text-align: right;
|
|
}
|
|
|
|
.align-left {
|
|
text-align: left;
|
|
}
|
|
|
|
.align-center {
|
|
text-align: center;
|
|
}
|
|
|
|
.u-margin-bottom-none {
|
|
margin-bottom: 0;
|
|
}
|
|
/* Buttons ------------------------------ */
|
|
|
|
.button {
|
|
background-color: #3869D4;
|
|
border-top: 10px solid #3869D4;
|
|
border-right: 18px solid #3869D4;
|
|
border-bottom: 10px solid #3869D4;
|
|
border-left: 18px solid #3869D4;
|
|
display: inline-block;
|
|
color: #FFF;
|
|
text-decoration: none;
|
|
border-radius: 3px;
|
|
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
|
|
-webkit-text-size-adjust: none;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.button--green {
|
|
background-color: #22BC66;
|
|
border-top: 10px solid #22BC66;
|
|
border-right: 18px solid #22BC66;
|
|
border-bottom: 10px solid #22BC66;
|
|
border-left: 18px solid #22BC66;
|
|
}
|
|
|
|
.button--red {
|
|
background-color: #FF6136;
|
|
border-top: 10px solid #FF6136;
|
|
border-right: 18px solid #FF6136;
|
|
border-bottom: 10px solid #FF6136;
|
|
border-left: 18px solid #FF6136;
|
|
}
|
|
|
|
@media only screen and (max-width: 500px) {
|
|
.button {
|
|
width: 100% !important;
|
|
text-align: center !important;
|
|
}
|
|
}
|
|
/* Attribute list ------------------------------ */
|
|
|
|
.attributes {
|
|
margin: 0 0 21px;
|
|
}
|
|
|
|
.attributes_content {
|
|
background-color: #F4F4F7;
|
|
padding: 16px;
|
|
}
|
|
|
|
.attributes_item {
|
|
padding: 0;
|
|
}
|
|
/* Related Items ------------------------------ */
|
|
|
|
.related {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 25px 0 0 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
}
|
|
|
|
.related_item {
|
|
padding: 10px 0;
|
|
color: #CBCCCF;
|
|
font-size: 15px;
|
|
line-height: 18px;
|
|
}
|
|
|
|
.related_item-title {
|
|
display: block;
|
|
margin: .5em 0 0;
|
|
}
|
|
|
|
.related_item-thumb {
|
|
display: block;
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
.related_heading {
|
|
border-top: 1px solid #CBCCCF;
|
|
text-align: center;
|
|
padding: 25px 0 10px;
|
|
}
|
|
/* Discount Code ------------------------------ */
|
|
|
|
.discount {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 24px;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
background-color: #F4F4F7;
|
|
border: 2px dashed #CBCCCF;
|
|
}
|
|
|
|
.discount_heading {
|
|
text-align: center;
|
|
}
|
|
|
|
.discount_body {
|
|
text-align: center;
|
|
font-size: 15px;
|
|
}
|
|
/* Social Icons ------------------------------ */
|
|
|
|
.social {
|
|
width: auto;
|
|
}
|
|
|
|
.social td {
|
|
padding: 0;
|
|
width: auto;
|
|
}
|
|
|
|
.social_icon {
|
|
height: 20px;
|
|
margin: 0 8px 10px 8px;
|
|
padding: 0;
|
|
}
|
|
/* Data table ------------------------------ */
|
|
|
|
.purchase {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 35px 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
}
|
|
|
|
.purchase_content {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 25px 0 0 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
}
|
|
|
|
.purchase_item {
|
|
padding: 10px 0;
|
|
color: #51545E;
|
|
font-size: 15px;
|
|
line-height: 18px;
|
|
}
|
|
|
|
.purchase_heading {
|
|
padding-bottom: 8px;
|
|
border-bottom: 1px solid #EAEAEC;
|
|
}
|
|
|
|
.purchase_heading p {
|
|
margin: 0;
|
|
color: #85878E;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.purchase_footer {
|
|
padding-top: 15px;
|
|
border-top: 1px solid #EAEAEC;
|
|
}
|
|
|
|
.purchase_total {
|
|
margin: 0;
|
|
text-align: right;
|
|
font-weight: bold;
|
|
color: #333333;
|
|
}
|
|
|
|
.purchase_total--label {
|
|
padding: 0 15px 0 0;
|
|
}
|
|
|
|
body {
|
|
background-color: #F2F4F6;
|
|
color: #51545E;
|
|
}
|
|
|
|
p {
|
|
color: #51545E;
|
|
}
|
|
|
|
.email-wrapper {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
background-color: #F2F4F6;
|
|
}
|
|
|
|
.email-content {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
}
|
|
/* Masthead ----------------------- */
|
|
|
|
.email-masthead {
|
|
padding: 25px 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.email-masthead_logo {
|
|
width: 94px;
|
|
}
|
|
|
|
.email-masthead_name {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
color: #A8AAAF;
|
|
text-decoration: none;
|
|
text-shadow: 0 1px 0 white;
|
|
}
|
|
/* Body ------------------------------ */
|
|
|
|
.email-body {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
}
|
|
|
|
.email-body_inner {
|
|
width: 570px;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
-premailer-width: 570px;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
background-color: #FFFFFF;
|
|
}
|
|
|
|
.email-footer {
|
|
width: 570px;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
-premailer-width: 570px;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.email-footer p {
|
|
color: #A8AAAF;
|
|
}
|
|
|
|
.body-action {
|
|
width: 100%;
|
|
margin: 30px auto;
|
|
padding: 0;
|
|
-premailer-width: 100%;
|
|
-premailer-cellpadding: 0;
|
|
-premailer-cellspacing: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.body-sub {
|
|
margin-top: 25px;
|
|
padding-top: 25px;
|
|
border-top: 1px solid #EAEAEC;
|
|
}
|
|
|
|
.content-cell {
|
|
padding: 45px;
|
|
}
|
|
/*Media Queries ------------------------------ */
|
|
|
|
@media only screen and (max-width: 600px) {
|
|
.email-body_inner,
|
|
.email-footer {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
body,
|
|
.email-body,
|
|
.email-body_inner,
|
|
.email-content,
|
|
.email-wrapper,
|
|
.email-masthead,
|
|
.email-footer {
|
|
background-color: #333333 !important;
|
|
color: #FFF !important;
|
|
}
|
|
p,
|
|
ul,
|
|
ol,
|
|
blockquote,
|
|
h1,
|
|
h2,
|
|
h3,
|
|
span,
|
|
.purchase_item {
|
|
color: #FFF !important;
|
|
}
|
|
.attributes_content,
|
|
.discount {
|
|
background-color: #222 !important;
|
|
}
|
|
.email-masthead_name {
|
|
text-shadow: none !important;
|
|
}
|
|
}
|
|
|
|
:root {
|
|
color-scheme: light dark;
|
|
supported-color-schemes: light dark;
|
|
}
|
|
</style>
|
|
<!--[if mso]>
|
|
<style type="text/css">
|
|
.f-fallback {
|
|
font-family: Arial, sans-serif;
|
|
}
|
|
</style>
|
|
<![endif]-->
|
|
</head>
|
|
<body>
|
|
<span class="preheader">${escapeHtml(title)}</span>
|
|
<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation">
|
|
<tr>
|
|
<td align="center">
|
|
<table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation">
|
|
<tr>
|
|
<td class="email-masthead">
|
|
<a href="https://bewcloud.com" class="f-fallback email-masthead_name">
|
|
bewCloud
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="email-body" width="570" cellpadding="0" cellspacing="0">
|
|
<table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
|
|
<tr>
|
|
<td class="content-cell">
|
|
<div class="f-fallback">
|
|
${htmlBody}
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</body>
|
|
</html>
|
|
`;
|
|
}
|
|
|
|
static async sendVerificationEmail(
|
|
email: string,
|
|
verificationCode: string,
|
|
) {
|
|
const emailTitle = 'Verify your email in bewCloud';
|
|
|
|
const textBody = `
|
|
${emailTitle}
|
|
------------------------
|
|
|
|
You or someone who knows your email is trying to verify it in bewCloud.
|
|
|
|
Here's the verification code:
|
|
|
|
**${verificationCode}**
|
|
===============================
|
|
|
|
This code will expire in 30 minutes.
|
|
`;
|
|
|
|
const htmlBody = this.getHtmlBody(
|
|
emailTitle,
|
|
`
|
|
<h1>${escapeHtml(emailTitle)}</h1>
|
|
<p>You or someone who knows your email is trying to verify it in bewCloud.</p>
|
|
<p>Here's the verification code:</p>
|
|
<table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
|
|
<tr>
|
|
<td align="center">
|
|
<table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
|
|
<tr>
|
|
<td align="center">
|
|
<span class="f-fallback button button--green">${escapeHtml(verificationCode)}</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<p>This code will expire in 30 minutes.</p>
|
|
`,
|
|
);
|
|
|
|
await this.send(email, emailTitle, htmlBody, textBody);
|
|
}
|
|
|
|
static async sendLoginVerificationEmail(
|
|
email: string,
|
|
verificationCode: string,
|
|
) {
|
|
const emailTitle = 'Verify your login in bewCloud';
|
|
|
|
const textBody = `
|
|
${emailTitle}
|
|
------------------------
|
|
|
|
You or someone who knows your email and password is trying to login to bewCloud.
|
|
|
|
Here's the verification code:
|
|
|
|
**${verificationCode}**
|
|
===============================
|
|
|
|
This code will expire in 30 minutes.
|
|
`;
|
|
|
|
const htmlBody = this.getHtmlBody(
|
|
emailTitle,
|
|
`
|
|
<h1>${escapeHtml(emailTitle)}</h1>
|
|
<p>You or someone who knows your email and password is trying to login to bewCloud.</p>
|
|
<p>Here's the verification code:</p>
|
|
<table class="body-action" align="center" width="100%" cellpadding="0" cellspacing="0" role="presentation">
|
|
<tr>
|
|
<td align="center">
|
|
<table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
|
|
<tr>
|
|
<td align="center">
|
|
<span class="f-fallback button button--green">${escapeHtml(verificationCode)}</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<p>This code will expire in 30 minutes.</p>
|
|
`,
|
|
);
|
|
|
|
await this.send(email, emailTitle, htmlBody, textBody);
|
|
}
|
|
}
|