@allbluecn/web-app 0.11.0 → 0.11.1

package/src/server/email/deliverability.ts

@@ -0,0 +1,57 @@
+import { createHmac, timingSafeEqual } from 'crypto'
+
+const UNSUB_TTL_MS = 10 * 365 * 24 * 60 * 60 * 1000 // 10 年（退订链接长期有效）
+
+function secret(): string {
+  return process.env.AUTH_SECRET ?? 'dev-only-secret'
+}
+
+export interface UnsubscribePayload {
+  userId: string
+  email: string
+  category: string
+  exp: number
+}
+
+function base64url(input: string | Buffer): string {
+  return Buffer.from(input).toString('base64url')
+}
+
+export function signUnsubscribeToken(
+  data: { userId: string; email: string; category: string },
+  ttlMs: number = UNSUB_TTL_MS,
+): string {
+  const payload: UnsubscribePayload = { ...data, exp: Date.now() + ttlMs }
+  const body = base64url(JSON.stringify(payload))
+  const sig = createHmac('sha256', secret()).update(body).digest('base64url')
+  return `${body}.${sig}`
+}
+
+export function verifyUnsubscribeToken(token: string): UnsubscribePayload | null {
+  const [body, sig] = token.split('.')
+  if (!body || !sig) return null
+  const expected = createHmac('sha256', secret()).update(body).digest()
+  const got = Buffer.from(sig, 'base64url')
+  if (expected.length !== got.length || !timingSafeEqual(expected, got)) return null
+  try {
+    const payload = JSON.parse(Buffer.from(body, 'base64url').toString()) as UnsubscribePayload
+    if (Date.now() > payload.exp) return null
+    return payload
+  } catch {
+    return null
+  }
+}
+
+export function buildUnsubscribeHeaders(params: {
+  appUrl: string
+  userId: string
+  email: string
+  category: string
+}): Record<string, string> {
+  const token = signUnsubscribeToken({ userId: params.userId, email: params.email, category: params.category })
+  const url = `${params.appUrl}/email-unsubscribe?token=${encodeURIComponent(token)}`
+  return {
+    'List-Unsubscribe': `<${url}>, <mailto:unsubscribe@allblue.local?subject=unsubscribe>`,
+    'List-Unsubscribe-Post': 'One-Click=List-Unsubscribe',
+  }
+}

package/src/server/email/drivers/console.ts

@@ -0,0 +1,11 @@
+import type { EmailMessage } from '../sender'
+
+function maskEmail(address: string): string {
+  const [local, domain] = address.split('@')
+  return domain && local ? `${local.slice(0, 1)}***@${domain}` : '***'
+}
+
+export async function sendByConsole(msg: EmailMessage): Promise<{ messageId: string | null; bounced: boolean }> {
+  console.log(`[email:console] To: ${maskEmail(msg.to)}, Subject: ${msg.subject}, ${msg.text?.length ?? 0} chars text`)
+  return { messageId: null, bounced: false }
+}

package/src/server/email/drivers/resend.ts

@@ -0,0 +1,31 @@
+import type { EmailMessage } from '../sender'
+
+interface ResendSendResponse {
+  id?: string
+  message?: string
+}
+
+export async function sendByResend(msg: EmailMessage): Promise<{ messageId: string | null; bounced: boolean }> {
+  const res = await fetch('https://api.resend.com/emails', {
+    method: 'POST',
+    headers: {
+      Authorization: `Bearer ${process.env.RESEND_API_KEY}`,
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify({
+      from: process.env.EMAIL_FROM,
+      to: [msg.to],
+      reply_to: msg.replyTo,
+      subject: msg.subject,
+      html: msg.html,
+      text: msg.text,
+      headers: msg.headers,
+    }),
+  })
+  if (!res.ok) {
+    const body = (await res.json().catch(() => ({}))) as ResendSendResponse
+    throw new Error(`Resend ${res.status}: ${body.message ?? 'send failed'}`)
+  }
+  const data = (await res.json()) as ResendSendResponse
+  return { messageId: data.id ?? null, bounced: false }
+}

package/src/server/email/drivers/smtp.ts

@@ -0,0 +1,27 @@
+import nodemailer from 'nodemailer'
+import type { EmailMessage } from '../sender'
+
+export async function sendBySmtp(msg: EmailMessage): Promise<{ messageId: string | null; bounced: boolean }> {
+  const transport = nodemailer.createTransport({
+    host: process.env.EMAIL_HOST,
+    port: Number(process.env.EMAIL_PORT ?? 587),
+    secure: Number(process.env.EMAIL_PORT) === 465,
+    auth: process.env.EMAIL_USER
+      ? { user: process.env.EMAIL_USER, pass: process.env.EMAIL_PASS }
+      : undefined,
+  })
+  try {
+    const info = await transport.sendMail({
+      from: process.env.EMAIL_FROM ?? 'AllBlue <no-reply@localhost>',
+      to: msg.to,
+      replyTo: msg.replyTo,
+      subject: msg.subject,
+      html: msg.html,
+      text: msg.text,
+      headers: msg.headers,
+    })
+    return { messageId: info.messageId ?? null, bounced: info.rejected.length > 0 }
+  } finally {
+    transport.close()
+  }
+}

package/src/server/email/index.ts

@@ -0,0 +1,56 @@
+import { outboxSend, generateEmailToken } from './outbox'
+import type { EmailLocale } from './registry'
+
+import { registerVerifyEmailTemplate } from './templates/auth/verify-email'
+import { registerResetPasswordTemplate } from './templates/auth/reset-password'
+import { registerWelcomeTemplate } from './templates/auth/welcome'
+import { registerNotificationMirrorTemplate } from './templates/notification/mirror'
+import { registerPaymentReceiptTemplate } from './templates/billing/payment-receipt'
+import { registerSubscriptionEndingTemplate } from './templates/billing/subscription-ending'
+import { registerSubscriptionCanceledTemplate } from './templates/billing/subscription-canceled'
+import { registerChangelogConfirmTemplate } from './templates/product/changelog-confirm'
+import { registerChangelogReleaseTemplate } from './templates/product/changelog-release'
+import { registerTeamInviteTemplate } from './templates/team/invite'
+import { registerTeamApplyNotifyTemplate } from './templates/team/apply-notify'
+import { registerTeamApprovedTemplate } from './templates/team/approved'
+
+let registered = false
+function ensureRegistered() {
+  if (registered) return
+  registerVerifyEmailTemplate()
+  registerResetPasswordTemplate()
+  registerWelcomeTemplate()
+  registerNotificationMirrorTemplate()
+  registerPaymentReceiptTemplate()
+  registerSubscriptionEndingTemplate()
+  registerSubscriptionCanceledTemplate()
+  registerChangelogConfirmTemplate()
+  registerChangelogReleaseTemplate()
+  registerTeamInviteTemplate()
+  registerTeamApplyNotifyTemplate()
+  registerTeamApprovedTemplate()
+  registered = true
+}
+
+export interface SendTemplateEmailParams {
+  key: string
+  to: string
+  locale?: string
+  userId?: string
+  dedupeKey?: string
+  vars: Record<string, unknown>
+  /** 覆盖默认 HMAC 退订 URL（DB-token 场景，如 changelog 订阅者退订）。 */
+  unsubscribeUrl?: string
+  /** 回复收件人（如团队邀请邮件的邀请人邮箱），透传给底层 driver。 */
+  replyTo?: string
+}
+
+export async function sendTemplateEmail(
+  params: SendTemplateEmailParams,
+): Promise<{ sent: boolean; skipped?: boolean; skipReason?: string }> {
+  ensureRegistered()
+  const locale: EmailLocale = params.locale === 'en' ? 'en' : 'zh'
+  return outboxSend({ ...params, locale })
+}
+
+export { generateEmailToken }

package/src/server/email/outbox.ts

@@ -0,0 +1,141 @@
+import { render } from '@react-email/render'
+import { createElement } from 'react'
+import { randomBytes } from 'crypto'
+import { prisma } from '@allbluecn/database'
+import { GUEST_USER_ID } from '@/server/desktop-guest'
+import { getTemplate, type EmailCategory, type EmailLocale } from './registry'
+import { sendByDriver, resolveDriver } from './sender'
+import { checkEmailEligibility } from './preferences'
+import { buildUnsubscribeHeaders } from './deliverability'
+
+const DAILY_LIMIT_BY_CATEGORY: Partial<Record<EmailCategory, number>> = {
+  notification: 10,
+}
+
+function isUniqueViolation(err: unknown): boolean {
+  return (err as { code?: string })?.code === 'P2002'
+}
+
+export interface OutboxSendParams {
+  key: string
+  to: string
+  locale: EmailLocale
+  userId?: string
+  dedupeKey?: string
+  vars: Record<string, unknown>
+  /** 覆盖默认 HMAC 退订 URL（DB-token 场景，如 changelog 订阅者）。
+   * 传入则走覆盖 URL 构造 List-Unsubscribe 头，不调 HMAC；未传则回落到 userId HMAC 路径。 */
+  unsubscribeUrl?: string
+  /** 回复收件人（如团队邀请邮件的邀请人邮箱），透传给底层 driver。 */
+  replyTo?: string
+}
+
+export interface OutboxSendResult {
+  sent: boolean
+  skipped?: boolean
+  skipReason?: string
+}
+
+export async function outboxSend(params: OutboxSendParams): Promise<OutboxSendResult> {
+  const meta = getTemplate(params.key)
+  if (!meta) throw new Error(`email template "${params.key}" not registered`)
+
+  // 邮箱大小写不敏感：入口归一化，下游速率计数 / HMAC 退订 / EmailLog / driver 全一致。
+  const to = params.to.toLowerCase()
+
+  if (params.userId === GUEST_USER_ID || to === 'guest@localhost') {
+    return { sent: false, skipped: true, skipReason: 'guest' }
+  }
+
+  if (params.dedupeKey) {
+    const existing = await prisma.emailLog.findUnique({ where: { dedupeKey: params.dedupeKey } })
+    if (existing) return { sent: false, skipped: true, skipReason: 'dedupe' }
+  }
+
+  const dailyLimit = DAILY_LIMIT_BY_CATEGORY[meta.category] ?? 50
+  const dayStart = new Date()
+  dayStart.setHours(0, 0, 0, 0)
+  const sentToday = await prisma.emailLog.count({
+    where: { to, category: meta.category, sentAt: { gte: dayStart } },
+  })
+  if (sentToday >= dailyLimit) {
+    return { sent: false, skipped: true, skipReason: 'rate-limit' }
+  }
+
+  if (!meta.transactional && params.userId) {
+    const eligibility = await checkEmailEligibility(params.userId, meta.category)
+    if (!eligibility.sendable) {
+      return { sent: false, skipped: true, skipReason: eligibility.reason }
+    }
+  }
+
+  const element = createElement(
+    meta.component,
+    { ...params.vars, locale: params.locale, unsubscribeUrl: params.unsubscribeUrl } as never,
+  )
+  const html = await render(element)
+  const text = await render(element, { plainText: true })
+  const rawSubject = meta.subject[params.locale]
+  const subject = typeof rawSubject === 'function' ? rawSubject(params.vars) : rawSubject
+  const headers: Record<string, string> = {}
+  if (!meta.transactional) {
+    if (params.unsubscribeUrl) {
+      headers['List-Unsubscribe'] = `<${params.unsubscribeUrl}>, <mailto:unsubscribe@allblue.local?subject=unsubscribe>`
+      headers['List-Unsubscribe-Post'] = 'One-Click=List-Unsubscribe'
+    } else if (params.userId) {
+      Object.assign(
+        headers,
+        buildUnsubscribeHeaders({
+          appUrl: process.env.VITE_APP_URL ?? 'http://localhost:3000',
+          userId: params.userId,
+          email: to,
+          category: meta.category,
+        }),
+      )
+    }
+  }
+  let log: { id: string }
+  try {
+    log = await prisma.emailLog.create({
+      data: {
+        to,
+        templateKey: params.key,
+        category: meta.category,
+        status: 'PENDING',
+        provider: resolveDriver(),
+        dedupeKey: params.dedupeKey,
+        userId: params.userId,
+      },
+    })
+  } catch (err) {
+    // 并发同 dedupeKey：前置 findUnique 未命中但 create 撞唯一键，
+    // 说明另一条同键记录刚写入——视为已发送过，直接跳过而非抛错。
+    if (params.dedupeKey && isUniqueViolation(err)) {
+      return { sent: false, skipped: true, skipReason: 'dedupe' }
+    }
+    throw err
+  }
+
+  const result = await sendByDriver({
+    to,
+    subject,
+    html,
+    text,
+    headers,
+    replyTo: params.replyTo,
+  })
+  await prisma.emailLog.update({
+    where: { id: log.id },
+    data: {
+      status: result.ok ? 'SENT' : 'FAILED',
+      messageId: result.messageId,
+      error: result.error,
+      sentAt: result.ok ? new Date() : undefined,
+    },
+  })
+  return { sent: result.ok }
+}
+
+export function generateEmailToken(): string {
+  return randomBytes(32).toString('hex')
+}

package/src/server/email/preferences.ts

@@ -0,0 +1,20 @@
+import { prisma } from '@allbluecn/database'
+import type { EmailCategory } from './registry'
+
+export interface EmailSendEligibility {
+  sendable: boolean
+  reason?: 'unsubscribed-all' | 'unsubscribed-category' | 'suppressed'
+}
+
+export async function checkEmailEligibility(userId: string, category: EmailCategory): Promise<EmailSendEligibility> {
+  const pref = await prisma.emailPreference.findUnique({
+    where: { userId },
+    select: { suppressed: true, unsubscribedAll: true, unsubscribedCategories: true },
+  })
+  if (!pref) return { sendable: true }
+  if (pref.suppressed) return { sendable: false, reason: 'suppressed' }
+  if (pref.unsubscribedAll) return { sendable: false, reason: 'unsubscribed-all' }
+  const cats = Array.isArray(pref.unsubscribedCategories) ? (pref.unsubscribedCategories as string[]) : []
+  if (cats.includes(category)) return { sendable: false, reason: 'unsubscribed-category' }
+  return { sendable: true }
+}

package/src/server/email/registry.ts

@@ -0,0 +1,38 @@
+import type { ReactElement } from 'react'
+
+export type EmailLocale = 'zh' | 'en'
+
+export type EmailCategory = 'auth' | 'team' | 'notification' | 'billing' | 'product'
+
+export interface EmailTemplateProps {
+  locale: EmailLocale
+}
+
+export type EmailSubject = string | ((vars: Record<string, unknown>) => string)
+
+export interface TemplateMeta<TProps = EmailTemplateProps> {
+  key: string
+  category: EmailCategory
+  transactional: boolean
+  subject: { zh: EmailSubject; en: EmailSubject }
+  component: (props: TProps) => ReactElement
+}
+
+// any 为刻意的类型逃逸：模板 props 由各模板组件自带签名，
+// Map 需接受任意 props 形状；消费端（outbox）用运行时插值传 vars。
+const REGISTRY = new Map<string, TemplateMeta<any>>()
+
+export function registerTemplate<TProps>(meta: TemplateMeta<TProps>): void {
+  if (REGISTRY.has(meta.key)) {
+    throw new Error(`email template "${meta.key}" already registered`)
+  }
+  REGISTRY.set(meta.key, meta)
+}
+
+export function getTemplate(key: string): TemplateMeta | undefined {
+  return REGISTRY.get(key)
+}
+
+export function listTemplates(): TemplateMeta[] {
+  return [...REGISTRY.values()]
+}

package/src/server/email/sender.ts

@@ -1,27 +1,44 @@
-export interface EmailParams {
+export interface EmailMessage {
   to: string
   subject: string
-  html?: string
+  html: string
   text?: string
+  headers?: Record<string, string>
+  replyTo?: string
 }
 
-export interface EmailSender {
-  send(params: EmailParams): Promise<void>
+export interface SendResult {
+  ok: boolean
+  messageId: string | null
+  bounced: boolean
+  error?: string
 }
 
-// 遮蔽邮箱本地部分，仅保留域名用于排查
-function maskEmail(address: string): string {
-  const [local, domain] = address.split("@")
-  return domain && local ? `${local.slice(0, 1)}***@${domain}` : "***"
+export type EmailDriver = 'smtp' | 'resend' | 'console'
+
+export function resolveDriver(): EmailDriver {
+  const v = process.env.EMAIL_DRIVER
+  if (v === 'smtp' || v === 'resend' || v === 'console') return v
+  return 'console'
 }
 
-export function getEmailSender(): EmailSender {
-  return {
-    send: async (params) => {
-      console.log(`[email] To: ${maskEmail(params.to)}, Subject: ${params.subject}`)
-      if (params.text) {
-        console.log(`[email] Text: ${params.text.length} chars`)
-      }
-    },
+export async function sendByDriver(msg: EmailMessage): Promise<SendResult> {
+  const driver = resolveDriver()
+  try {
+    if (driver === 'smtp') {
+      const { sendBySmtp } = await import('./drivers/smtp')
+      const r = await sendBySmtp(msg)
+      return { ok: true, ...r }
+    }
+    if (driver === 'resend') {
+      const { sendByResend } = await import('./drivers/resend')
+      const r = await sendByResend(msg)
+      return { ok: true, ...r }
+    }
+    const { sendByConsole } = await import('./drivers/console')
+    const r = await sendByConsole(msg)
+    return { ok: true, ...r }
+  } catch (err) {
+    return { ok: false, messageId: null, bounced: false, error: err instanceof Error ? err.message : String(err) }
   }
-}
+}

package/src/server/email/templates/_base/button.tsx

@@ -0,0 +1,12 @@
+import { Button } from '@react-email/components'
+
+export function EmailButton({ href, label }: { href: string; label: string }) {
+  return (
+    <Button
+      href={href}
+      className="bg-fg text-base text-fg-inverted inline-block rounded-lg px-7 py-4 text-center font-sans leading-6"
+    >
+      {label}
+    </Button>
+  )
+}

package/src/server/email/templates/_base/email-layout.tsx

@@ -0,0 +1,117 @@
+import type { ReactNode } from 'react'
+import { Body, Container, Head, Heading, Html, Img, Link, Section, Tailwind, Text } from '@react-email/components'
+import { allblueTailwindConfig } from './theme'
+import { AllblueFonts } from './theme-fonts'
+import type { EmailLocale } from '../../registry'
+
+const LOGO_URL = `${process.env.VITE_APP_URL ?? 'https://allblue.local'}/logo/allblue-logo-light.png`
+
+const SLOGAN: Record<EmailLocale, string> = {
+  zh: 'AllBlue · 理想之海 — 让每一个想法被看见。',
+  en: 'AllBlue — Where every idea finds its sea.',
+}
+
+const TRANSACTIONAL_FOOTER: Record<EmailLocale, string> = {
+  zh: '这是一封事务性邮件，您之所以收到它是因为您在 AllBlue 有账号操作。',
+  en: 'You received this transactional email because of an action on your AllBlue account.',
+}
+
+const UNSUBSCRIBE_LABEL: Record<EmailLocale, string> = {
+  zh: '退订',
+  en: 'Unsubscribe',
+}
+
+const UNSUBSCRIBE_HINT: Record<EmailLocale, string> = {
+  zh: '不想再收到这类邮件？',
+  en: "Don't want these emails?",
+}
+
+const NOTIFICATION_FOOTER: Record<EmailLocale, string> = {
+  zh: '这是 AllBlue 的通知邮件，可通过下方链接退订。',
+  en: 'This is a notification from AllBlue. Unsubscribe via the link below.',
+}
+
+export interface EmailLayoutProps {
+  locale: EmailLocale
+  children: ReactNode
+  preview?: string
+  heading?: string
+  unsubscribeUrl?: string
+  footerKind?: 'transactional' | 'notification'
+}
+
+export function EmailLayout({
+  locale,
+  children,
+  preview,
+  heading,
+  unsubscribeUrl,
+  footerKind = 'transactional',
+}: EmailLayoutProps) {
+  const footer =
+    footerKind === 'notification'
+      ? NOTIFICATION_FOOTER[locale]
+      : TRANSACTIONAL_FOOTER[locale]
+  return (
+    <Tailwind config={allblueTailwindConfig}>
+      <Html>
+        <Head>
+          <AllblueFonts />
+        </Head>
+        <Body className="bg-bg-2 m-0 font-sans text-center">
+          <Container className="mobile:mt-0 mx-auto mt-8 w-full max-w-[640px]">
+            <Section>
+              <Section className="bg-bg mobile:px-2 px-6 py-4">
+                <Section className="mb-3 px-6 text-left">
+                  <Img
+                    src={LOGO_URL}
+                    alt="AllBlue"
+                    width={32}
+                    className="inline-block align-middle"
+                  />
+                </Section>
+
+                <Section className="bg-bg-2 mobile:px-6 mobile:py-12 rounded-[8px] px-[40px] py-[64px] text-center">
+                  <Section className="mb-6">
+                    <Img
+                      src={LOGO_URL}
+                      alt="AllBlue"
+                      width={48}
+                      className="mx-auto mb-5 block"
+                    />
+                  </Section>
+                  {heading ? (
+                    <Heading as="h1" className="text-3xl text-fg m-0 mb-6 font-sans">
+                      {heading}
+                    </Heading>
+                  ) : null}
+                  {children}
+                </Section>
+
+                {/* Footer — 无办公地址 */}
+                <Section className="bg-bg">
+                  <Section className="px-6 py-10 text-center">
+                    <Text className="text-sm text-fg-3 mx-auto mt-0 mb-8 max-w-[280px] text-center font-sans">
+                      {SLOGAN[locale]}
+                    </Text>
+                    <Text className="text-xs text-fg-3 mt-4 mb-5 text-center font-sans">
+                      {footer}
+                    </Text>
+                    {unsubscribeUrl ? (
+                      <Text className="text-xs text-fg-3 m-0 text-center font-sans">
+                        {UNSUBSCRIBE_HINT[locale]}{' '}
+                        <Link href={unsubscribeUrl} className="text-fg-3 underline">
+                          {UNSUBSCRIBE_LABEL[locale]}
+                        </Link>
+                      </Text>
+                    ) : null}
+                  </Section>
+                </Section>
+              </Section>
+            </Section>
+          </Container>
+        </Body>
+      </Html>
+    </Tailwind>
+  )
+}

package/src/server/email/templates/_base/theme-fonts.tsx

@@ -0,0 +1,43 @@
+import { Font } from '@react-email/components'
+
+export function AllblueFonts() {
+  return (
+    <>
+      <style
+        dangerouslySetInnerHTML={{
+          __html: `@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');`,
+        }}
+      />
+      <Font
+        fontFamily="Inter"
+        fallbackFontFamily={['Arial', 'sans-serif']}
+        webFont={{
+          url: 'https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuOKfMZg.ttf',
+          format: 'truetype',
+        }}
+        fontWeight={400}
+        fontStyle="normal"
+      />
+      <Font
+        fontFamily="Inter"
+        fallbackFontFamily={['Arial', 'sans-serif']}
+        webFont={{
+          url: 'https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fMZg.ttf',
+          format: 'truetype',
+        }}
+        fontWeight={500}
+        fontStyle="normal"
+      />
+      <Font
+        fontFamily="Inter"
+        fallbackFontFamily={['Arial', 'sans-serif']}
+        webFont={{
+          url: 'https://fonts.gstatic.com/s/inter/v20/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYMZg.ttf',
+          format: 'truetype',
+        }}
+        fontWeight={600}
+        fontStyle="normal"
+      />
+    </>
+  )
+}

package/src/server/email/templates/_base/theme.ts

@@ -0,0 +1,22 @@
+import type { TailwindConfig } from '@react-email/components'
+
+export const allblueTailwindConfig: TailwindConfig = {
+  theme: {
+    extend: {
+      colors: {
+        bg: '#FFFFFF',
+        'bg-2': '#F3F4F6',
+        fg: '#14171E',
+        'fg-2': '#43454B',
+        'fg-3': '#7B7D81',
+        'fg-inverted': '#FFFFFF',
+        stroke: '#F0F0F0',
+        'stroke-strong': '#E4E4E7',
+        brand: '#2563eb',
+      },
+      fontFamily: {
+        sans: ['Inter', 'system-ui', 'Arial', 'sans-serif'],
+      },
+    },
+  },
+}